요청 헤더 필드 Access-Control-Allow-Headers가 Access-Control-Allow-Headers에서 허용되지 않습니다.

요청 헤더 필드 Access-Control-Allow-Headers가 Access-Control-Allow-Headers에서 허용되지 않습니다.

Post Request와 함께 서버에 파일을 전송하려고 하는데 전송 시 다음 오류가 발생합니다.

요청 헤더 필드의 Content-Type이 Access-Control-Allow-Headers에서 허용되지 않습니다.

그래서 구글에서 오류를 검색해서 머리글을 추가했습니다.

$http.post($rootScope.URL, {params: arguments}, {headers: {
    "Access-Control-Allow-Origin" : "*",
    "Access-Control-Allow-Methods" : "GET,POST,PUT,DELETE,OPTIONS",
    "Access-Control-Allow-Headers": "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"
}

다음 오류가 나타납니다.

요청 헤더 필드 Access-Control-Allow-Origin이 Access-Control-Allow-Headers에서 허용되지 않습니다.

그래서 나는 그것을 검색했고 내가 찾을 수 있는 유일한 유사한 질문은 반쪽짜리 답변을 제공한 후 주제를 벗어났다.어떤 헤더를 추가/삭제해야 합니까?

저도 같은 문제가 있었어요.jQuery 문서에서 찾은 내용은 다음과 같습니다.

요구의 경우 을 "" 이외의 임의의 합니다.application/x-www-form-urlencoded,multipart/form-data , 「」text/plain는 브라우저가 실행 전 OPTIONS 요청을 서버로 전송하도록 트리거합니다.

하지만 ""는 하지 않습니다.Access-Control-Allow-Headers에러가 발생합니다.은 " " " " 입니다.application/jsonOPTION 청 option option option option option 。하거나 angular default header를 합니다.Access-Control-Allow-Headers인스톨 되어 있습니다.하다

$http.post(url, data, {
    headers : {
        'Content-Type' : 'application/x-www-form-urlencoded; charset=UTF-8'
    }
});

(POST 요구가 송신되는) 서버에는,Access-Control-Allow-Headersheader(등)를 참조해 주세요.고객으로부터의 요구에 그것들을 넣는 것은 효과가 없습니다.POST 요청에서 'Access-Control-Allow-...' 헤더를 제거해야 합니다.

오리진 요구를 것(및 「」를 허가하는 것)을 있기 입니다.Content-Typeheader 는 특정 가 CORSrequest header를 할 수 .

요청자(웹 브라우저)는 OPTIONS 요청을 전송함으로써 서버의 동일한 오리진 정책이 무엇인지 미리 테스트할 수 있습니다(즉, 의도한 'POST' 또는 'GET' 요청이 아님).OPTIONS 요청에 대한 응답에 요청의 헤더, 오리진 또는 메서드를 허용하는 'Access-Control-Allow-...' 헤더가 포함된 경우 요청자/브라우저는 'POST' 또는 'GET' 요청을 보냅니다.

(메모:)액세스 컨트롤 허가...는, 허가된 특정의 송신원, 헤더, 또는 메서드를 일람표시하지 않고, 값 「」을 설정합니다. 그러나 사용하던 이전 Android WebView클라이언트에서는 와일드카드가 적용되지 않아 OPTIONS 요청에 대한 응답으로 Access-Control-Allow-Headers 헤더에 나열된 특정 헤더가 필요했습니다.

안 와일드카드 사용 안 함] 나쁜 솔루션이므로 안 함*localhost꼭 필요한 일이 있으면 말씀해주세요.

public class SimpleCORSFilter implements Filter {

public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
    HttpServletResponse response = (HttpServletResponse) res;
    response.setHeader("Access-Control-Allow-Origin", "my-authorized-proxy-or-domain");
    response.setHeader("Access-Control-Allow-Methods", "POST, GET");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");
    chain.doFilter(req, res);
}

public void init(FilterConfig filterConfig) {}

public void destroy() {}

}

(POST 요구의 송신지) 서버는, 응답에 Content-Type 헤더를 포함할 필요가 있습니다.

다음은 커스텀 "X_ACCESS_TOKEN" 헤더를 포함한 일반적인 헤더 목록입니다.

"X-ACCESS_TOKEN", "Access-Control-Allow-Origin", "Authorization", "Origin", "x-requested-with", "Content-Type", "Content-Range", "Content-Disposition", "Content-Description"

이것이, 요구를 송신하는 Web 서버에 대해서 http 서버 담당자가 설정할 필요가 있습니다.

또한 서버 담당자에게 "Content-Length" 헤더를 노출하도록 요청할 수도 있습니다.

이를 Cross-Origin Resource Sharing(CORS) 요구로 인식하고 서버 구성의 영향을 이해해야 합니다.

상세한 것에 대하여는, 다음을 참조해 주세요.

• http://www.w3.org/TR/cors/
• http://enable-cors.org/

다음과 같이 PHP에서 적절한 헤더를 활성화할 수 있습니다.

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, X-Requested-With");

nodejs 에서는, 다음의 조작이 가능합니다.

xServer.use(function(req, res, next) {
  res.setHeader("Access-Control-Allow-Origin", 'http://localhost:8080');
  res.setHeader('Access-Control-Allow-Methods', 'POST,GET,OPTIONS,PUT,DELETE');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type,Accept');

  next();
});

「 」를 사용하고 localhost는 이 를 해결하기 위해 과 같이

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Content-Type'); 

프런트 엔드 사용 시:

{headers: {"Content-Type": "application/json"}}

더 를 일으키지 .localhost!

Asp Net Core에서는 개발을 위해 신속하게 기능하기 위해Startup.cs,Configure method

app.UseCors(options => options.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader());

설정하려는 헤더는 응답 헤더입니다.이러한 요청은 요청 대상 서버에서 응답으로 제공해야 합니다.

그들은 고객으로 설정될 장소가 없다.데이터를 소유한 사이트가 아닌 허가를 원하는 사이트에 의해 허가를 받을 수 있다면 허가를 부여하는 수단을 갖는 것은 무의미할 것이다.

Express 서버에서 이 문제가 발생하는 경우 다음 미들웨어를 추가하십시오.

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

만약 당신이 ionic2 또는 angularjs 2에 대한 javascript 요청을 테스트한다면, 당신은 crossorigin을 허용하기 위해 크롬 브라우저를 위한 CORS 플러그인을 반드시 설치하세요.

mayba get requests는 그것이 필요 없이 작동될 것입니다, 하지만 게시와 puts and delete는 문제없이 가기 위해 테스트를 위해 당신이 cors 플러그인을 설치해야 할 것입니다, 그것은 확실히 쿨하지 않습니다, 하지만 나는 사람들이 어떻게 CORS 플러그인 없이 그것을 하는지 모릅니다.

또한 어떤 json 상태에서도 json 응답이 400을 반환하지 않는지 확인합니다.

이것은 백엔드의 문제입니다.백엔드에서 sails api를 사용하는 경우 cors.filename을 변경하고 여기에 필드를 추가합니다.

module.exports.cors = {
  allRoutes: true,
  origin: '*',
  credentials: true,
  methods: 'GET, POST, PUT, DELETE, OPTIONS, HEAD',
  headers: 'Origin, X-Requested-With, Content-Type, Accept, Engaged-Auth-Token'
};

제 경우 웹 서비스 메서드에 @HeaderParam과 같은 여러 파라미터를 수신하고 있습니다.

이러한 파라미터는 CORS 필터에 다음과 같이 선언해야 합니다.

@Provider
public class CORSFilter implements ContainerResponseFilter {

    @Override
    public void filter(ContainerRequestContext requestContext, ContainerResponseContext responseContext) throws IOException {

        MultivaluedMap<String, Object> headers = responseContext.getHeaders();

        headers.add("Access-Control-Allow-Origin", "*");
        ...
        headers.add("Access-Control-Allow-Headers", 
        /*
         * name of the @HeaderParam("name") must be declared here (raw String):
         */
        "name", ...);
        headers.add("Access-Control-Allow-Credentials", "true");
        headers.add("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS, HEAD");   
    }
}

Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers에러란Access-Control-Allow-OriginHTTP 헤더의 필드는 응답에 의해 처리되거나 허용되지 않습니다.제거한다.Access-Control-Allow-Origin[ ] 를 입력합니다.

서버의 다음 기능을 추가했습니다.web.config파일:

<system.webServer>
    <httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="https://other.domain.com" />
            <add name="Access-Control-Allow-Methods" value="GET,POST,OPTIONS,PUT,DELETE" />
            <add name="Access-Control-Allow-Headers" value="Content-Type,X-Requested-With" />
        </customHeaders>
    </httpProtocol>
<system.webServer>

내게는 와일드카드가 있었다."*" 의 액세스 제어 허가 헤더web.config:

<add name="Access-Control-Allow-Headers" value="*" />

이 솔루션은 대부분의 네비게이터에서 작동하지만 Safari 또는 IE에서는 작동하지 않습니다.

해결방법은 모든 커스텀헤더를 수동으로 추가하는 것이었습니다.web.config:

<system.webServer>
    <httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="https://somedomain.com" />
            <add name="Access-Control-Allow-Methods" value="GET,POST,OPTIONS,PUT,DELETE" />
            <add name="Access-Control-Allow-Headers" value="custom-header1, custome-header2, custome-header3" />
        </customHeaders>
    </httpProtocol>
<system.webServer>

언급URL : https://stackoverflow.com/questions/25727306/request-header-field-access-control-allow-headers-is-not-allowed-by-access-contr