解决本地浏览器运行项目时的跨域问题-Access to XMLHttpRequest at ‘fileDWebPractiesnewSmartCitydatafunData.json

最新推荐文章于 2024-07-02 12:39:32 发布
最新推荐文章于 2024-07-02 12:39:32 发布
阅读量1.5k 收藏 1
点赞数
分类专栏： 前端 html 文章标签： vue.js css3 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_67391521/article/details/123323535
版权

解决本地浏览器运行项目时的跨域问题-Access to XMLHttpRequest at 'file:///D:/WebPracties/xxxxxx/data/funData.json

问题描述

这几天做项目的时候，遇到这样一个问题，写了一个页面，用js动态的创建了一系列li，让其在页面上展示，获取数据的方式是通过json模拟，结果运行界面 的时候，出现了差错，我以为是代码写错了，仔细检查了一遍，发现代码，没有任何问题，看了一下报错原因，上网查了一下，发现是ajax跨域问题。
先看一下报错的样子
在这里插入图片描述

解决办法一

首先声明，这种方式只是暂时的，浏览器一经关闭则不起作用了。以谷歌浏览器为例
首先，找到你浏览器安装的位置，一般默认安装的位置C:Program FilesGoogleChromeApplication
然后、在该目录打开命令行，

最低0.47元/天 解锁文章
m0_67391521
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决本地浏览器运行项目时的跨域问题-Access to XMLHttpRequest at ‘file:///D:/WebPracties/newSmartCity/data/funData.json
丑小鸭变黑天鹅的博客
03-10 4万+
解决本地浏览器运行项目时的跨域问题-Access to XMLHttpRequest at 'file:///D:/WebPracties/xxxxxx/data/funData.json问题描述解决办法 问题描述 这几天做项目的时候，遇到这样一个问题，写了一个页面，用js动态的创建了一系列li，让其在页面上展示，获取数据的方式是通过json模拟，结果运行界面 的时候，出现了差错，我以为是代码写错了，仔细检查了一遍，发现代码，没有任何问题，看了一下报错原因，上网查了一下，发现是ajax跨域问题。 先看一下报
Access to XMLHttpRequest at ‘http://xxxx‘ from origin ‘http://xxxx‘ has been blocked by CORS policy
笑三年-Dylen
10-30 10万+
解决CORS跨域问题 今天做前后端分离的项目时, 前端向后台发送请求发现报错: Access to XMLHttpRequest at ‘http://localhost:8082/doLogin’ from origin ‘http://localhost:8080’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-A
Access to XMLHttpRequest at ‘file:///C:/Users/Lenovo/Desktop/%E4%B8%93%E5%91
qq_45947664的博客
09-13 8757
3、问题解决，编译器直接跳转默认编辑器，打开工作区页面，5500是live server自动分配的端口，如果没有自动跳转，就新建终端，输入“live-server --port=8081”，ps：8080端口可能被占用。1、使用VSCode的话 下载Live Server插件，通过安装这个插件就可以使用http协议打开file本地文件页面。4、点击Fn+F12查看，没有报错信息。5、此方案行不通的话，请移步。2、点击Go Live。
Ajax和XMLHttpRequest
weixin_33709219的博客
09-26 609
Ajax和XMLHttpRequest我们通常将Ajax等同于XMLHttpRequest，但细究起来它们两个是属于不同维度的2个概念。以下是我认为对Ajax较为准确的解释：（摘自what is Ajax）AJAX stands for Asynchronous JavaScript and XML. AJAX is a new technique for creatin...
VUE 出现Access to XMLHttpRequest at 'http://192.168.88.228/login/Login?phone=19939306484&password=111'...
weixin_30480583的博客
04-24 1万+
报错如上图！！！！ 解决办法首先打开 config -> index.js ，粘贴 如下图代码，'https://www.baidu.com'换成要访问的的api域名，注意只要域名就够了，不是整个api地址。代码（效果图）如下 更改完以后，还需要我们把src/mains.js 中的 axios.defaults.baseURL = 'http://www.baidu....
access to xmlhttprequest at_现在最火的圆珠笔组装手工活不收押金,别看不起日赚几十,累积就是财富!--at...
weixin_39860946的博客
11-07 382
现在最火的圆珠笔组装手工活不收押金,别看不起日赚几十,累积就是财富!微信打字赚钱，很多人都会看到广告宣传，这是为什么呢？因为每个咨询这份兼职，想要做这份兼职的人都要帮忙转发宣传，这是门槛任务，所以才会有这么多人看到微信打字赚钱。那么这份兼职工作靠谱吗？事实并不是这么美好。小编推荐正规兼职详情加微信：81153664(手机用户认准第一个加为好友，谨防上当受骗)fuGat-lib网站目录fuGat-...
Access-Control-Allow-Origin跨域问题的终极解决，给自己做备份
10-16
在Web开发中，跨域（Cross-Origin）是一个常见的问题，特别是在使用Ajax进行异步请求时。"Access-Control-Allow-Origin"是HTTP头中的一个关键字段，用于处理浏览器端的同源策略限制，允许来自不同源的资源请求。本文...
allow-cors-access-control插件
02-10
CORS通过设置`Access-Control-Allow-Origin`响应头来解决这个问题。此头字段告诉浏览器，哪些来源的页面被允许访问当前资源。如果服务器在响应中包含这个头，并且值匹配到请求的源，那么浏览器就会允许跨域请求。...
NODE.JS跨域问题的完美解决方案
12-23
2. `Access-Control-Allow-Headers`：指定了浏览器可以发送的自定义请求头，这里设置为`"X-Requested-With"`，这是因为XMLHttpRequest和Fetch API在发送请求时会默认包含这个头，表明请求是由JavaScript发起的。...
send-json:跨域和浏览器发送json
05-09
总的来说，`send-json`库为JavaScript开发者提供了一个便捷的工具，用于跨浏览器地发送JSON数据，解决了跨域问题，使得前端与后端API的交互更加顺畅。其背后的实现可能涉及到XMLHttpRequest或Fetch API，以及CORS...
Nginx解决转发地址时跨域的问题
01-20
一、什么是跨域问题 在一个服务器A里放置了json文件，另一个服务器B想向A发送ajax请求，获取此文件，会发生错误。 Chrome提示： XMLHttpRequest cannot load ******. No 'Access-Control-Allow-Origin' header is ...
解决本地浏览器运行项目时的跨域问题Access to XMLHttpRequest at ‘file:///C:/Users/Len/Desktop/%E5%8F%AF%E4%BF%AE%E6%94%
热门推荐
相濡以沫不如相望于江湖，是望着你不是忘了你。
09-16 12万+
Access to XMLHttpRequest at 'file:///C:/Users/Len/Desktop/%E5%8F%AF%E4%BF%AE%E6%94%B9%E9%85%8D%E7%BD%AE/dist/model/model.gltf.xz' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data,
Vue项目axios调用api出现跨域问题Access to XMLHttpRequest at xxxxxxxxxx
weixin_41201681的博客
09-12 4956
项目场景： Vue开发 问题描述： 提示：Vue项目axios调用api出现跨域问题Access to XMLHttpRequest at xxxxxxxxxx 就是调用api时，api地址前面是本地地址，而不是正确的api地址 下图本人要调用的是 http://api.weatherdt.com/common/?area=xxxxx&type=xxxx&key=xxxxxx 解决方案： 本文写的是前端解决方法！！！ 需要调用api： http://api.weatherdt.com/co
Access to XMLHttpRequest at ‘fileDxxxxx.json‘ from origin ‘null‘ has been blocked by CORS问题解决
begefefsef的博客
08-01 4679
出于安全性考虑，Chrome默认禁止了这种用法，file协议和http/https协议不同，会被Chrome认为是跨域访问，所以会报被CORS(Cross-OriginResourceSharing，跨域资源共享)的安全策略阻止。在该文件源码中，使用了proxy获取数据，数据源使用的是文件名为mydata.json的文件。在浏览器打开本地的html文件，上面proxy中的url获取的就是一个本地文件，协议是file//，如果是在服务器启动的话，则使用的是http或者https协议。...
解决跨域问题：Access to XMLHttpRequest at ‘file:///G:/ZKJW_workspac
WXYcelia的博客
12-08 1545
在浏览器安装位置的Application执行cmd命令：chrome.exe --disable-web-security --user-data-dir=C:\MyChromeUserFata，在打开窗口中访问即可
解决跨域问题：Access to XMLHttpRequest at ‘http://localhost:8080/xxx‘ No ‘Access-Control-Allow-Origin‘ head
一觉睡过头的菜鸡的博客
05-30 7万+
文章目录一、问题二、问题产生的原因三、解决方法1. 问题出现在我们没有带标头，我们就带上标头2. 使用插件扩展 一、问题 当我实现前后端分离的时候，遇到了这个问题： Access to XMLHttpRequest at ‘http://localhost:8080/xxx’ from origin ‘http://localhost:63342’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is pre
【调试错误】Access to XMLHttpRequest at file:E590/ceshi.json from origin null
OrangeChenZ的博客
12-13 6万+
jquery-1.8.0.min.js:2 Access to XMLHttpRequest at ‘file:///%E8%B5%B5%E6%99%A8%E5%AD%90/ceshi.json’ from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supported for prot...
Access to XMLHttpRequest at ‘http:xxx‘ from origin ‘null‘ has been blocked by CORS policy: No ‘Acces
最新发布
Saehun1994的博客
07-02 541
具体来说，错误中提到的“Access to XMLHttpRequest at 'http:xxx' from origin 'null' has been blocked by CORS policy”意味着从“null”这个源（通常是因为你的代码是在本地文件系统中直接打开而不是通过服务器运行的）向“http:xxx”这个地址发送请求时被CORS策略阻止了。头部，你可以将其设置为你的前端服务器的URL（如果你希望只允许来自该URL的请求）或。（允许来自任何源的请求，但出于安全考虑，通常不推荐）。
解决跨域 报错Access to XMLHttpRequest at ‘http://127.0.0.1:3001/user‘ from origin ‘http://127.0.0.1:5501‘
weixin_52954097的博客
09-04 1万+
出现上述情况报错就是因为跨域了。跨域是为了保障安全，浏览器根据同源策略（协议，域名，端口号都要一致）给出的限制。ajax能直接获取同源的数据。不同源的需要解决跨域问题。
Access to XMLHttpRequest at 'file:///D:/vue/vue-first/data.json' from origin 'null' has been blocked by CORS policy
07-28
- *2* [前后端分离跨域问题Access to XMLHttpRequest at ‘http://localhos...has been blocked by CORS policy: ...](https://blog.csdn.net/qq_42416602/article/details/121731774)[target="_blank" data-report-...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值