了解CORS上的XMLHttpRequest(responseText) [英] Understanding XMLHttpRequest over CORS (responseText)

查看:138
本文介绍了了解CORS上的XMLHttpRequest(responseText)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

对于一个项目,我正在查看各种HTML5和Javascript元素和他们周围的安全,我想尝试让我的头靠近CORS。



如果我删除..

 <?php 
头(访问控制 - 原产地:*);
header('Access-Control-Allow-Methods:GET,POST,OPTIONS');
?>

..从尝试访问的页面我看到在控制台日志中的以下内容Chrome :

  XMLHttpRequest无法加载http://www.bla.com/index.php。原因http://bla2.com不允许Access-Control-Allow-Origin。 



我理解这是正确的,但Wireshark显示HTTP / 1.1 200 OK在返回和数据显示正在请求的页面的源。因此,只是浏览器和JavaScript阻止responseText被以任何实质的方式使用,即使它被实际传输吗?



代码如下:

  function makeXMLRequest(){
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4){
alert(xmlhttp.responseText);
}
}
xmlhttp.open(GET,http://www.bla.com/index.php,true);
xmlhttp.send();
}

提前感谢。

解决方案

对于一个简单的HTTP动词,如GET或POST,是的,整个页面被抓取,然后浏览器决定JavaScript是否使用内容。服务器不需要知道请求来自哪里;



对于非浏览器,浏览器的作业检查来自服务器的回复并确定是否允许JS查看内容。简单HTTP动词,如PUT或DELETE,则浏览器使用OPTIONS请求发出预检请求。在这种情况下,浏览器首先通过检查 Access-Control-Allow-Origin 来检查域 Access-Control-Allow-Methods 。 (请参阅 CORS页面处理不那么简单的请求 > of the HTML5 Rocks更多信息。)预检回应还列出了 Access-Control-Allow-Headers 中包含的允许的非简单标题。



这是因为允许客户端向服务器发送DELETE请求可能非常糟糕,即使JavaScript从来没有看到跨域结果 - 再次记住,服务器通常不是(尽管它可以使用请求中的 Origin 头来这样做)来验证请求是否来自合法域。 / p>

For a project I'm looking at various HTML5 and Javascript elements and security around them and I'm trying to get my head around CORS just now.

Based on my testing, if I remove..

<?php
 header("Access-Control-Allow-Origin: *"); 
 header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
 ?>

..from the page that is trying to be accessed I see the following in the console log on Chrome:

XMLHttpRequest cannot load http://www.bla.com/index.php. Origin http://bla2.com is not allowed by Access-Control-Allow-Origin.

I understand this to be correct, however Wireshark shows HTTP/1.1 200 OK in the return and in the data shows the source of the page being requested. So is it just the browser and Javascript that is blocking responseText from being used in any substantial way even though it's actually transferred?

The code is just as below:

  function makeXMLRequest() {
  xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState==4) {
        alert(xmlhttp.responseText);
    }
}
xmlhttp.open("GET","http://www.bla.com/index.php",true);
xmlhttp.send();
}

Thanks in advance.

解决方案

For a "simple" HTTP verb like GET or POST, yes, the entire page is fetched, and then the browser decides whether JavaScript gets to use the contents or not. The server doesn't need to know where the requests comes from; it is the browser's job to inspect the reply from the server and determine if JS is permitted to see the contents.

For a "non-simple" HTTP verb like PUT or DELETE, the browser issues a "preflight request" using an OPTIONS request. In that case, the browser first checks to see if the domain and the verb are supported, by checking for Access-Control-Allow-Origin and Access-Control-Allow-Methods, respectively. (See the "Handling a Not-So-Simple Request" on the CORS page of HTML5 Rocks for more information.) The preflight response also lists permissible non-simple headers, included in Access-Control-Allow-Headers.

This is because allowing a client to send a DELETE request to the server could be very bad, even if JavaScript never gets to see the cross-domain result -- again, remember that the server is generally not under any obligation to verify that the request is coming from a legitimate domain (although it may do so using the Origin header from the request).

这篇关于了解CORS上的XMLHttpRequest(responseText)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆