Ajax请求跨域问题，报错XMLHttpRequest cannot load ''. No 'Access-Control-Allow-Origin' header is present on t

最新推荐文章于 2024-06-10 22:10:52 发布
最新推荐文章于 2024-06-10 22:10:52 发布
阅读量6k 收藏 1
点赞数
CC 4.0 BY-SA版权
分类专栏： 前端 文章标签： Ajax请求跨域问题 报错XMLHttpRequest can
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/chenjiazhu/article/details/52473278
当进行Ajax请求时遇到'No 'Access-Control-Allow-Origin' header'错误，原因是默认不允许跨域。通过设置dataType为'JSONP'，可以规避此限制，实现跨域请求。示例代码中展示了如何在jQuery的ajax调用中添加此配置。

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

报错：XMLHttpRequest cannot load  ''. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' ' is therefore not allowed access. 


原因：ajax默认不支持跨域访问，相应解决这问题很简单，加上dataType: 'JSONP'就可以完美解决


$.ajax({
            type: "GET",
            dataType: 'JSONP',
            url: 'http://'+element.vm.ip+':8034/Monitor/StartMonitorMachine',
             
            data: {
                "configId": stdetailsvm.monitorConfi

最低0.47元/天 解锁文章

200万优质内容无限畅学
处理跨域异常： Access to XMLHttpRequest：No ‘Access-Control-Allow-Origin‘ header is present on the requested
weixin_73060959的博客
08-17 2282
当你遇到这样的错误时，这通常是因为浏览器的同源策略（Same-Origin Policy）阻止了跨源（Cross-Origin）HTTP 请求。
出现Access to XMLHttpRequest atNo AccessControlAllowOrigin header is present on the requeste
weixin_43235147的博客
06-24 3652
这里只讲常用的一种（jsonp只能处理get请求），首先要明白，为什么会发生这个错误，举个例子，在一个项目localhost:8888/a中利用ajax调用了localhost:9999/b中的请求，就发生跨域请求。 1. 如果用了Spring框架的话，那就简单了，因为Spring框架已经给我们封装好了，只需要在被请求的项目Controller中添加标记就可以 //解决ajax跨域问题 //@CrossOrigin(origins = "*",methods = {RequestMethod.GET,Req
XMLHttpRequest cannot load http://localhost:3000/. No 'Access-Control-Allow-Origin' header is presen
ken_ding的博客
12-18 1121
express解决 跨域问题主要在header上下功夫 首先提供一个w3c的header定义 http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html 再提供一个网友提供的header详解 http://kb.cnblogs.com/page/92320/这两个有助于帮助大家理解header的类型和作用， 但是遗憾的是跨域相关的两个head
java、ajax 跨域请求解决方案（'Access-Control-Allow-Origin' header is present on the requested resource. Origin...
weixin_30776863的博客
09-29 1234
1.情景展示 　　ajax调取java服务器请求报错 　　报错信息如下： 　　'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. 　　但是，请求状态却是成功：200，这是...
Webapi 跨域 解决解决错误No 'Access-Control-Allow-Origin' header is present on the requested resource 问题...
dingtuo8679的博客
06-22 1172
首先是web端(http://localhost:53784) 请求 api(http://localhost:81/api/)时出现错误信息: 查看控制台会发现错误：XMLHttpRequest cannot load http://localhost:81/api/. No ‘Access-Control-Allow-Origin‘ header is present on the...
【问题解决】XMLHttpRequest cannot load http://xxx.xxx No 'Access-Control-Allow-Origin'
追寻水中桥
02-26 4万+
问题描述："XMLHttpRequest cannot load http://xxx.xxx. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:8020' is therefore not allowed access."/xxx.html
XMLHttpRequest cannot load ''. No 'Access-Control-Allow-Origin' header is present on the requested ...
weixin_30316097的博客
01-18 281
ajax跨域 禁止访问！利用Access-Control-Allow-Origin响应头解决跨域请求 转载于:https://www.cnblogs.com/xiaoleiel/p/8308608.html
xmlhttprequest cannot load No 'Access-Control-Allow-Origin' AJAX跨域请求解决方法
氵青-风的博客
07-07 3126
今天使用JQ的AJAX请求数据，出现了下面的错误 $(".content").on('click', '.synData', function() { var _this=$(this); var response=_this.prev().val(); var idcard=_this.prev().prev().val();
ajax 设置Access-Control-Allow-Origin实现跨域访问
热门推荐
傲雪星枫
06-06 49万+
ajax跨域访问是一个老问题了，解决方法很多，比较常用的是JSONP方法，JSONP方法是一种非官方方法，而且这种方法只支持GET方式，不如POST方式安全。 即使使用jquery的jsonp方法，type设为POST，也会自动变为GET。如果跨域使用POST方式，可以使用创建一个隐藏的iframe来实现，与ajax上传图片原理一样，但这样会比较麻烦。因此，通过设置Access-Control-Allow-Origin来实现跨域访问比较简单。
Nginx解决转发地址时跨域的问题
01-20
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. 这就是跨域问题。解决方案有不少，比较好的是服务器端配置CORS，但要求服务器端...
PHP Ajax跨域问题解决方案代码实例
01-19
本文通过设置Access-Control-Allow-Origin来实现跨域。 例如：客户端的域名是... No ‘Access-Control-Allow-Origin’ header is present on the requested resource.Origin ‘http://client.runoob.com’ is theref
关于python的bottle框架跨域请求报错问题的处理方法
12-25
在用python的bottle框架开发时，前端使用ajax跨域访问时，js代码老是进入不了success，而是... No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not
猫头虎分享已解决Bug || XMLHttpRequest cannot load [URL]. No ‘Access-Control-Allow-Origin‘ header is present
从前端设计到后端实现，从云技术到人工智能，这里分享最新的技术见解和实践经验。一起学习，一起进步！
06-10 910
大家好，我是猫头虎。。这个问题通常发生在一个域的网页尝试请求另一个域的资源时，而后者没有通过适当的HTTP头部允许该请求。本文将深入探讨这个问题的原因，并提供详细的解决方法和预防措施，希望能帮助到遇到同样问题的朋友们。方法优点缺点服务器端设置CORS头部根本解决问题，符合规范需要服务器端权限使用代理服务器不需修改目标服务器配置，灵活性高增加了额外的服务器配置和维护成本前端设置CORS请求简单快速，适用于开发测试不能解决所有CORS问题通过以上几种方法，我们可以有效解决和避免错误。
XMLHttpRequest cannot load http://XXXx.json. No 'Access-Control-Allow-Origin' header is present on t
Flyer的后花园
06-17 8016
    XMLHttpRequest cannot load http://0.0.0.0:3000/6a5bec410cd2f01435bc.hot-update.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4130...
jquery ajax xmlhttprequest cannot load,XMLHttpRequest cannot load. No 'Access-Control-Allow-Origin' ...
weixin_36410567的博客
08-06 268
This seems to be a pretty common question on here, and I've through a couple dozen threads on the topic. However, none of the responses have worked for me so far. Basically I have a page with a jQuery...
XMLHttpRequest cannot load http://xxx.xxx. No Access-Control-Allow-Origin header is present 报错的解决方法
CoreyJu的博客
10-16 2036
JSONP 利用了js脚本不受同源限制。 前后端规范统一的脚本方法名，来传递数据执行特定的方法。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JSONP-demo</title> </head> &l...
XMLHttpRequest cannot load httplocalhost8090xuexipoccharge. No 'Access-Control-Allow-Origin' header
落地
12-16 4289
XMLHttpRequest cannot load httplocalhost8090xuexipoccharge. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http192.168.1.1418090' is therefore not allowed access
spnavcfg-0.3.1-1.el8.tar.gz
最新发布
08-19
# 适用操作系统：Centos8 #Step1、解压 tar -zxvf xxx.el8.tar.gz #Step2、进入解压后的目录，执行安装 sudo rpm -ivh *.rpm
jq Ajax 发送请求 报错 CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
12-31
您遇到的问题是CORS（跨域资源共享）导致的报错。当您在一个域名下的网页中使用Ajax发送请求到另一个域名下的资源时，浏览器会根据同源策略进行限制，如果服务器没有正确设置CORS响应头，就会出现报错"CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource"。 解决这个问题的方法是在服务器端设置正确的CORS响应头，允许来自其他域名的请求访问资源。具体的设置方法取决于您使用的服务器框架或语言。 以下是一个使用Express框架的Node.js服务器的示例代码，展示如何设置CORS响应头： ```javascript const express = require('express'); const app = express(); // 设置CORS响应头 app.use((req, res, next) => { res.setHeader('Access-Control-Allow-Origin', '*'); res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE'); res.setHeader('Access-Control-Allow-Headers', 'Content-Type'); next(); }); // 处理请求的路由 app.get('/api/data', (req, res) => { // 处理请求并返回数据 res.json({ message: 'Hello, CORS!' }); }); // 启动服务器 app.listen(3000, () => { console.log('Server is running on port 3000'); }); ``` 在上述代码中，通过设置`res.setHeader('Access-Control-Allow-Origin', '*')`，允许来自任何域名的请求访问资源。您可以根据需要修改这个值，例如将`*`替换为特定的域名。 请注意，以上代码只是一个示例，实际的设置方法可能因服务器框架或语言而异。您需要根据您的具体情况进行相应的设置。
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值