发布网友 发布时间:2022-04-20 07:50
共7个回答
懂视网 时间:2022-05-01 04:25
跨域在开发中一些是一个比较常见的问题虽然有json或者xml来解决,现在html5开始流行了,我们可以通过Access-Control-Allow-Origin解决跨域问题,下面一起来看看。
A.abc.com 发起一个到 abc.com/B 的ajax请求,也会有跨域的问题。之所以会有跨域问题,实则是因为www.abc.com其实同A.abc.com一样,也是一个二级域名,而非一级域名(一级域名是http://abc.com)
对于是否允许跨域,更详细的说明可以看下表:
URL | 说明 | 是否允许通信 |
http://www.a.com/a.js http://www.a.com/b.js |
同一域名下 | 允许 |
http://www.a.com/lab/a.js http://www.a.com/script/b.js |
同一域名下不同文件夹 | 允许 |
http://www.a.com:8000/a.js http://www.a.com/b.js |
同一域名,不同端口 | 不允许 |
http://www.a.com/a.js https://www.a.com/b.js |
同一域名,不同协议 | 不允许 |
http://www.a.com/a.js http://170.32.82.74/b.js |
域名和域名对应ip | 不允许 |
http://www.a.com/a.js http://script.a.com/b.js |
同一域名,不同二级域名 | 不允许 |
http://www.a.com/a.js http://a.com/b.js |
二级域名和一级域名 | 不允许(cookie这种情况下也不允许访问) |
http://www.b.com/a.js http://www.a.com/b.js |
不同域名 |
有了对跨域的基本概念了解后,就可直接进入这篇文章的主题了。
赞助商链接
解决方法:
若在接收请求的服务端abc.com/B页面用的是php语言,则在页面中加入:
// 指定可信任的域名来接收响应信息,推荐
<?php header(‘Access-Control-Allow-Origin:http://A.abc.com‘); ?>
或加入
// 使用通配符 * ,表示当前服务端通话任何域名发起请求,不推荐
<?php header(‘Access-Control-Allow-Origin:*‘); ?>
就这样在服务端简单加一句响应头responese headers声明,一个跨域请求就不会被浏览器的同源安全策略所阻止了!
用chrome调试工具Network ajax请求查看面板中可以看到,类似如下截图:cors
需要注意的是:
添加响应头responese headers时,允许跨域请求的域名带不带斜杠/还是有区别的,带斜杠/会报错:
XMLHttpRequest cannot load abc.com/B. The ‘Access-Control-Allow-Origin‘ header has a value ‘http://A.abc.org/‘ that is not equal to the supplied origin. Origin ‘http://A.abc.org‘ is therefore not allowed access.
header(‘Access-Control-Allow-Origin:*‘);是html5新增的一项标准功能,因此 IE10以下 版本的浏览器是不支持 的,因此,如果要求兼容IE9或更低版本的ie浏览器,会导致使用此种方式的跨域请求以及传递Cookie的计划夭折,最终还得回归JSONP(目前主流的处理方式是使用JSONP,易于实现,兼容性好,可查的资料也很多。)
跨域解决后,如果还要操作Cookie,还得继续补增响应头:
<?php header(‘Access-Control-Allow-Credentials:true‘); ?>
需要将 XMLHttpRequest 对象的 withCredentials 属性设置为 true,JQuery1.5.1+ 就开始提供了相应的字段,使用方式如下:
$.ajax({
url:"B.abc.com",
xhrFields:{
withCredentials:true
},
crossDomain:true
});
哦也~ 收到 Cookie 了。
设置 withCredentials 为 true 的请求中会包含 A.abc.com端的所有Cookie,这些Cookie仍然遵循同源策略,所以,你只能访问其中和 abc.com/B同根域的Cookie,而无法访问其他域的Cookie。
Access-Control-Allow-Origin实则是html5 Cross-Origin Resource Sharing实现的最重要的一点参数配置。
Cross-Origin Resource Sharing,跨域资源共享,简称 CORS,可以作为一种跨域请求以及响应的解决方案。
附:
禁用chrome本地安全策略,不用配服务器环境也能发起ajax请求:
chrome 桌面快捷键 右键属性 在快捷方式标签下的“目标”框中加入 --disable-web-security,重启浏览器即可
HTML5中Access-Control-Allow-Origin解决跨域问题
标签:
热心网友 时间:2022-05-01 01:33
TML5是什么?
HTML5是指第5代HTML(超文本标记语言),也指用HTML5语言制作的一切数字产品。
网上的网页,多数都是由HTML写成的。
“超文本”是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。
而“标记”指的是这些超文本必须由包含属性的开头与结尾标志来标记。
浏览器通过解码HTML,就可以把网页内容显示出来。
下图中就很清晰的指出了H5的涵盖范围:
HTML5之所以能引发如此广泛的效应,根本在于它不再只是一种标记语言,它为下一代互联网提供了全新的框架和平台,包括提供免插件的音视频、图像动画、本体存储以及更多酷炫而且重要的功能,并使这些应用标准化和开放化,从而使互联网也能够轻松实现类似桌面的应用体验。
热心网友 时间:2022-05-01 02:51
HTML5(WEB前端)技术由HTML(结构)、CSS(样式)、JavaScript(行为)组成。HTML5是WEB的未来,HTML5不仅在PC端,更是在移动端上也有广泛的应用。据统计2013年全球有10亿手机浏览器支持HTML5,同时HTMLWeb开发者数量将达到200万。HTML5技术日趋成熟,越来越多的行业巨头正不断向HTML5示好。总的来说HTML5技术的优势也是有的,其中HTML5中最酷的特性就是本地存储,有一点像比较老的技术cookie和客户端数据库的融合。它比cooke更好用因为支持多个windows存储,它拥有更好的安全和性能,即使浏览器关闭后也可以保存。因为它是个客户端的数据库,你不用担心用户删除任何cookie,并且所有主流浏览器都支持。HTML5注释:HTML5是万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改。2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成。标准通用标记语言下的一个应用HTML标准自1999年12月发布的HTML4.01后,后继的HTML5和其它标准被束之高阁,为了推动Web标准化运动的发展,一些公司联合起来,成立了一个叫做WebHypertextApplicationTechnologyWorkingGroup(Web超文本应用技术工作组-WHATWG)的组织。WHATWG致力于Web表单和应用程序,而W3C(WorldWideWebConsortium,万维网联盟)专注于XHTML2.0。在2006年,双方决定进行合作,来创建一个新版本的HTML。热心网友 时间:2022-05-01 04:26
HTML5简单来说就是一个编程语言。Html5广义上来说包含了html5、css和zJavaScript三个部分,不仅仅是根据第一印象的html5,html5让网页制作从shu布局到细节处理都更加的灵活,可以创建更好的网 页结构,拥有更加丰富的标签,对媒体播放、编辑、存储等有更好的支持方式,兼容性更强。热心网友 时间:2022-05-01 06:17
是超文本标记语言,标记准通用标记语言下的一个应用。HTML 不是一种编程语言,而是一种标记语言 ,是网页制作所必备的。超文本就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。超文本标记语言的结构包括头部分、和主体部分,其中头部提供关于网页的信息,主体部分提供网页的具体内容。热心网友 时间:2022-05-01 08:25
HTML5是HTML(超文本标记语言)的最新版本。热心网友 时间:2022-05-01 10:50
太专业的很多词会说的很模糊,,所以通俗点讲.比如你用笔记本以前是B5大小的,那个可以叫H4,而现在说B5大小太小了,大家都用A4大小的笔记本.这个就是H5了.