失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > 本地调试H5 如何设置接口的请求代理proxy 解决跨域问题(共2步)。

本地调试H5 如何设置接口的请求代理proxy 解决跨域问题(共2步)。

时间:2023-01-07 12:39:29

相关推荐

本地调试H5 如何设置接口的请求代理proxy 解决跨域问题(共2步)。

第1步:在http目录的index.js中设置baseUrl的值为/api

// http/index.js (该项目使用的是luch-request插件,封装请求处理)...http.setConfig( (config) => {/* 设置全局配置 */// #ifdef H5config.baseURL = process.env.VUE_APP_BASE_API, // 读取环境文件,变量值为“/api”config.header = {'Content-Type': 'application/x-www-form-urlencoded'}// #endif// #ifdef MP-WEIXINconfig.baseURL = ""; /* 根域名不同 */// #endifconfig.header = {...config.header,}return config})...

// .env.development# just a flagENV = 'development'# base apiVUE_APP_BASE_API = '/api'VUE_APP_IMAGE_BASE_URL = ''

第2步:在manifest.json-》"源码视图"-》“h5”属性下添加devServer属性的相关代理配置即可。

{...."h5" : {"router" : {"base" : "./","mode" : "hash"},"devServer" : {"port" : 8081,"disableHostCheck" : true,"proxy" : {"/api" : {"target" : "","changeOrigin" : true,"secure" : false,"pathRewrite" : {"^/api" : ""}},"/file" : {"target" : "","changeOrigin" : true,"secure" : false,"pathRewrite" : {"^/file" : "/rygl"}}},"https" : false},"template" : "template.html"}}

如果觉得《本地调试H5 如何设置接口的请求代理proxy 解决跨域问题(共2步)。》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。