uni-app的h5/小程序/app 网络请求，解决本地环境和生产环境网络请求问题

本篇的重点在于解决h5/小程序/app这三端在本地和生产环境的网络请求问题
全部代码贴在了全文最后

思路：

首先要理解这三个端的特性，h5会有跨域问题需要反向代理，小程序和app不需要反向代理，同时小程序还得用https域名。

一、h5，

一般会跨域需要反向代理。所以要在mainifest.json设置反向代理。在请求接口时，还得拼个/api前缀

// 配置代理"devServer" : {"proxy" : {"/api" : {"target" : "http://192.168.1.193:8999","changeOrigin" : true, //是否跨域"secure" : false, // 设置支持https协议的代理"pathRewrite" : {"^/api" : ""}}}}

let url ='/api/system/login'

本地调试是loacalhost:808几，

正式环境的话，会变成ip或域名前缀+/api/system/login，后端需要配置一下nginx代理，将api替换一下

二、小程序

不需要反向代理，直接请求。所以请求接口不需要拼api前缀。
但需要https域名，所以本地环境测试时开启‘不校验合法域名……’
1.在微信开发者工具，点击详情>本地设置

2.开启‘不校验合法域名……’

在微信公众平台https://mp.weixin.qq.com/ ，扫码登录小程序，点击开发>开发管理，找到服务器域名，

// #ifdef MP
if (process.env.NODE_ENV === 'development') {BASE_URL = "http://192.168.1.193:8999"
} else {BASE_URL = "https://www.baidu.com"
}
// #endif

小程序本地环境，request网络请求地址是后台服务地址，接口不要/api前缀

let url = BASE_URL + '/system/login'

小程序生产环境，request网络请求地址要https://域名，并且要api前缀，因为域名一般对应的是前端页面，域名+api后缀，api经过了后端nginx替换，就表示是后端服务地址

let url = BASE_URL + '/api/system/login'

拓展：如果要修改 request 合法域名
注意：
① 域名只支持 https 协议
② 域名不能使用 IP 地址或 localhost
③ 域名必须经过 ICP 备案
④ 服务器域名一个月内最多可申请 5 次修改

三、app

不需要反向代理，直接请求。所以请求接口不需要拼api前缀

// #ifdef APP-PLUS
BASE_URL = "http://192.168.1.193:8999"
// #endif

let url = BASE_URL + '/system/login'

request.js全部代码：

import $common from './common.js';//vuex
// import $store from '../store/index.js';//vuex
// 全局请求路径，也就是后端的请求基准路径
let BASE_URL = ""
// #ifdef H5
BASE_URL = process.env.BASE_API
// #endif
// #ifdef APP-PLUS
BASE_URL = "http://192.168.1.193:8999"
// #endif
// #ifdef MP
if (process.env.NODE_ENV === 'development') {BASE_URL = "http://192.168.1.193:8999"
} else {BASE_URL = "https://www.baidu.com"
}
// #endif
const request = (options = {}) => {options.url = !BASE_URL ? options.url : (BASE_URL + options.url)options.header = options.headersoptions.data = options.dataoptions['sslVerify'] = falselet TOKEN = $common.getStorage("token") //TOKENif (TOKEN) {if (options.headers) {options.headers['Authorization'] = TOKEN;} else {options.headers = {"Content-type": "application/json;charset=utf-8",},options.headers['Authorization'] = TOKEN;options.header = options.headers}}return new Promise((resolve, reject) => {console.log("options", options);options.success = function (res) {console.log("res", res);let code = res.data.code;uni.hideLoading();if (code != 200) {if (['401', 'B0005', 'A0076'].indexOf(code) != -1) {//清空tokenuni.removeStorageSync("token");uni.removeStorageSync("sysUser");uni.showToast({title: '登陆失效',duration: 2000,icon: 'none',});}}//系统异常if (code == "B0001") {uni.showToast({title: '请求失败，请稍后重试',duration: 2000,icon: 'none',});return;}resolve(res)}options.fail = function (err) {console.log("err", err);uni.hideLoading();reject(err)}uni.request(options)})
}
export default request