jquery跨域报错：Origin null is not allowed by Access Control Allow Origin

最新推荐文章于 2025-06-12 21:10:11 发布
最新推荐文章于 2025-06-12 21:10:11 发布
阅读量2.8k 收藏
点赞数 1
分类专栏： 前端 文章标签： 跨域报错 access-control-allow jquery
本文探讨了在Chrome等浏览器中遇到的跨域加载问题，解释了不同浏览器处理跨域请求的方式及其原因，并提供了解决方案。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

本文转自：http://zhidao.baidu.com/link?url=SY552AMCoGVn1P6Y4xAA5jpcY7HhCbtF42ZX0EE2eRpfqumwMTnA2T4Rp2Cd7dh7jAyGZn_giR8w3sTxMeTKwK


本地a.html中jquery load("b.html")，chrome浏览器报跨域错误Origin null is not allowed by Access-Control-Allow-Origin.要如何解决呢？

报错部分的英文的大概意思就是不允许跨域，至于什么叫做不允许跨域呢？
我尝试了chrome、firfox、opera都出现了这种情况，但是使用IE8就不会出现这种错误，很多人不是很理解。
这里Windows help and support 做出了解释  IE本身也并不是允许跨域的因为这样很不安全，但是如果不跨域的话又带来很多不便，所以会让你手动的选择一下是否允许跨域。而chrome、firfox、opera则默认就是不允许。

ie8中跨域调用可参考网页：http://technet.microsoft.com/zh-cn/scriptcenter/dd573303(v=vs.95).aspx

注：chrome里在file:///C:/Users/zhanglei/Desktop/1.html中访问同位置的2.html是不可以的，但是在一个发布起来的web应用（j2ee等）中是可以的。

宝塔部署项目遇到“Access-Control-Allow-Origin”跨域问题，通过调整nginx的时候需要注意，不是在nginx配置文件，是在网站管理里面进行配置
feixuewisdomlee的博客
05-05 2052
uniapp项目遇到跨域问题的解决方法
XmlHttpRequest错误：Access-Control-Allow-Origin不允许使用原点null
p15097962069的博客
01-12 4495
我正在开发一个页面，该页面通过jQuery的AJAX支持从Flickr和Panoramio中提取图像。 Flickr方面运行良好，但是当我尝试从Panoramio进行$.get(url, c
js bug: Origin 'null' is therefore not allowed access.
Edaire的专栏
11-12 1万+
先说一下问题的由来，在本地html页面ajax请求本地或者局域网server的资源时遇到的bug，先来段出问题的代码：<script type="text/javascript"> $.ajax({ type:"get", url:"http://192.168.199.59:9000/api/v1/questions/5825acefffa2f815acdb
CSRF6 Origin为null的跨域资源请求
最新发布
2401_89464052的博客
06-12 1100
本文介绍了利用CORS漏洞获取API key的实战案例。靶场允许Origin为null的跨域请求，通过构造特殊iframe标签（设置sandbox属性允许脚本执行）发起null origin请求。关键代码使用XMLHttpRequest获取账户信息，并将数据外传到攻击者服务器。实验成功获取到包含apikey的JSON响应："w7l3BOb0zS6dW14fZZgSjwmW5OqS01kv&quot。相比完全开放的CORS配置，仅限制null origin仍存在安全风险。
chrome发起跨域ajax请求遇到 Origin null is not allowed by Access-Control-Allow-Origin 一解
superhoy的专栏
09-05 3万+
在Chrome浏览器中，如果想通过AJAX请求不同域中的资源，很可能就会遇到 “Origin null is not allowed by Access-Control-Allow-Origin” 的错误。 这是因为在新版本浏览器中安全策略引起。简单的说，如果XMLHttpRequest 请求的URL和当前页面不同一个域中时，浏览器会检测响应http header中有没有 Access-Co
ajax跨域访问请求头origin 为null,【跨域】SpringBoot跨域，拦截器中，第一次获取的请求头为NULL，发送两次请求的处理方式...
weixin_27268733的博客
08-06 4296
背景：在做前后端分离时，牵扯到跨域，但是已经设置了跨域前端设置了允许携带Cookieaxios.defaults.withCredentials = true;后端也配置了跨域浏览器端查看发送的请求，请求头中包含Authorization原因：实际上发送了两次请求，第一次为OPTIONS请求，第二次才GET/POST...请求在OPTIONS请求中，不会携带请求头的参数，所以在拦截器上获取请求头为...
静态文件访问不到报No Access-Control-Allow-Origin处理办法
06-11
`add_header`指令则会在响应头中添加`Access-Control-Allow-Origin: *`，允许任何来源的请求。`expires max`用来设置长期缓存，减少客户端对这些文件的重复请求，提高页面加载速度。`access_log off`关闭了针对这个...
vue axios跨域访问相关问题 | axios默认发送‘application/x-www-form-urlencoded‘格式数据 | Content-Type is not allowed b
♡ 脚下的每一步都叫远方 ♡
07-02 1416
文章目录概述报错1 Content-Type is not allowed by Access-Control-Allow-Headers in preflight respon报错2 返回状态码500 好久没更博客了, 最近一直搞框架搞项目, 好多问题也都没有记录下来… 好吧, 那从今天起来, 继续开始保持记录的好习惯, 先写一下在 axios 上踩下了这么多坑. 概述 通过以下两个报错, 来介绍解决使用 axios 来进行网络请求中的遇到的跨域问题 报错一 对应 服务器端需要的处理方式 报错二 对应
深入浅出FE（三）跨域Cross-Origin
前端产品工程师
02-17 895
目录 1. 跨域是什么 2. 为什么有跨域 2.1 防止csrf攻击 2.2 防止xss攻击 3. 跨域解决方案？ 3.1jsonp 3.2 "跨域资源共享"（Cross-origin resource sharing）CROS 3.3 document.domain + iframe跨域 3.4window.name + iframe 3.5 location.ha...
JQuery知识点
胖大xian
01-14 338
JQuery一、jquery介绍二、jquery加载三、jquery选择器四、jquery样式操作五、绑定click事件六、jquery特殊效果七、jquery链式调用八、jquery动画九、尺寸相关、滚动事件十、jquery属性操作十一、jquery循环十二、jquery事件十三、事件冒泡十四、事件委托十五、jquery元素节点操作十六、滚轮事件与函数节流十七、json十八、ajax与jsonp十九、本地存储二十、jqueryUI 一、jquery介绍 jQuery是目前使用最广泛的javascript函
分布式Session一致性问题 跨域问题
dllping的博客
11-29 212
分布式Session一致性问题 什么是Session Session 是客户端与服务器通讯会话技术， 比如浏览器登陆、记录整个浏览会话信息 Session实现原理 客户对向服务器端发送请求后，Session 创建在服务器端，返回Sessionid给客户端浏览器保存在本地，当下次发送请求的时候，在请求头中传递sessionId获取对应的从服务器上获取对应的Sesison ...
Chrome浏览器访问任何服务器资源，解决Origin 'null' is therefore not allowed access.错误
石头也有呆毛~~
04-18 1万+
可以尝试加入新的插件： https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi/related
safari浏览器调用nodejs接口，报Access-Control-Allow-Origin问题
weixin_33971130的博客
06-16 556
nodejs服务器接口已开启允许跨域访问权限 javascriptres.setHeader("Access-Control-Allow-Origin","*"); res.setHeader("Access-Control-Allow-Headers","Content-Type,Accept,Authorization"); res...
解决跨域问题（从浏览器读取本地文件）from origin ‘null‘ has been blocked by CORS policy
m0_62172798的博客
04-26 8755
在学习d3.js的过程中，通过d3.csv()读取本地csv文件的过程中出现了跨域错误，错误如下：Access to fetch at 'file:///D:/%E5%AD%A6%E4%B9%A0%E8%B5%84%E6%96%99%EF%BC%88%E7%A1%95%EF%BC%89/htmlcssjsvue/code/d3.js/data222.csv' from origin 'null' has been blocked by CORS policy: Cross origin requests a
origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present
热门推荐
mcfeng blog
09-16 6万+
aa
Chrome报错：Origin null is not allowed by Access-Cont
chuyingpiao0327的博客
10-22 664
1.问题场景 js中采用jQuery的$.getJSON或$.ajax等获取本地文件时，出现错误： 2.问题原因 Origin null is not allowed by Access-Control-Allow-Origin的意思是由于安全原因浏...
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is there
li416338592的博客
04-01 338
今天在跨域使用ajax的时候浏览器报了这个异常 No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not allowed access. 具体意思呢就是 在请求的资源上不存在’Access-Control-Allow-Origin’标头。因...
Chrome本地跨域 origin-null-is-not-allowed或者Blocked a frame with origin “null“ from accessing 解决方案（适用于前端）
The road to success is lonely
07-13 9073
本地直接打开项目地址报错，地址栏里的地址：file:///C:/Users/Administrator/Desktop/HZ/register.html 谷歌不允许这样打开项目，所以产生了跨域问题。 解决办法：本地要起一个类似客户端运行的环境，我用的是vscode中的Live Server 然后打开需要运行的html页面，点击如图所示的位置即可运行起来 在浏览器打开的地址一般是：http:/...
php origin null,Origin null is not allowed by Access-Control-Allow-Origin 解决方法
weixin_34539480的博客
04-01 503
使用xmlhttprequest获取服务数据时，在IE下能通过而在 chrome不能通过的问题，这就是所谓的跨域问题，什么是跨域呢？比较不规范但是通俗的说说法吧，比如你使 用chrome打开一个本地的html页面，那么我认为现在你的机器就是一个站点，这个html就是运行在这个站点上，如果你要在这个html页面中通过 xmlhttprequest获取百度的页面源码信息，就有点跨域的意思，这和你直接在...
vite Failed to load resource: Origin null is not allowed by Access-Control-Allow-Origin. Status code: 0
12-28
### Vite 项目中跨域请求失败的解决方案 在开发环境中遇到 `origin null` 和 `access-control-allow-origin` 错误通常是因为浏览器阻止了来自不同源的请求。对于 Vite 项目，可以通过配置代理来解决这个问题。 #### 配置 Vite 开发服务器代理 Vite 提供了一个内置的开发服务器，支持通过其配置文件设置 HTTP 代理。这可以有效地绕过 CORS 限制，在开发过程中非常有用。 编辑 `vite.config.ts` 或者 `vite.config.js` 文件，添加如下所示的代理配置： ```javascript import { defineConfig } from 'vite'; export default defineConfig({ server: { proxy: { '/api': { target: 'http://localhost:8081', changeOrigin: true, rewrite: (path) => path.replace(/^\/api/, ''), }, }, }, }); ``` 上述代码片段定义了一个 `/api` 前缀的代理规则，任何匹配此模式的请求都将被转发到目标地址 `http://localhost:8081`[^2]。 #### 修改前端 AJAX 请求 URL 为了使代理生效，需要调整前端发送请求时使用的URL，确保它们以 `/api` 开始。例如，如果之前直接访问的是 `http://api.example.com/data` ，现在应该改为调用相对路径 `/api/data` 。这样做的好处是可以让所有的 API 请求都经过本地运行的服务端口处理，从而避免跨域问题的发生。 #### 后端服务配置 CORS 头部信息 除了前端配置外，还需要确认后端已经正确设置了响应头部中的 `Access-Control-Allow-Origin` 字段。如果是基于 Node.js 的应用，则可以在 Koa 中加入中间件实现这一点: ```javascript const cors = require('@koa/cors'); app.use(cors()); // 或者更具体的控制方式 app.use(cors({ origin: function(ctx){ return '*'; // 可根据实际情况返回特定域名 } })); ``` 这段代码会告诉浏览器允许哪些来源的页面加载资源，当设置为通配符 `*` 表示接受所有来源的请求[^3]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值