Mac和Window的Chrome浏览器跨域完美解决方案 | 开发调试必备（接口跨域、本地调试）
几种最简单高效的Chrome浏览器跨域解决方案：
- 命令行启动方式（最简单）
# Windows
chrome.exe --disable-web-security --user-data-dir=任意空文件夹路径
# Mac
open -n /Applications/Google Chrome.app/ --args --disable-web-security --user-data-dir=任意空文件夹路径
或者
2.手动创建（教程清晰）
Window教程
第一步：复制一份chrome浏览器在桌面，重命名（用于区分跨域和非跨域）
第二步：在c盘新建一个文件夹，命名为MyChromeDevUserData
第三步：右键点击第一步复制出来的chrome浏览器，点击属性，来到快捷方式，将 --disable-web-security --user-data-dir=C:MyChromeDevUserData,–user-data-dir粘贴在目标一栏的最后，点击确定
Mac教程
创建一个开启跨域的chrome
1.command+ 空格打开，输入automator回车打开automator
2.选择应用程序，点击选取
3.选择实用工具中的shell脚本，双击之后输入
open -n /Applications/Google Chrome.app/ --args --disable-web-security --user-data-dir=/Users/[yourname]/MyChromeDevUserData/
4.关闭并重命名，选择好位置，保存到应用程序，点击存储
5.查看 Launchpad 中，就有这个跨域的图标了
- Chrome扩展插件（推荐）
- 安装 “Allow CORS: Access-Control-Allow-Origin” 插件
- 点击插件图标开启即可
- 优点：无需重启浏览器，随开随用
- 前端临时解决方案（开发阶段）
// 使用代理服务
const proxy = {
'/api': {
target: 'http://目标域名',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
45 JSONP方式（适用于GET请求）
function jsonp(url, callback) {
const script = document.createElement('script')
script.src = url + '?callback=' + callback
document.body.appendChild(script)
}
注意事项：
- 以上方法主要用于开发调试阶段
- 生产环境建议使用正规的跨域解决方案（CORS、代理等）
- 命令行方式会创建新的Chrome实例，不影响原有的浏览器配置
- 使用完跨域调试后记得关闭相关配置，以免安全隐患
推荐使用顺序：
- 优先使用CORS插件（最方便）
- 如果插件无效，尝试命令行方式或手动创建跨域浏览器
- 开发环境可以配置代理
- 特殊场景才考虑JSONP
本文地址：https://www.vps345.com/8771.html
下一篇：Linux-进程控制
