uniapp 本地测试请求跨域问题处理

问题描述

项目开发中，本地测试使用uniapp API uni.request() 时出现跨域报错问题；如下：

解决方案

1. 找到项目中的manifest.json文件，下拉找到 "H5"：相关配置；添加如下配置

"h5":{
  "devServer" : {
            "port" : 8800,//本地测试H5网址的端口，如:http://localhost:8800
            "disableHostCheck" : true,
            "proxy" : {
                "/api" : {
                    "target" : "https://xxx.xxxxxxx.com", // 代理的IP地址，域名；
                    "changeOrigin" : true,
                    "secure" : true,
                    "pathRewrite" : {
                        "^/api" : ""
                    }
                }
            },
            "https" : false
        }
}

2. 在vue文件中调用uni.request()方法时，注意url的填写：

uni.request({
  url:"/api/login/loginInfo",
  method:"POST",
  success:(res) =>{
    ...
  }
})

属性名	类型	说明
target	String	代理的API地址，就是需要跨域的API地址，如"https://www.xxxxxxx.com"
pathRewrite	Boolean	路径重写，将"api"用正则替换成了空字符串修改最终请求的API路径。
changeOrigin	Boolean	这个参数可以让target参数是域名。
secure	Boolean	是否检查安全问题（http与https）
proxy	Object	代理配置

---

求点赞 求评论 求收藏 ~~ 相互关注指点一波 ~~ 求点赞 求评论 求收藏