允许跨域ajax请求中的标头

时间:2016-09-24 13:15:12

标签: ajax apache http cors

第一个Ajax请求收到响应,但不包含第二个包含标头的响应。如何允许标头包含在跨域Ajax请求中。

注意 - 我希望我需要进行服务器端更改,https://stackoverflow.com/a/32140436/1032531也这样说,但是没有说明如何进行这些更改。此外,我不是在寻找仅限jQuery的解决方案。

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Testing</title>  
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js" type="text/javascript"></script>
        <script type="text/javascript"> 
            $(function(){
                $.ajax({
                    type:'POST',
                    url:'http://otherdomain.example.com/ajax.php',
                })
                $.ajax({
                    type:'POST',
                    url:'http://otherdomain.example.com/ajax.php',
                    headers: {"X-Test-Header": "test-value"},
                })
            });
        </script>
    </head>

    <body></body> 
</html> 

对第二个Ajax请求的FF响应:

  

阻止跨源请求:同源策略禁止读取   http://otherdomain.example.com/ajax.php处的远程资源。   (原因:CORS头中缺少令牌'x-test-header'   来自CORS预检频道的“Access-Control-Allow-Headers”。

Chrome将第二个响应为:

  

XMLHttpRequest无法加载http://otherdomain.example.com/ajax.php。   请求标题字段X-Test-Header不被允许   预检响应中的Access-Control-Allow-Headers。 Apache已经建立   如

如下:

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
Header set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept, Authorization, Client-Security-Token, Accept-Encoding"

2 个答案:

答案 0 :(得分:6)

似乎必须明确列出每个标头,然后我将x-test-header添加到Access-Control-Allow-Headers

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
Header set Access-Control-Allow-Headers "x-test-header, Origin, X-Requested-With, Content-Type, Accept"

答案 1 :(得分:0)

您可以使用.htaccess规则消除此错误。只需在主目录中创建一个.htaccess文件(如果已有,则将这些行附加到其中)

Header set Access-Control-Allow-Origin "*"

这将全局允许交叉orgin。如果您只想要一个页面,可以使用

<?php header("Access-Control-Allow-Origin: *"); ?>

位于页面顶部