uniapp 发起post和get请求!uni.request(OBJECT)

uni-app中,发起HTTP请求主要通过uni.request方法实现。

Get请求

使用uni.request请求api,并且将 method参数设置为GET,有参数的话直接data:{}传递,

success是请求成功回调函数,fail是失败函数

        	<button @click="getTime"> 点击获取时间</button>



            getTime(){
			 uni.request({
			   url: 'http://localhost:5017/test', // 接口地址
			   method: 'GET', // 请求方法
			   data: {
			     id: '1',			
			   },
			   success: (res) => {
			     console.log('GET 请求成功返回服务器时间', res.data);
			   },
			   fail: (err) => {
			     console.log('GET 请求失败', err);
			   }
			 });

		 }

测试一下后端为.net6 api

请求成功!get将参数拼接在请求url后面

Post请求

post请求如果发送的是json数据格式要加上

header: {

'Content-Type': 'application/json' // 如果需要以JSON格式发送数据

},头部请求信息设置参数格式是json格式

<button @click="send">post请求</button>


send(){
	
	uni.request({
	  url: 'http://localhost:5017/login', // 接口地址
	  method: 'POST', // 请求方法
	  data: {
	    username: 'zhangsan',
	    password: '12356'
	  },
	  header: {
	    'Content-Type': 'application/json' // 如果需要以JSON格式发送数据
	  },
	  success: (res) => {
	    console.log('POST 请求成功', res.data);
	  },
	  fail: (err) => {
	    console.log('POST 请求失败', err);
	  }
	});

}

后端代码

  • uni-appuni.request方法是异步的,因此需要通过successfail回调处理响应。
  • 如果接口要求认证(例如token),可以在header里添加Authorization字段。
相关推荐
鑫宝Code几秒前
【TS】TypeScript中的接口(Interface):对象类型的强大工具
前端·javascript·typescript
和你一起去月球几秒前
TypeScript - 函数(下)
javascript·git·typescript
_Legend_King6 分钟前
vue3 + elementPlus 日期时间选择器禁用未来及过去时间
javascript·vue.js·elementui
爱吃青椒不爱吃西红柿‍️7 分钟前
华为ASP与CSP是什么?
服务器·前端·数据库
余生H8 分钟前
transformer.js(三):底层架构及性能优化指南
javascript·深度学习·架构·transformer
一棵开花的树,枝芽无限靠近你11 分钟前
【PPTist】添加PPT模版
前端·学习·编辑器·html
陈王卜14 分钟前
django+boostrap实现发布博客权限控制
java·前端·django
景天科技苑22 分钟前
【vue3+vite】新一代vue脚手架工具vite,助力前端开发更快捷更高效
前端·javascript·vue.js·vite·vue项目·脚手架工具
SameX23 分钟前
HarmonyOS Next 安全生态构建与展望
前端·harmonyos
石小石Orz30 分钟前
Three.js + AI:AI 算法生成 3D 萤火虫飞舞效果~
javascript·人工智能·算法