사용자 정의 헤더는 액세스 제어 - 요청 - 헤더

Question

내 각 JS에 사용자 정의 헤더를 추가하려고를 추가됩니다 아래와 같이 요청을 GET :

$http({ 
     method : 'GET', 
     url : s, 
     headers : { 
     "partnerId" : 221, 
     "partnerKey" : "heeHBcntCKZwVsQo" 
     } 
    }) 

그러나 문제는 액세스에 추가지고 헤더입니다 ▪ 제어-요청 - 헤더 (403)는 금지 아래 내가 을 얻고로 응답 :

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:50.0) 
Gecko/20100101 Firefox/50.0 
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/ *;q=0.8 
Accept-Language: en-US,en;q=0.5 
Accept-Encoding: gzip, deflate 
Access-Control-Request-Method: GET 
Access-Control-Request-Headers: partnerid,partnerkey 
Origin: http://localhost:8080 
DNT: 1 
Connection: keep-alive 

나는 또한 변화 아래 시도했지만 운이

return $http.get(s, { 
    headers : { 
     'partnerId' : 221, 
     'partnerKey': 'heeHBcntCKZwVsQo' 
     } 
    }) 

다른 관련 답변에서 나는 헤더 partnerId 및 partnerKey가 서버 측에서 활성화되어야 함을 확인했습니다. 하지만 나는 POSTMAN 클라이언트 및 다른 POST 클라이언트에 이러한 사용자 정의 헤더를 추가하여 예상되는 응답을 얻을 수 있습니다. 그래서 나는 뭔가를 놓치고 있다고 생각합니다. 누군가 나를 인도 할 수 있습니까? 미리 감사드립니다

편집 : 제가 언급 한 또 하나의 사실은 partnerId가 요청을 전달하는 동안 partnerid로 대체된다는 것입니다. 차이가 있는지 확실하지 않습니다.

Answer 1

스크립트가있는 교차 원어 요청에 CORS-safelisted request-headers이 아닌 헤더를 추가하면 브라우저가 먼저 do a CORS preflight request으로 트리거됩니다.

사용자의 브라우저가 CORS 프리 플라이트를하지 못하게 할 방법이 없습니다. 테스트를 수행 할 때 자신의 브라우저에서 로컬로 이동하는 방법은 있지만 (예 : 우편 배달부 사용).

사용자가 사용자 지정 헤더로 스크립트 원본 상호 요청을 만드는 웹 응용 프로그램을 사용할 수있게하려면 해당 상호 원본 요청이 이동하는 서버가 CORS를 인식해야합니다.

Postman이 프리 플라이트를하지 않고 이러한 요청을 할 수있는 이유는 Postman이 브라우저 엔진이 아니기 때문입니다. 이것은 확장 프로그램이며 CORS 또는 같은 출처 정책에 의해 제한되지 않습니다.

우체부는 기본적으로 편의성을 위해 브라우저 UI 내에서 curl 또는 다른 도구로 수행 할 수 있습니다. 그렇지 않으면 브라우저에 내장 된 일반적인 웹 보안 기능을 우회합니다.