小程序没有跨域问题存在,但是H5有
所以如果发布了H5,出现跨域问题。那么应该在整个环境的配置时要注意:
比方说,我们接口为:
/api/mobile/login
/api/mobile/logout
如果我们已经将接口发布到服务器上了,如果说服务器ip为10.4.13.1,端口为8080
小程序访问的时候,应每次都要带上ip和端口。
但是H5,如果带上ip和端口,那么就会出现跨域问题出现。
如何解决这个问题?
应该把小程序和H5的环境区分开来:

url='/api/mobile/login'
//#ifndef H5
if (!/http:|https:/.test(url)) {
	url = 'http://10.4.13.1:8080' + url;
}
//#endif

这个时候如果什么都不做,小程序是没问题的,而H5访问不到任何数据,
针对H5,我们应在服务器的nginx上改下配置,

location /api {
     proxy_pass http://localhost:8080/api;
 }

这样的话,H5发布后访问就没有任何问题了,因为是同一个域下

而如果在开发过程中,如果解决跨域问题:
打开mainfest.json,添加如下内容:

"h5" : {
   "devServer" : {
        "disableHostCheck" : true,
        "proxy" : {
            "/api" : {
                "target" : "http://10.4.13.1:8080/api",
                "changeOrigin" : true,
                "secure" : false,
                "pathRewrite" : {
                    "^/api" : ""
                }
            }
        }
    }
}
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐