1. 新增: util/config.js 配置 baseUrl

export default {
	baseUrl: "https://xxxx.com"
}   

2. 新增: util/request.js 封装请求

import  config  from "./config.js"
export const request = (options) => {
	return new Promise((resolve, reject) => {
		let token = uni.getStorageSync('authorization')
		// 在登录的时候需要储存 token uni.setStorageSync("authorization","这里是登录获取的token值")
		uni.request({
			url: config.baseUrl + options.url,
			data: options.data || {},
			method: options.method || 'POST',
			header: options.header || {
				// 根据实际接口设计 key 取 token 或者 authorization
				authorization: token,
			},
			success: (res) => {
				console.log(res.data); // 控制台显示数据信息
				resolve(res.data)
			},
			fail: (err) => {
				// 页面中弹框显示失败
				uni.showToast({
					title: '请求接口失败'
				})
				// 返回错误消息
				reject(err)
			},
			catch: (e) => {
				console.log(e);
			}
		})
	})
}
// 将对象导出外部引入使用
export default {
	request
}

3.修改: main.js 挂载请求

新增如下内容

import Vue from 'vue'
import request from './util/request.js'
4. 使用测试
this.$request.request({
				url: '/ping',
				method: 'GET',
			}).then(res => {
				console.log("------res------",res)
			})

打印结果
------res------ [object] {“code”:200,“data”:“PONG”,“err”:{“code”:0,“msg”:""},“msg”:“OK”} at pages/user/bindphone1/bindphone1.vue:27

todo : 前端判断 token 过期自动跳转登录界面

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐