Angular $ http가 PUT / POST 대신 OPTIONS를 보냅니다.

Angular $ http가 PUT / POST 대신 OPTIONS를 보냅니다.

---

PHP 백엔드를 통해 MySQL 데이터베이스에서 데이터를 업데이트 / 삽입하려고합니다. AngularJS로 프런트 엔드를 구축 $http하고 REST API와 통신하기 위해 서비스를 사용하고 있습니다.

내 설정은 다음과 같습니다.

$ httpProvider를 통해 헤더를 설정하고 있습니다.

 $httpProvider.defaults.withCredentials = true;
 $httpProvider.defaults.headers = {'Content-Type': 'application/json;charset=utf-8'};

그리고 POST-Call은 다음과 같습니다.

   return $http({
      url: url,
      method: "POST",
      data: campaign
    });

Chrome의 Dev Console에 다음이 표시됩니다.

POST에서 PUT으로 변경할 때 PUT 대신 OPTIONS 호출을 보냅니다. 그리고 콘텐츠 유형은 content-type.

내 요청 페이로드는 객체로 전송됩니다.

헤더를 올바르게 설정하려면 어떻게해야합니까?

---

편집하다:

PHP 백엔드는 일부 헤더를 설정합니다.

   $e->getResponse()
              ->getHeaders()
              ->addHeaderLine('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');

   $e->getResponse()
              ->getHeaders()
              ->addHeaderLine('Access-Control-Allow-Origin', '*');

빠진 것이 있습니까?

---

좋아, 내가 해결했다.

문제는 무엇 이었습니까?
DELETE, PUT 및 POST에 대한 CORS 워크 플로는 다음과 같습니다.

그것이하는 일은 :

1. 어떤 요청이 이루어질 지 확인
2. POST, PUT 또는 DELETE 인 경우
3. 먼저 OPTION 요청을 보내 요청을 보낸 도메인이 서버에서 보낸 도메인과 동일한 지 확인합니다.
4. 그렇지 않은 경우 Access-Header가이 요청을 보낼 수 있기를 원합니다.

중요 : OPTIONS 요청은 사용자 인증 정보를 전송하지 않습니다 .

그래서 내 백엔드 서버가 PUT 요청을 허용하지 않았습니다.

해결책 :
이것을 .htaccess파일 안에 넣으십시오 .

RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ blank.php [QSA,L]
Header set Access-Control-Allow-Origin "http://sub.domain:3000"
Header always set Access-Control-Allow-Credentials "true"
Header always set Access-Control-Max-Age "1000"
Header always set Access-Control-Allow-Headers "X-Requested-With, Content-Type, Origin, Authorization, Accept, Client-Security-Token, Accept-Encoding"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"

그런 다음 공용 폴더 안에 blank.php라는 빈 .php 파일을 만듭니다.

편집 : 한 주석가가 지적했듯이 빈 PHP 파일을 만드는 대신이 재 작성 규칙을 .htaccess 파일에 추가 할 수 있습니다 \;

RewriteRule ^(.*)$ $1 [R=200,L,E=HTTP_ORIGIN:%{HTTP:ORIGIN}]]

명확히하기 위해 :

1. 이미 Access-Control-Header를 보냈습니다.
2. 해결 된 것은 처음 두 줄이었고
3. Port를 사용하여 특정 하위 도메인에서 Access-Control-Allow-Origin

CORS 에 대해 자세히 알아볼 수있는 최고의 웹 사이트 입니다.

---

$http헤더를 수동으로 지정할 필요가 없습니다. 모든 작업이 백그라운드에서 수행되며 자동으로 application/jsonfor POST및 PUTtype 요청 으로 설정됩니다 . 그래서 당신이해야 할 일은

$http.post(url, data);
$http.put(url, data);

참고 URL : https://stackoverflow.com/questions/30254277/angular-http-is-sending-options-instead-of-put-post