vue+iview后台管理系统util.ajax跨域问题的解决方法
2023-09-11 14:15:07 时间
问题描述
vue+iview项目启动出现了跨域问题 No 'Access-Control-Allow-Origin' header is present on the requested resource
修改webpack.dev.config.js
在webpack.dev.config.js中module.exports添加如下devServer。作者在package.json做了一些关于webpack-dev-server的基础配置如下:
"scripts": {
"dev": "webpack-dev-server --content-base ./ --open --inline --hot --compress --history-api-fallback --config build/webpack.dev.config.js",
}
devServer添加proxy配置
devServer: {
port: 8089,
proxy: {
'/api': { // 这个api是你自己项目路由地址,表示api地址路径都走这个代理。
target: 'http://127.0.0.1:8080', // target 是你的后端项目地址
pathRewrite: {'^/api' : ''},
changeOrigin: true
}
}
}
然后在后端设置下允许跨域。
相关文章
- 【Vue】Vue中的data数据包含html标签元素的解决方法
- 【Vue】通过v-show和v-if实现对html元素的隐藏显示渲染(图文+完整示例)
- Vue - 实现 PC 图片全屏放大预览(支持多图、切换、缩放、旋转、放大缩小、拖动、图片标题、键盘关闭、缩放比例、循环查看等等)
- Vue - 利用 data-* 做不同页面之间的切换
- vue.js-详解三大流行框架VUE_快速进阶前端大咖-Vue基础
- vue项目如何监听窗口变化,达到页面自适应?
- Vue实战系列(一) - 最简化登录页面
- 后台(一)vue+element-ui(全局配置)
- Vue 爬坑之路(一)—— 使用 vue-cli 搭建项目 (增补)
- Vue项目 跨域 解决方案与 vue.config.js 配置解析
- vue实战入门进阶篇九:vue+elementui实现网站后台-系统设置界面实现
- vue学习笔记七:Jquery VS Vue之杂项方法明细对照
- vue响应式原理之reactive与shallowReactive
- Vue富文本编辑器的使用vue-quill-deitor
- Vue 安装“npm install -g @vue/cli”发生npm WARN deprecated request@2.88.2: request has been deprecated,的错误解决方法
- vue清空数组的几个方式(小结)
- 浅谈vue中插件的使用方法Vue.use(xxx),原理及实现
- vue.js 获取标签属性值
- vue基础八(路由组件)
- 前端技术:vue(Vue项目中-axios设置默认请求地址和请求头)
- Vue学习第19天——vue脚手架配置代理
- Vue学习第13天——vue中使用自定义插件
- 【VUE】vue配置Gzip压缩
- 【chatgpt】教你如何创建一个Vue脚手架
- vue跨界域名报错,后台解决方法(未实测,仅供参考)
- 【转载】vue cli 3.0下配置开发环境下的sourcemap