跨域问题解决

后端解决方案

  • 设置Access-Control-Allow-Origin响应头来允许特定的前端域名访问资源

    Access-Control-Allow-Origin: https://your-frontend-domain.com

    如果需要在跨域请求中携带 Cookie(例如,用于用户身份验证),后端需要设置 Access-Control-Allow-Credentials 为 true,并且不能将 Access-Control-Allow-Origin 设置为 *。eg:
    Access-Control-Allow-Credentials: true

前端解决方案

  • 使用devserver配置代理

    module.exports = {
    devServer: {
    proxy: {
    '/api': { // 匹配所有到 /api 的请求
    target: 'http://aider.meizu.com', // 目标服务器的地址
    changeOrigin: true, // 是否改变请求头中的Origin字段
    pathRewrite: {
    '^/api': '' // 重写请求路径,去掉路径中的 /api
    }
    }
    }
    }
    };

  • 跨域浏览器(如果开发环境复杂,需要跨域浏览器辅助绕过跨域限制)

    1、可以先复制粘贴一个副本浏览器快捷键,再右键浏览器,点击属性
    2、找到快捷方式,找到目标,目标输入框内容最后面加上 --disable-web-security --user-data-dir=C:\ChromeDevSession
    3、点击确定
    4、重新打开浏览器即可

相关推荐
har01d几秒前
【CSS3】录音中。。。
前端·css·vue.js·vue·vue3·css3
艾小码4 分钟前
现代 JavaScript 基础精要:ES6+ 核心特性完全解析
前端·javascript·ecmascript 6
Cache技术分享4 分钟前
158. Java Lambda 表达式 - 构造函数方法引用的使用与实践
前端·后端
遂心_6 分钟前
用 Tailwind CSS + React 打造精美商品卡片组件
前端·javascript·css
默默地离开7 分钟前
ES6 中 `Array.map()` 方法详解与 `parseInt` 的经典陷阱
前端·javascript
wycode9 分钟前
Vue2源码笔记(4)运行时-创建一个vue实例之initState数据劫持
前端·vue.js
言兴10 分钟前
面试题深度解析:let、const 与 var 的区别
前端·javascript·面试
wycode10 分钟前
Vue2源码笔记(3)运行时-创建一个vue实例之init
前端·vue.js
朱程12 分钟前
AI 编程时代手工匠人代码打造 React 项目实战 (五):分页 & 筛选 & 阶段性思考
前端
星哥来了12 分钟前
文字转语音 edge_tts
前端·edge·语音识别