uniapp APP开发跨域问题

14 篇文章 0 订阅

第一次开发APP, 调试时连接本地服务器遇到跨域问题 百度了一百次以上,在最后一天找到了答案

1.首先电脑端调试的时候,和普通vue项目一样,新建一个vue.config.js,代码如下,配置反向代理

module.exports = {
	"devServer": {
		"port": 3264, //浏览器运行端口
		"https": false,
		"proxy": {
			"/backend": {
				"target": "http://192.168.1.213:8082/admin",
				"changeOrigin": true,
				"secure": false,
				"pathRewrite": {
					"^/backend": ""
				}
			}
		}
	}
}

这样就解决了本地调试时的跨域问题

2.其次在封装的request.js文件中添加条件判断

	return new Promise((resolve, reject) => {
		let url = '/backend' + prams.url; //请求的网络地址和局地的api地址组合
		let method = prams.method.toUpperCase()
		uni.showLoading({
			title: '加载中',
			mask: true
		})
		return uni.request({
			 // #ifdef H5
			 url: url,//H5下
			 // #endif
			 // #ifndef H5
			 url: 'http://192.168.1.213:8082/admin'+prams.url, //非H5下(即APP下)
			 // #endif

			// url: url,
			data: prams.data,
			method: method,
			header: headerData,
		)}
	 })

*重点就是ifdef里面的代码,url在打包成app的时候,是没有跨域问题的,所以不走反向代理,我们需填写完整的请求路径
就这么简单的东西,好长一段时间都没解决

  • 4
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 10
    评论
评论 10
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值