由于CORS,Azure网站上的HTTP OPTIONS请求失败

时间:2013-09-24 12:14:18

标签: php jquery azure cors azure-web-sites

我最近将我们的服务器从Rackspace CloudSites(在Apache / Linux上运行)转移到了Windows Azure网站。自迁移以来,我们的REST API上的所有jQuery AJAX请求都因CORS而开始失败。

我们使用自定义标头,因此jQuery在运行实际的API调用之前会发出Pre-flight HTTP OPTIONS请求。问题是OPTIONS请求似乎没有到达我的PHP代码,而是由其他一些我似乎无法控制的实体(显然是Web服务器)返回。

我已经使用以下标题几年了所以我很确定问题不在PHP代码中:

<?php
    $this->output->set_header("Access-Control-Allow-Origin: *");
    $this->output->set_header("Access-Control-Allow-Methods: GET,POST,DELETE,HEAD,PUT,OPTIONS");
    $this->output->set_header("Access-Control-Allow-Headers: X-Olaround-Debug-Mode, Authorization, Accept");
    $this->output->set_header("Access-Control-Expose-Headers: X-Olaround-Debug-Mode, X-Olaround-Request-Start-Timestamp, X-Olaround-Request-End-Timestamp, X-Olaround-Request-Time, X-Olaround-Request-Method, X-Olaround-Request-Result, X-Olaround-Request-Endpoint" );
?>

我猜这个问题是特定于Azure网站的,因为代码似乎在我的开发机器(Windows 8 / IIS 8.0)上运行良好。我是Azure的新手(以及一般的基于Windows的托管),所以我几乎不知道如何处理和调试此问题,因为Azure网站允许非常小的控制。

3 个答案:

答案 0 :(得分:15)

我决定发布一个完整的解决方案来解决这个问题,因为已经提供的答案(虽然在技术上是正确的)在我这个特殊情况下不起作用。诀窍是做以下事情:

1。在web.config

中的<customHeaders>中添加<httpProtocol>

就像上面提到的@hcoat一样,添加system.webServer.httpProtocol.customHeaders是解决问题的第一步(我之前已经尝试过这个,但它没有用)。在此处添加为CORS设置所需的所有自定义标头和HTTP方法。

<httpProtocol>
    <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Methods" value="GET,POST,DELETE,HEAD,PUT,OPTIONS" />
        <add name="Access-Control-Allow-Headers" value="Origin, X-Olaround-Debug-Mode, Authorization, Accept" />
        <add name="Access-Control-Expose-Headers" value="X-Olaround-Debug-Mode, X-Olaround-Request-Start-Timestamp, X-Olaround-Request-End-Timestamp, X-Olaround-Request-Time, X-Olaround-Request-Method, X-Olaround-Request-Result, X-Olaround-Request-Endpoint" />
    </customHeaders>
</httpProtocol>

2。覆盖PHP的默认处理程序并删除OPTIONSVerbHandler

下一步(@Bing Han提供的解决方案)是删除IIS中定义的默认OPTIONSVerbHandler,还设置一个自定义PHP54_via_FastCGI处理程序,它接受您的其他HTTP方法。默认处理程序仅适用于GET,POST和HEAD请求。

<handlers>
    <remove name="OPTIONSVerbHandler" />
    <remove name="PHP54_via_FastCGI" />
    <add name="PHP54_via_FastCGI" path="*.php" verb="GET, PUT, POST, DELETE, HEAD, OPTIONS, TRACE, PROPFIND, PROPPATCH, MKCOL, COPY, MOVE, LOCK, UNLOCK" modules="FastCgiModule" scriptProcessor="D:\Program Files (x86)\PHP\v5.4\php-cgi.exe" resourceType="Either" requireAccess="Script" />
</handlers>

看一下内部工作的this post for more details

3。删除通过应用程序代码设置的所有响应标头

这是造成大多数问题的最后一块拼图。由于IIS已经添加<customHeaders>,我在上面的问题中共享的PHP代码片段正在复制它们。这导致浏览器级别出现问题,这些问题对同一类型的多个标头响应不佳。

适用于此问题的最终web.config

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="Imported Rule 1" stopProcessing="true">
                    <match url="^(.*)$" ignoreCase="false" />
                    <conditions logicalGrouping="MatchAll">
                        <add input="{R:1}" pattern="^(dir_path\.php|lolaround|lolaround\.php|app_assets)" ignoreCase="false" negate="true" />
                    </conditions>
                    <action type="Rewrite" url="lolaround.php/{R:1}" />
                </rule>
                <rule name="Imported Rule 2" stopProcessing="true">
                    <match url="lolaround/(.*)" ignoreCase="false" />
                    <action type="Rewrite" url="/lolaround.php/{R:1}" />
                </rule>
            </rules>
        </rewrite>
        <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="*" />
                <add name="Access-Control-Allow-Methods" value="GET,POST,DELETE,HEAD,PUT,OPTIONS" />
                <add name="Access-Control-Allow-Headers" value="Origin, X-Olaround-Debug-Mode, Authorization, Accept" />
                <add name="Access-Control-Expose-Headers" value="X-Olaround-Debug-Mode, X-Olaround-Request-Start-Timestamp, X-Olaround-Request-End-Timestamp, X-Olaround-Request-Time, X-Olaround-Request-Method, X-Olaround-Request-Result, X-Olaround-Request-Endpoint" />
            </customHeaders>
        </httpProtocol>
        <handlers>
            <remove name="OPTIONSVerbHandler" />
            <remove name="PHP54_via_FastCGI" />
            <add name="PHP54_via_FastCGI" path="*.php" verb="GET, PUT, POST, HEAD, OPTIONS, TRACE, PROPFIND, PROPPATCH, MKCOL, COPY, MOVE, LOCK, UNLOCK" modules="FastCgiModule" scriptProcessor="D:\Program Files (x86)\PHP\v5.4\php-cgi.exe" resourceType="Either" requireAccess="Script" />
        </handlers>
    </system.webServer>
</configuration>

注意:虽然@hcoat和@Bing Han的答案在这个问题上都很有用,但我只能将赏金奖励给其中一个。我决定把它交给@Bing Han,因为他的答案让我最接近解决方案(而且我无法找到一种方法从自己的搜索中添加自定义PHP处理程序。)

更新:我已经编辑了答案,以便添加对原始答案中缺少的HTTP DELETE方法的支持。

答案 1 :(得分:6)

HTTP OPTIONS请求失败,因为默认的PHP-CGI处理程序不处理“OPTIONS”动词。

web.config文件中添加以下代码将解决问题。

<configuration>
  <system.webServer>
    <!-- 
      Some other settings 
    -->
    <handlers>
      <remove name="OPTIONSVerbHandler" />
      <remove name="PHP54_via_FastCGI" />
      <add name="PHP54_via_FastCGI" path="*.php" verb="GET,HEAD,POST,OPTIONS" modules="FastCgiModule" scriptProcessor="D:\Program Files (x86)\PHP\v5.4\php-cgi.exe" resourceType="Either" />
    </handlers>
  </system.webServer>
</configuration>

我有一篇博文:http://tekblg.blogspot.sg/2013/09/azure-websites-php-cross-domain-request.html

答案 2 :(得分:4)

在Windows服务器上,您不能依赖于CORS的php头。 您需要在包含以下内容的站点根目录或应用程序根目录中创建web.config

<?xml version="1.0" encoding="utf-8"?>
<configuration>
 <system.webServer>
   <httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
       <add name="Access-Control-Allow-Methods" value="GET,POST,DELETE,HEAD,PUT,OPTIONS" />
       <add name="Access-Control-Allow-Headers" value="X-Olaround-Debug-Mode, Authorization, Accept" />
       <add name="Access-Control-Expose-Headers" value="X-Olaround-Debug-Mode, X-Olaround-Request-Start-Timestamp, X-Olaround-Request-End-Timestamp, X-Olaround-Request-Time, X-Olaround-Request-Method, X-Olaround-Request-Result, X-Olaround-Request-Endpoint" />
     </customHeaders>
   </httpProtocol>
 </system.webServer>
</configuration>

此过程可与设置.htaccess文件相媲美,重点在于您可以根据需要创建文件,而无需重新配置服务器。