跨域问题解决

后端解决方案

  • 设置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、重新打开浏览器即可

相关推荐
鸽鸽30 分钟前
别急着装第三方库,这些事浏览器原生就能做到——Web Native API 实战指南
前端
做前端的娜娜子32 分钟前
从 0 到 1 打造一个配置可视化后台:一次前端配置中心化改造的实战复盘
前端·设计模式·数据可视化
南雨北斗37 分钟前
vue3 RouterLink链接颜色修改的方法
前端
Richard.Wong37 分钟前
Windows IIS 服务器部署 Vue3 前端项目详细流程
服务器·前端·windows
数据知道38 分钟前
XSS 攻防全解:反射型、存储型、DOM 型实战演示
前端·安全·web安全·网络安全·xss
Nemo_XP39 分钟前
C# gridlookupedit选中内容重复还原操作
服务器·前端·c#
大家的林语冰1 小时前
🎉 Vercel 官宣 Next 16.3 正式发布,GitHub 第一全栈框架再次进化!
前端·javascript·前端框架
不爱说话郭德纲2 小时前
我只给了 TRAE Work 一张差评截图,它最后却把自己的 P0 结论推翻了?
前端·后端·架构
用户938515635072 小时前
从 DOM 编程到声明式 UI:React useRef 与 useState 底层全解析
前端·javascript·react.js
kisshyshy2 小时前
前端路由进化史:从刷新白屏到SPA,手写一个Hash路由就懂了!
前端·javascript·react.js