js 设置header,实现跨域访问

cocos2d-js跨域访问问题,cocos2d-js请求网络数据 下面是cocos2d-js请求网络数据的代码: var HttpRequest = { /* * 网络请求之GET * url 请求的网络地址 * callback 回调参数 * */ GET:function(url,callback){ var xhr = cc.loader.getXMLHttpRequest(); 阅读详情

受浏览器的同源策略限制,JavaSript只能请求本域内的资源。跨域资源共享(Cross-Origin Resource Sharing, CORS)是为解决Ajax技术难实现跨域问题而提出的一个规范,这个规范试着从根本上解决安全的跨域资源共享问题。在此之前,解决此类问题的途径往往是服务器代理、JSONP等,治标不治本。目前基本所有浏览器都已经支持该规范。

一个域是由schema、host、port三者共同组成,与路径无关。所谓跨域,是指在http://example-foo.com/域上通过XMLHttpRequest对象调用http://example-bar.com/域上的资源。CORS约定服务器端和浏览器在HTTP协议之上,通过一些额外HTTP头部信息,进行跨域资源共享的协商。服务器端和浏览器都必需遵循规范中的要求。

CORS把HTTP请求分成两类,不同类别按不同的策略进行跨域资源共享协商。

1. 简单跨域请求。
当HTTP请求出现以下两种情况时,浏览器认为是简单跨域请求:

1). 请求方法是GET、HEAD或者POST,并且当请求方法是POST时,Content-Type必须是application/x-www-form-urlencoded, multipart/form-data或着text/plain中的一个值。
2). 请求中没有自定义HTTP头部。

对于简单跨域请求,浏览器要做的就是在HTTP请求中添加Origin Header,将JavaScript脚本所在域填充进去,向其他域的服务器请求资源。服务器端收到一个简单跨域请求后,根据资源权限配置,在响应头中添加Access-Control-Allow-Origin Header。浏览器收到响应后,查看Access-Control-Allow-Origin Header,如果当前域已经得到授权,则将结果返回给JavaScript。否则浏览器忽略此次响应。

2. 带预检(Preflighted)的跨域请求。
当HTTP请求出现以下两种情况时,浏览器认为是带预检(Preflighted)的跨域请求:

1). 除GET、HEAD和POST(only with application/x-www-form-urlencoded, multipart/form-data, text/plain Content-Type)以外的其他HTTP方法。
2). 请求中出现自定义HTTP头部。

带预检(Preflighted)的跨域请求需要浏览器在发送真实HTTP请求之前先发送一个OPTIONS的预检请求,检测服务器端是否支持真实请求进行跨域资源访问,真实请求的信息在OPTIONS请求中通过Access-Control-Request-Method Header和Access-Control-Request-Headers Header描述,此外与简单跨域请求一样,浏览器也会添加Origin Header。服务器端接到预检请求后,根据资源权限配置,在响应头中放入Access-Control-Allow-Origin Header、Access-Control-Allow-Methods和Access-Control-Allow-Headers Header,分别表示允许跨域资源请求的域、请求方法和请求头。此外,服务器端还可以加入Access-Control-Max-Age Header,允许浏览器在指定时间内,无需再发送预检请求进行协商,直接用本次协商结果即可。浏览器根据OPTIONS请求返回的结果来决定是否继续发送真实的请求进行跨域资源访问。这个过程对真实请求的调用者来说是透明的。

XMLHttpRequest支持通过withCredentials属性实现在跨域请求携带身份信息(Credential,例如Cookie或者HTTP认证信息)。浏览器将携带Cookie Header的请求发送到服务器端后,如果服务器没有响应Access-Control-Allow-Credentials Header,那么浏览器会忽略掉这次响应。

这里讨论的HTTP请求是指由Ajax XMLHttpRequest对象发起的,所有的CORS HTTP请求头都可由浏览器填充,无需在XMLHttpRequest对象中设置。以下是CORS协议规定的HTTP头,用来进行浏览器发起跨域资源请求时进行协商:
1. Origin。HTTP请求头,任何涉及CORS的请求都必需携带。
2. Access-Control-Request-Method。HTTP请求头,在带预检(Preflighted)的跨域请求中用来表示真实请求的方法。
3. Access-Control-Request-Headers。HTTP请求头,在带预检(Preflighted)的跨域请求中用来表示真实请求的自定义Header列表。
4. Access-Control-Allow-Origin。HTTP响应头,指定服务器端允许进行跨域资源访问的来源域。可以用通配符*表示允许任何域的JavaScript访问资源,但是在响应一个携带身份信息(Credential)的HTTP请求时,Access-Control-Allow-Origin必需指定具体的域,不能用通配符。
5. Access-Control-Allow-Methods。HTTP响应头,指定服务器允许进行跨域资源访问的请求方法列表,一般用在响应预检请求上。
6. Access-Control-Allow-Headers。HTTP响应头,指定服务器允许进行跨域资源访问的请求头列表,一般用在响应预检请求上。
7. Access-Control-Max-Age。HTTP响应头,用在响应预检请求上,表示本次预检响应的有效时间。在此时间内,浏览器都可以根据此次协商结果决定是否有必要直接发送真实请求,而无需再次发送预检请求。

8. Access-Control-Allow-Credentials。HTTP响应头,凡是浏览器请求中携带了身份信息,而响应头中没有返回Access-Control-Allow-Credentials: true的,浏览器都会忽略此次响应。

总结:只要是带自定义header的跨域请求,在发送真实请求前都会先发送OPTIONS请求,浏览器根据OPTIONS请求返回的结果来决定是否继续发送真实的请求进行跨域资源访问。所以复杂请求肯定会两次请求服务端。

js 端的ajax请求:

 $.ajax({
        url: "http://test.com",
        dataType: 'json',
        type: 'GET',
        beforeSend: function (xhr) {
            xhr.setRequestHeader("Test", "testheadervalue");
        },
        async: false,
        cache: false,
        //contentType: 'application/x-www-form-urlencoded',
        success: function (sResponse) {
        }
    });

服务端的action

 //允许跨域访问
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS,DELETE,PUT");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Test");



js 使用ajax设置和获取自定义header信息的方法小结 主要介绍了js 使用ajax设置和获取自定义header信息的方法,结合实例形式总结分析了js 使用ajax自定义设置和获取header响应信息相关操作技巧与使用注意事项,需要的朋友可以参考下 立即下载

相关推荐

Jquery中巧用Ajax的beforeSend方法

jQuery是经常使用的一个开源js框架,其中的$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作。 $.ajax({ beforeSend: function(){ // Handle the beforeSend event }, complete: function(){ // Handle the complete event } // ...... }); 防止重复数据 在实际项目开发中,提交表单时常常由于网络或者其原因,用户点击提交按钮误认为自己没有操作成功,进而会重复提交按钮操作次数,如果页面前端代码没有做

设置header,实现跨域访问

受浏览器的同源策略限制,JavaSript只能请求本域内的资源。跨域资源共享(Cross-Origin Resource Sharing, CORS)是为解决Ajax技术难实现跨域问题而提出的一个规范,这个规范试着从根本上解决安全的跨域资源共享问题。在此之前,解决此类问题的途径往往是服务器代理、JSONP等,治标不治本。目前基本所有浏览器都已经支持该规范。 一个域是由schema、host、...

zyb2010yaonuli的博客 7518

五、2K0300 久久派开发板的GPIO控制与Shell脚本自动化实战

本文详细介绍了基于龙芯2K0300处理器的久久派开发板的GPIO控制方法,通过sysfs文件系统实现LED控制和传感器读取。重点讲解了Shell脚本自动化实战,包括LED闪烁、流水灯效果和传感器数据采集,为物联网项目开发提供完整解决方案。

silver的专栏 687

【JS】获取 Headers 头部信息

获取 Headers 头部信息,以及headers各实例方法的使用。

qq_45677671的博客 1万+

超详细!动态规划详解分析(典型例题分析和对比,附源码)

为啥要使用动态规划?什么时候使用动态规划?以下是我的一些理解和心得,如果你感兴趣,就接着往下看吧。 对您有帮助的话记得给我点个赞哟! 动态规划的基本思想 动态规划(Dynamic Programming,DP)算法通常用于求解某种具有最优性质的问题。在这类问题中,可能会有许多可行解,每一个解都对应一个值,我们希望找到具有最优值的解。 动态规划算法与分治法类似,其基本思想也是将待求解的问题分解成若干个子问题,先求解子问题,然后从这些子问题的解中 得到原有问题的解。与分治法不同的是,动态规划经分解后得到的子问题

qq_44398094的博客 8万+

人工智能训练师技能等级认定四级技能考核试卷-样题1

本文为人工智能训练师四级技能考核试卷,包含六个实操考核项目,总分100分,考试时间150分钟。试卷涵盖数据处理、模型训练准备及系统维护等核心技能:1)垃圾分类数据集规范与处理(30分),要求评估数据格式并编写Python处理代码;2)学生成绩数据集分析(20分),涉及数据预处理、可视化及相关性分析;3)数据标注审核(10分),重点审核标注准确性;4)智能数据服务系统维护与优化(40分),包括安全帽数据集的项目创建、数据处理及平台协作。考核强调Python编程、数据处理平台操作及AI工作流程的实践能力。

weixin_42221934的博客 440

前后端如何解决跨域问题

解决跨域问题什么情况下会跨域前端解决跨域后端解决跨域 什么情况下会跨域 同源策略 同源策略是浏览器的行为,是为了保护本地数据不被JavaScript代码获取回来的数据污染,因此拦截的是客户端发出的请求回来的数据接收,即请求发送了,服务器响应了,但是无法被浏览器接收。 参数原因: 由 Netscape 公司 1995 年引入浏览器,它是浏览器最核心也最基本的安全功能,现在所有支持 JavaScript 的浏览器都会使用这个策略。如果缺少了同源策略,浏览器很容易受到 XSS、 CSFR 等攻击。 跨域 跨域就是

卡洛背心的博客 1749

Windows 10/11 注册表 ProfileImagePath 误改修复:3步恢复用户登录与数据安全

本文详细介绍了Windows 10/11系统中因误改注册表ProfileImagePath键值导致用户无法登录的修复方法。通过3个关键步骤,包括定位SID、安全修复注册表项及验证处理,帮助用户恢复登录并保障数据安全。特别强调了操作顺序的重要性以避免数据丢失,适用于各类Windows用户账户登录错误的紧急处理。

chuoshao2508的博客 403

JS 设置header,实现跨域访问

直接讲跨域处理: CORS把HTTP请求分成两类,不同类别按不同的策略进行跨域资源共享协商。 1. 简单跨域请求。 当HTTP请求出现以下两种情况时,浏览器认为是简单跨域请求: 1). 请求方法是GET、HEAD或者POST,并且当请求方法是POST时,Content-Type必须是application/x-www-form-urlencoded, multipart/form-data或着text/plain中的一个值。 2). 请求中没有自定义HTTP头部。 对于简单跨域请求,浏览器要做的就是

b0303的博客 4100

正点原子stm32f103RChal库制作数字秒表:如用keil5和正点原子STM32F1开发板实现?

🏆本文收录于 《全栈Bug调优(实战版)》 专栏,该专栏专注于分享我在真实项目开发中遇到的各类疑难Bug及其深层成因,并系统提供高效、可复现的解决思路和实操方案。无论你是刚入行的新手开发者,还是拥有多年项目经验的资深工程师,本专栏都将为你提供一条系统化、高质量的问题排查与优化路径,助力你加速成长,攻克技术壁垒,迈向技术价值最大化与职业发展的更高峰🚀!    📌 特别说明: 文中部分技术问题来源于真实生产环境及网络公开案例,均经过精挑细选与系统化整理,并结合多位一线资深架构师和工程师多年实战经验沉淀,提

**My Coding Family** 1264

音视频OSD——使用freetype将矢量字库的信息叠加至YUV

目录freetypes使用步骤1)包含头文件:2) 初始化库:3)加载face对象:4)设置字体大小5)设置字体位置,以及旋转度数:6)加载字形图像准备矢量字库代码.c.h效果叠加至YUV freetypes FreeType是一个完全开源的、可扩展、可定制且可移植的字体引擎,它提供TrueType字体驱动的实现统一的接口来访问多种字体格式文件 下载freetypes tar -xjf freetype-2.4.10.tar.bz2 cd freetype-2.4.10/ ./configure

路人coder 2364

jquery + node 通过 CORS 实现跨域访问,支持cookie和自定义header

  跨域有多种方式,现在的情况看来还是CORS更适合一些,有很多优点,比如浏览器正式支持、支持post、可以控制跨域访问的网站等。   我们来看看node如何实现cors方式的跨域。在网上找到了一些代码,考过来之后运行报错,可能这个是在express里面的写法吧,那么原生的写法是什么样子的呢?又找了半天,并且经过测试得到了原生的写法: express的写法: ---app.js...

jyk 金色海洋工作室 ASP.NET经验总结 1964

[解决] PDF转图片,中文乱码或显示方框的解决方案

在Java开发中,将PDF文件转换为图片是一项常见的需求,但过程中可能会遇到中文乱码或显示方框的问题。本文将深入探讨这一问题,并提供详细的解决方案,帮助开发者顺利地完成PDF到图片的转换。

DazedMen的博客 1924

Ajax实现跨域访问的两种方法

调程序时遇到“已拦截跨源请求:同源策略禁止读取位于……的远程资源”,这是因为通过ajax调用其他域的接口会有跨域问题。 解决方法如下: 方法一:服务器端(PHP)设置header头,实现跨域访问 示例: // PHP <?php header('Access-Control-Allow-Origin:*'); $name = $_POST['username'...

weixin_30470643的博客 203

B站自动答题协议分析

使用Python写了一个自动答题机器人!基于接口协议实现且包含点选验证码识别

吴秋霖的博客 2652

efm32 入门.pdf

本PDF共计22页,介绍的是操作驱动API,下载与否自己斟酌。

通过CORS配置实现JS跨域访问

两个方法 一、配置Filter,每个请求都拦截,设置Http Header Web.xml添加: &lt;filter&gt; &lt;filter-name&gt;cros&lt;/filter-name&gt; &lt;filter-class&gt;cn.ifengkou.test.filter.CORSFilter&lt;/filter-class&gt; ...

北极悠蓝的技术博客 457

廖雪峰Python教程[完整版]

廖雪峰的python教程整理的,已经排好版了,而且还是完整的,适合小白

通过设置P3P头来实现跨域访问COOKIE

实际工作中,类似这样的要求很多,比如说,我们有两个域名,我们想实现在一个域名登录后,能自动完成另一个域名的登录,也就是PASSPORT的功能。我只写一个大概,为了测试的方便,先编辑hosts文件,加入测试域名(C:\WINDOWS\system32\drivers\etc\hosts)127.0.0.1www.a.com127.0.0.1www.b.com首先:创建...

weixin_30325793的博客 92

RU DOS版、EFI版32bit/64bit BIOS常用工具

DOS版、EFI版的RU工具,可用来查看IO、MEM、PCI、SMBIOS等资源。亲测在EFI SHELL下可用。

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

使用内网穿透单条通道成功实现网页前后端的访问

利用内网穿透的免费隧道,实现公网访问自己网站的前后端。

Damaomihenwuqing的博客 720

VUE单点登陆传cookie

Cookie跨域单点登录 为了快速、简单的实现这一功能,首先想到就是通过JS操作Cookie并让两个不同域的cookie能够相互访问,这样就可达到了上述的效果,具体实现过程大致可分以下两个步骤: 1、在A系统下成功登录后,利用JS动态创建一个隐藏的iframe,通过iframe的src属性将A域下的cookie值作为 get参数重定向到B系统下b.aspx页面上;...

weixin_33854644的博客 560

JS中的跨域问题

原文链接:https://www.cnblogs.com/yongshaoye/p/7423881.html 一、什么是跨域? 1.定义:跨域是指从一个域名的网页去请求另一个域名的资源。比如从www.baidu.com 页面去请求 www.google.com 的资源。但是一般情况下不能这么做,它是由浏览器的同源策略造成的,是浏览器对JavaScript施加的安全限制。跨域的严格一点的定义是:...

Mr.小强的博客 316

vue使用axios拦截器在header里添加token+设置跨域访问

在vue cli4种使用axios拦截器在header里添加token+设置跨域访问 没啥好说的,先安装 首先安装axios cnpm install --save axios 引入axios import axios from 'axios' Vue.prototype.$http = axios; 到此axios就在项目中安装完成了 请求方法: post方法: this.$http.post('/Api/test', { phone:this.use

weixin_44463070的博客 8229

2.1.5Nginx跨域访问:add_header

文章目录Nginx跨域访问跨域访问Nginx跨域操作:添加头:add_header测试准备开始测试 Nginx跨域访问 跨域访问 浏览器同时访问www.a.com和www.b.com,从安全角度讲是禁止这样的。 为什么浏览器禁止跨域访问 不安全,容易出现CSRF攻击! CSRF攻击就是跨站是攻击。 当客户访问网站A的时候,网站A返回给客户cookie,token等信息;当客户访问黑客控制的网站B的时候,网站B返回的不安全信息,会控制客户的浏览器访问网站A,并发送恶意请求,就形成跨站访问。 所以,一般

紫月7575的博客 2225

js跨域访问,No ‘Access-Control-Allow-Origin‘ header is present on

js跨域访问,No ‘Access-Control-Allow-Origin‘ header is present on 在本地用ajax跨域访问请求时报错: XMLHttpRequest cannot loadhttp://www.zjblogs.com/. No 'Access-Control-Allow-Origin' header is present on

qilaizeng的博客 1万+
上一篇: Previous operation has not finished; run 'cleanup' if it was interrupted
下一篇: ASP.NET MVC模板
Waldenz
博客等级 码龄17年 219粉丝 229原创
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值