uniapp H5页面设置跨域请求

记录一下本地服务在uniapp H5页面访问请求报跨域的错误

这是我在本地起的服务端口号为8088 ip大家可打开cmd 输入ipconfig 查看

第一种方法

在源码视图中配置

复制代码
"devServer": {
			"https": false, // 是否启用 https 协议,默认false
			"port": 8080,
			"proxy": {
				"/devapi": {
					"target": "http://XXXXXXXXXX:8088",
					"changeOrigin": true, //是否跨域
					"secure": false, // 设置支持https协议的代理
					"pathRewrite": {
						"^/devapi": ""
					}
				}
			}
		},

第二种方法 新建vue.config.js

复制代码
// module.exports = {
// 	devServer: {
// 		port: 8080,
// 		disableHostCheck: true,
// 		proxy: {
// 			"/devapi": {
// 				"target": "http://XXXXXXXXXX:8088",
// 				"changeOrigin": true, //是否跨域
// 				"secure": false, // 设置支持https协议的代理
// 				"pathRewrite": {
// 					"^/devapi": ""
// 				}
// 			}
// 		}
// 	}
// }

因为我这里转发的前缀是 /devapi 所以要在基本请求路径后拼接上前缀(封装请求的文章请看我上一篇)

这个是我服务的请求路径 (参考) 前端只是加了一个前缀方便转发

最后效果图

相关推荐
Jinuss1 分钟前
Vue3源码reactivity响应式篇之computed计算属性
前端·vue3
落日沉溺于海1 分钟前
React From表单使用Formik和yup进行校验
开发语言·前端·javascript
知识分享小能手3 分钟前
React学习教程,从入门到精通, React 新创建组件语法知识点及案例代码(11)
前端·javascript·学习·react.js·架构·前端框架·react
会豪6 分钟前
工业仿真(simulation)--前端(五)--标尺,刻度尺
前端
会豪7 分钟前
工业仿真(simulation)--前端(四)--画布编辑(2)
前端
an__ya__9 分钟前
Vue数据响应式reactive
前端·javascript·vue.js
苦逼的搬砖工12 分钟前
Flutter UI Components:闲来无事,设计整理了这几年来使用的UI组件库
前端·flutter
想买Rolex和Supra的凯美瑞车主14 分钟前
Taro + Vite 开发中 fs.allow 配置问题分析与解决
前端
ruanCat15 分钟前
使用 vite 的 base 命令行参数来解决项目部署在 github page 的路径问题
前端·github
Codebee21 分钟前
使用Qoder 改造前端UI/UE升级改造实践:从传统界面到现代化体验的华丽蜕变
前端·人工智能