AJAX（XMLHttpRequest）进行跨域请求方法详解（三）

最新推荐文章于 2023-06-20 16:29:47 发布
最新推荐文章于 2023-06-20 16:29:47 发布
阅读量2.6w 收藏 36
点赞数
分类专栏： JavaScript 【ASP.NET 4.0】 浏览器兼容性编程 文章标签： xmlhttprequest ajax asp.net 测试 function xhtml
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/net_lover/article/details/5172532
版权

注意：以下代码请在Firefox 3.5、Chrome 3.0、Safari 4之后的版本中进行测试。IE8的实现方法与其他浏览不同。

 

3，带验证信息的请求

 

身份验证是Web开发中经常遇到的问题，在跨域请求中，默认情况下是不发送验证信息的。要想发送验证信息，需要进行withCredentials 属性，下面就是一个简单请求的例子：

点击“开始测试”，我们可以检测到下面的请求执行过程：

从上面的响应中可以看出，Cookie 是会随请求一起发送的。如果我们多次点击测试按钮，则可以看到请求和响应的结果是这样的：

注意 Cookie: ASP.NET_SessionId=fn2zf0zq1cuwgf45fm5fw145; visit=2 这一行，访问计数器已经被一起发送到服务器。

 

4，IE8 中的实现方法

IE8已经开始支持跨域访问资源了，但是，IE8提供的功能还比较简单，可以进行简单的请求，下面是一个使用的例子：

 

另外，IE8的实现方法与其他浏览器不同。更多内容请参考 XDomainRequest 对象，地址是：
http://msdn.microsoft.com/zh-cn/library/cc288060(VS.85).aspx

最后，愿意测试的朋友可以访问这个 http://dotnet.aspx.cc/SimpleCrossSiteRequests.aspx 地址进行“简单请求”的测试，本页面允许任何地址进行跨域访问。（不好意思，个人网站可能被河蟹了）

 

孟子E章
关注
  • 0
    点赞
  • 踩
  • 36
    收藏
    觉得还不错? 一键收藏
  • 8
    评论
专栏目录
AJAX(XMLHttpRequest)进行跨域请求方法详解
02-11
AJAX(XMLHttpRequest)进行跨域请求方法详解
Ajax跨域时出现Access to XMLHttpRequest at *** from origin *** has been been blocked by CORS policy
缚己
01-08 1万+
问题截图 发送 ajax 时出现如下错误： Access to XMLHttpRequest at 'localhost:3000/' from origin 'http://localhost:3000' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, edge, https, chrome-untru
AJAX--XMLHttpRequest & 跨域
郊眠寺
05-18 6883
XMLHttpRequest XMLHttpRequest 是浏览器内置的一个构造函数 作用：基于 new 出来的 XMLHttpRequest 实例对象，可以发起 Ajax 的请求。 axios 中的 axios.get()、axios.post()、axios() 方法，都是基于 XMLHttpRequest（简称：XHR） 封装出来的！ 使用 XMLHttpRequest 发起 GET 请求 主要的 4 个实现步骤： 创建 xhr 对象 调用 xhr.open() 函数 调用 xhr.send() 函
ajax跨域怎么请求数据,AJAX跨域请求数据的四种方法(实例讲解)
weixin_39671467的博客
08-05 433
由于浏览器的同源策略 ajax请求不可以接收到请求响应回来的数据请求数据需要调用浏览器的内置构造函数 XMLHttpRequest() 进行 实例对象var xhr = new XMLHttpRequest();注意点 在IE8之前支持的 ActiveXobject("Microsoft.XMLHTTP"); 记住要进行兼容处理哦 在这里我就不写了通过该对象进行获取获取数据的四种状态 xhr...
AJAX（XMLHttpRequest）进行跨域请求方法详解（一）
【孟子E章】
01-11 13万+
注意：以下代码请在Firefox 3.5、Chrome 3.0、Safari 4之后的版本中进行测试。IE8的实现方法与其他浏览不同。跨域请求，顾名思义，就是一个站点中的资源去访问另外一个不同域名站点上的资源。这种情况很常见，比如说通过 style 标签加载外部样式表文件、通过 img 标签加载外部图片、通过 script 标签加载外部脚本文件、通过 Webfont
利用XMLHttpRequest发起请求解决跨域
qq_37881606的博客
06-20 3075
【代码】利用XMLHttpRequest发起请求解决跨域。
NetworkError: Failed to execute ‘send‘ on ‘XMLHttpRequest‘: Failed to load xxxx错误解决方法
w36680130的博客
11-28 1万+
NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load xxxx错误解决方法
记一次HDFS Web报错Couldn‘t preview the file. NetworkError: Failed to execute ‘send‘ on ‘XMLHttpRequest‘
一花一世界
01-04 1万+
报错内容 Couldn’t preview the file. NetworkError: Failed to execute ‘send’ on ‘XMLHttpRequest’: Failed to load ‘http://slave1:9864/webhdfs/v1/HelloHadoop.txt?op=OPEN&namenoderpcaddress=master:9820&offset=0&_=1609724219001’. Hadoop 集群背景 https://blo
前端跨域及解决方案
weixin_43575775的博客
03-31 730
简单请求、复杂请求、预检请求、为什么会发送两次请求 前端跨域的解决方案。 jsonp的原理 反向代理
js中跨域方法原理详解
12-02
在js中，我们直接用XMLHttpRequest请求不同域上的数据时，是不可以的。但是，在页面上引入不同域上的js脚本文件却是可以的，jsonp正是利用这个特性来实现的。 比如，有个a.html页面，它里面的代码需要利用ajax获取一...
详解AngularJS如何实现跨域请求
11-25
跨域，前端开发中经常遇到的问题，AngularJS实现跨域方式类似于Ajax，使用CORS机制。 下面阐述一下AngularJS中使用$http实现跨域请求数据。 AngularJS XMLHttpRequest：$http用于读取远程服务器的数据 $http.post...
AJAX机制详解以及跨域通信
12-07
1.Ajax 1.1.Ajax简介  Ajax简介这一部分我们主要是谈一下ajax的起源，ajax是什么？因为这些是跟技术无关的。所以，大多细节都是一笔带过。  Ajax的起源？ 　Ajax一词源于2005年 Jesse James Garrett发表的一篇题...
Response.Redirect 打开新窗口的两种方法
热门推荐
【孟子E章】
09-24 15万+
一般情况下，Response.Redirect 方法是在服务器端进行转向，因此，除非使用 Response.Write("window.location=http://dotnet.aspx.cc;") 方法外，是不能在新窗口打开所指定的  URL 地址的。但是，如果仔细分析一下，如果设置 form 元素的 target 属性，还是有办法打开新窗口的。下面就是可以采用的两种方法。方法一：在
AJAX（XMLHttpRequest）进行跨域请求方法详解（二）
【孟子E章】
01-11 6万+
注意：以下代码请在Firefox 3.5、Chrome 3.0、Safari 4之后的版本中进行测试。IE8的实现方法与其他浏览不同。 2，预检请求预检请求首先需要向另外一个域名的资源发送一个 HTTP OPTIONS 请求头，其目的就是为了判断实际发送的请求是否是安全的。下面的2种情况需要进行预检：a，不是上面的简单请求，比如使用Content-Type 为
ASP.NET 2.0中合并 GridView 的表头单元格
【孟子E章】
09-27 3万+
在实际工作中，往往需要合并表格头部的单元格，下面就是一个实现的例子。运行结果如图：C#...@ Page Language="C#" AutoEventWireup="true" %>DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm
ASP.NET 中得到网站绝对路径的几种方法
【孟子E章】
08-18 2万+
ASP.NET 中得到网站绝对路径的几种方法
ASP.NET 2.0中CSS失效的问题总结
【孟子E章】
08-27 1万+
经常有人遇到ASP.NET 2.0（ASP.NET 1.x中可能是有效的）中CSS失效的问题，现将主要原因和解决方法罗列如下：1，CSS文件路径不正确这个问题属于Web开发中的基础问题，一般采用相对路径会出现这样的问题，或者样式文件写在了母版页里面，在内容页与母版页不在同一级目录下时会出现这样的问题。此时你要清楚Web中相对路径的规则，如果你不清楚，可以采用绝对路径的写法试试就知道是不是路径的
xmlhttprequest post跨域请求
最新发布
08-17
XMLHttpRequest（XHR）的POST请求跨域与GET请求跨域的解决方案类似，可以使用CORS（Cross-Origin Resource Sharing）来实现。 在发送POST请求时，需要设置请求头部的Content-Type字段来指定请求的数据类型。常见的Content-Type值有`application/x-www-form-urlencoded`和`application/json`。 以下是使用XHR进行POST跨域请求的一般步骤： 1. 创建一个XMLHttpRequest对象： ```javascript var xhr = new XMLHttpRequest(); ``` 2. 设置请求方法和URL： ```javascript xhr.open('POST', 'http://目标域名/目标路径', true); ``` 3. 设置请求头部： ```javascript xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); ``` 4. 设置响应处理函数： ```javascript xhr.onreadystatechange = function() { if (xhr.readyState === XMLHttpRequest.DONE) { if (xhr.status === 200) { // 处理响应数据 } else { // 处理错误 } } }; ``` 5. 发送请求： ```javascript xhr.send("key1=value1&key2=value2"); // 根据Content-Type决定请求数据的格式 ``` 在服务器端，需要设置响应头部`Access-Control-Allow-Origin`来允许跨域请求，以及根据实际需要设置其他CORS相关的响应头部字段。 需要注意的是，跨域请求是受到浏览器的同源策略限制的，服务器端需要正确配置CORS，且浏览器也需要支持CORS。如果服务器不支持CORS，可以考虑使用代理服务器或其他跨域解决方案来处理跨域请求。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值