谷歌浏览器扩展程序一键解决本地开发跨域问题，让你不用乱mock数据

最新推荐文章于 2026-05-18 12:31:39 发布
原创 最新推荐文章于 2026-05-18 12:31:39 发布 · 1.2k 阅读 · 0 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
博客介绍了利用谷歌浏览器扩展程序解决本地开发跨域问题的方法。可在谷歌网上应用商店搜索相关工具添加，若无法翻墙可下载工具包，将文件拖入拓展管理界面。添加成功后，点击浏览器右上角图标打开开关，即可允许跨域。

谷歌浏览器扩展程序一键解决本地开发跨域问题，让你不用乱mock数据
1.在谷歌浏览器中打开它的网上应用商店 （需要翻墙）；如果你无法翻墙可以下载我的这个工具包
1.1工具包用法：在谷歌浏览器上输入：chrome://extensions/ 进入拓展管理界面然后将刚刚下载的工具包中的1.0.3_0.ctx文件拖进来就可以 用了！
这里写图片描述

2.然后在搜索框中输入：Access-Control-Allow-Origin，在回车搜索一下，就会有图片的结果；
这里写图片描述

3.在上图第一个工具中点击添加至Chrome进行添加；

4.添加成功后就会在浏览器的右上角出现一个绿色的图标（如果你是老司机装的拓展太多可能不能在这里显示，去哪里找它你懂的），点击图标它就会出现下面的操作界面，好吧就一个开关按钮，将按钮点开了就表示已经允许你在该浏览器跨域了！
这里写图片描述

谷歌浏览器插件开发跨域问题（完美解决）
qq_66579387的博客
03-01 8199
谷歌浏览器插件开发跨域问题（完美解决）跨域问题解决方法先配置manifest.json文件创建background脚本：GET请求background脚本POST请求background脚本调用方法 跨域问题 了解Content Security Policy（CSP）： Manifest V3引入了一种名为Content Security Policy (CSP) 的新安全模型。确保你的插件的代码和外部资源遵循CSP规则，以避免可能的安全问题。 报错代码如下Access to fetch at ‘http
Chrome 插件开发 V3版本 跨域处理
银滴子的博客
11-07 2690
实现思路是:content.js 使用chrome.runtime.sendMessage 发送消息，background.js 使用 chrome.runtime.onMessage.addListener 方法进行监听，当监听收到发送的消息时，我们在background.js 上进行请求调用。相当于在一个隐藏的浏览器页面内默默运行。manifest.json：相当于插件的 meta 信息，包含插件的名称、版本号、图标、脚本文件名称等，这个文件是每个插件都必须提供的，其他几部分都是可选的。
【免费下载】 打破跨域壁垒：跨域CORS扩展插件Chrome推荐
最新发布
gitblog_09711的博客
05-18 1018
在Web开发的世界里，跨域问题一直是前端工程师们头疼的难题。无论是H5开发还是前后端分离的项目，跨域限制常常成为开发过程中的绊脚石。为了解决这一痛点，我们推出了**跨域CORS扩展插件Chrome**，这是一款专为Chrome浏览器设计的开发者工具，旨在帮助开发者轻松应对跨域访问限制，提升开发效率。 ## 项目技术分析 跨域CORS扩展插件Chrome的核心功能是通过修改浏览器的请求头，绕过C
chrome解决跨域（CORS）问题---chrome插件
松门一枝花
07-04 2万+
转自  http://hectorguo.com/zh/cross-origin-solve/   chrome中跨域问题，可以安装插件解决， 插件地址  https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi
Chrome添加扩展程序
欢迎来到我的博客
05-12 1万+
Chrome之所以强就强在它的扩展程序，那么如何添加Chrome扩展程序呢？ 如果进行翻墙的话，那样最好，可以直接通过在商店里进行下载。如果不能进行翻墙的话，也可以通过其他的方式进行扩展程序的安装，方法如下： 可以通过第三方插件网站下载离线文件来安装，比如Extfans扩展迷。【扩展迷】 但是在进行安装的过程中，有的电脑会出现无法安装的情况，提示信息【无法从该网站添加应用、扩展程序和应...
解决浏览器 CORS跨域问题
king_zzzzz的博客
07-11 1504
requtly 插件 CORS 跨域
解决本地浏览器的跨域问题
毒王的博客
03-13 1904
首先作为开发，当我们有需求的时候，我们需要和后端合作开发，但是后端只定义好了接口，和接口字段没有开发完，这个时候 我们前端开发要mock一下数据，不能直接用本地的json文件，我们应该用ajax或者别的请求来获得数据，因为浏览器本身的同源策略的影响，会有跨域的问题，以下是本地开发解决跨域问题的方法 1、首先我们先将电脑上的谷歌浏览器复制一个快捷方式 2、将复制后的重复名一下 改为 Google-D...
调用后台的接口跨域问题
canvas_hua的博客
11-11 3747
（不要尝试用json去解决ajax跨域问题，jsonp必须后台提供特定接口） 在调用后台的接口之前，可以先通过mock数据调试 a)让后台在程序里面允许，ajax跨域（不安全） b)把写好的代码直接部署到服务器上查看效果（稍微麻烦点，需要频繁的提交代码，可能会跟别的同事代码冲突） c)把所有的代码都下载到本地，本地开启服务器调试（需要在本地部署） d)谷歌浏览器设置开放跨域
给swagger写个基于mock模拟数据的谷歌插件
weixin_42581530的博客
08-22 488
一个谷歌插件，基于mock.js给swagger ui接口模拟数据
无需后台配置！所有网站通用！教你如何一招解决跨域问题 浏览器端使用插件解决跨域问题 让你开发不再受阻碍 windows mac都能使用的方法
代码简单说 Vue、JAVA、PHP、Node.js 熟练运用，接口、架构、性能全搞定。
10-23 946
跨域问题源自浏览器的同源策略（该策略限制了浏览器从一个源加载的脚本只能访问该源的资源。比如，如果你的网站运行在·http://localhost:3000·，而你想请求·http://api.example.com·的数据，由于源不同，浏览器会阻止该请求。解决跨域问题最常见的方式是让后端设置CORS头，允许客户端发送跨域请求。然而，在某些场景下，前端开发者可能无法控制后端，或者你只是想在开发环境中进行测试，这时可以使用浏览器插件来修改请求头。
谷歌浏览器代理扩展程序插件SwitchyOmega安装使用教程
热门推荐
shifengboy的博客
02-25 4万+
SwitchyOmega是Chrome浏览器上的代理扩展程序,可以轻松快捷的管理和切换多个代理设置。接管浏览器代理方式，可瞬间切换代理和本地连接方式，配合socks5（等其他代理工具）可实现只代理部分国内无法访问的网站。 一、安装 1、在线安装 直接从Chrome应用商店来安装：https://chrome.google.com/webstore/detail/padekgcemlokbadohgkifijomclgjgif 但是考虑到国内同学无法访问外网，该方法可行性不大。。。 2、离线安装 去githu
Chrome插件打包成crx文件
牛八少爷的专栏
08-24 1万+
Chrome插件需要翻墙安装，我们安装完成后可以打包，方便后面使用； 1. 打开“扩展程序” Chrome地址栏直接输入：chrome://extensions/ 或者： 2. 选择需要的插件并查看ID 3. 通过ID找到插件目录 先找到Chrome安装目录的插件目录Chrome\User Data\Default\Extensions，可以看到所有插件： 进入laoah...
解决Goole浏览器跨域项目跨域的问题
Hza_1031的博客
03-22 1249
查询后，修改为“Disabled”，并Relaunch重新启动下，点击后会自动重启浏览器。进入谷歌浏览器，在网址栏输入下方路径访问。重启后，就解决了此跨域问题。接着输入下方关键词查询。
国内第三方Chrome插件下载网站
collide__的博客
08-18 9050
国内第三方Chrome插件下载网站对于无法去翻墙去科学上网的朋友来说，下载个Chrome插件还是比较困难的。如果浏览器没有一些专业的插件做铺垫、那么就显示不出它的强大了、每款浏览器都有很多比较实用的插件、比如你可以根据你的职业或者爱好这类的去找你需要的插件。谷歌应用商店【官方链接】 （需要翻墙打开）一、Chrome插件网链接：http://chromecj.com/Chrome插件(谷歌浏览器插件) - 提供Chrome商店中优秀的Chrome插件推荐与下载服务。Chrome插件网致力于帮助用户找到、安装、
线上代码调试，使用Chorme的请求mock
tzz_1122的博客
10-16 1869
前端页面上展示的数据有问题，第一反应肯定是要验证是不是接口返回的数据的问题。
chrome的mock插件-Ajax Proxy（无需安装抓包工具即可mock测试数据）
Anthony路人甲的博客
06-23 8217
chrome的mock插件-Ajax Proxy（无需安装抓包工具即可mock测试数据）
常见的浏览器跨域解决方法
Zzexi的博客
03-01 1913
JSONP（JSON with Padding）是一种利用标签的src属性不受同源策略限制的特性来实现跨域数据请求的方法。JSONP通过在前端动态创建标签，并将请求的URL设置为需要跨域访问的API地址，来获取跨域数据。// 处理返回的JSON数据// 动态创建script标签var'script';;;});
谷歌浏览器解决（cors）跨域问题
jyz18838957183的博客
07-31 6351
废话不多说 直接上干货 发现在谷歌商店有一个可以解决跨域问题的插件 附上地址 可以试一试， 插件地址 https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi 解决问题的点个赞啊 ...
跨域 BUG 一键解决！程序员私藏的浏览器插件
2503_92849275的博客
08-28 6463
此外，根据不同的需求，插件还可能添加其他的请求头信息，如 Access-Control-Request-Method（用于告知服务器实际请求所使用的 HTTP 方法）、Access-Control-Request-Headers（用于告知服务器实际请求所携带的自定义请求头）等，这些头信息能够帮助服务器更好地了解跨域请求的情况，从而做出正确的响应。比如，在开发过程中，虽然使用了其他方法解决了跨域问题，但偶尔还是会出现跨域请求失败的情况，此时就可以使用该插件的请求监控功能，查看请求的详细信息，找出问题所在。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值