Question

我已经有这个问题已经有一天多的时间了，而且我已经知道了这个问题！首先，我以前从未与AngularJS合作过，虽然我可以看到其中的好处是一个巨大的学习曲线。我正在尝试使用Angular将php应用程序的请求发送到$httpd.post()文件，但每次执行此操作时，我都会在控制台中收到以下错误：

XMLHttpRequest cannot load http://localhost/angular-service/index.php. Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response.

让我详细介绍一下。

Angular Application正在Gulp server上运行，PHP文件托管在XAMP localhost上。 Gulp在端口80上运行端口8080和XAMP。

我试图通过转到httpd.conf文件并在最底层添加以下内容来配置XAMP以启用CORS标头：

<Directory />
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Headers "Content-Type"
    Header set Access-Control-Allow-Methods "GET, PUT, OPTIONS, DELETE, POST"
</Directory>

遗憾的是，这没有产生任何影响。

我的angular应用程序中发出请求的代码块在这里：

 $scope.getSomething = function () {       
     $http({
          method: "POST",
          url: "http://localhost/angular-service/index.php",
          data: "",
          headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        }).
        success(function(response) {
            if(response==1){
               console.log(response);
            }
        }).
        error(function(response){
            console.log(response);
        });
    }

PHP文件位于：

$postdata = file_get_contents("php://input");
$request = json_decode($postdata);
echo "I'm a PHP File";

任何人都可以请我指出正确的方向，我需要做些什么来解决这个问题。令人难以置信的是令人沮丧！

Answer 1

我建议你在PHP文件中添加请求方法。这是一个例子：

<?php
   header("Access-Control-Allow-Origin: http://yourdomain");

   /* Allowed request method */
   header("Access-Control-Allow-Methods: PUT");

   /* Allowed custom header */
   header("Access-Control-Allow-Headers: Content-Type");

   /* Age set to 1 day to improve speed caching */
   header("Access-Control-Max-Age: 86400");

   /* Options request exits before the page is completely loaded */ 
   if (strtolower($_SERVER['REQUEST_METHOD']) == 'options') 
   {
      exit();
   }

   /* Response data */ 
   $arr = array("user_name" => "tizen", "phone_number" => "12312334234");   

   /* Response data returned in JSON format */
   echo json_encode($arr);
?>

找到有关CORS协议的更多信息here

Answer 2

尝试将此添加到您的.htaccess：

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

当我遇到与PHP和Angularjs相同的问题时，这会有所帮助。

AngularJS应用程序与XAMP Localhost上的PHP文件通信

2 个答案: