요청 헤더 필드 액세스 제어 허용 - 원본 허용되지 않음

Question

RESTFul API을 사용하여 PHP을 개발 중입니다. 예를 들어, 아래의 코드는 하나의 API입니다.

<?php 

    require('includes/config.php'); 

     $data = array(); 

     try { 
       $stmt = $db->query('SELECT postID, postTitle, postDesc, postDate,tags FROM blog_posts where inMain=inMain ORDER BY postID DESC LIMIT 5'); 
       $error = false; 
       $message = "ok"; 
       $i=0; 
       while($row = $stmt->fetch()){ 

        $tags = explode(",",$row['tags']); 
        $finalTags = array();   
        foreach($tags as $item) { 
         if($item != '' && $item != ' '){ 
          array_push($finalTags,strtolower(trim($item))); 
         } 
        } 

        array_push($data, [ 
         'id' => $row['postID'], 
         'title' => $row['postTitle'], 
         'desc' => $row['postDesc'], 
         'date' => $row['postDate'], 
         'tags' => $finalTags 
        ]); 

       } 
      } catch(PDOException $e) { 
       $message = $e->getMessage(); 
       $error = true; 
      } 
    $response = array(); 
    $response["data"] = $data; 
    $response["error"] = $error; 
    $response["message"] = $message; 

header('Access-Control-Allow-Origin: *'); 
header('Access-Control-Allow-Credentials: true'); 
header('Access-Control-Allow-Methods: GET,HEAD,OPTIONS,POST,PUT'); 
header('Access-Control-Allow-Headers: Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers'); 
header('Content-Type: application/json'); 

echo json_encode($response); 
?> 

브라우저에서이 API를 호출하면 정상적으로 작동합니다. 나는 다음과 같은 AngularJS와에서이 API를 호출하는 것을 시도하고있다

XMLHttpRequest cannot load http://www.example.com/api/v1/getPostsInMain.php. Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response. 

: : 문제가 여기에 무엇

app.factory("Data", ['$http', 'toaster', 
    function ($http, toaster) { // This service connects to our REST API 

     var serviceBase = 'http://www.example/v1/'; 
     var conf= { headers: { 
      'Access-Control-Allow-Origin':'*', 
      'Access-Control-Allow-Methods': 'GET, POST, PATCH, PUT, DELETE, OPTIONS', 
      'Access-Control-Allow-Headers': 'Origin, Content-Type, X-Auth-Token', 
      'Content-Type': 'application/json' 
     } 
     }; 

     var obj = {}; 
     obj.toast = function (data) { 

      toaster.pop(data.status, "", data.message, 10000, 'trustedHtml'); 
     } 
     obj.get = function (q) { 
      return $http.get(serviceBase + q,conf).then(function (results) { 
       return results.data; 
      }); 
     }; 
     obj.post = function (q, object) { 
       return $http.post(serviceBase + q, object, conf).then(function (results) { 
       return results.data; 
      }); 
     }; 
     return obj; 
}]); 

내가 자바 스크립트에서 호출 할 때 그러나 나는 다음과 같은 오류가? 요청과 응답에 필요한 헤더를 설정할 수 있습니까? 그것은 내가 사용하는 호스팅과 관련이 있습니까?

Answer 1

서버 (PHP)도 CORS를 허용해야합니다. PHP 스크립트 시작 부분에 다음 헤더를 추가하십시오.

header("Access-Control-Allow-Origin: *");