독서 응답 헤더를 가져 API

나는'm 에서 구글 크롬 확장 프로그램에 대한 권한이 있는"*://*/*"나는'm 를 만들려고 노력 스위치에서 XMLHttpRequest 을Fetch API.

확장 저장 사용자 입력 로그인 데이터를 사용되는 직접 XHR's open()호출은 HTTP 인증에 가져올 수 있는 더 이상 직접적으로 사용될을 매개 변수로 사용할 수 있습니다. HTTP Basic Auth,우회하는 이 제한은,사소한으로 수동으로 설정할 수 있습 Authorization header:

fetch(url, {
  headers: new Headers({ 'Authorization': 'Basic ' + btoa(login + ':' + pass) })
  } });

HTTP Digest Auth그러나 필요한 더 많은 상호 작용;읽을 필요가 매개 변수는 이 서버로 보내고 당신께 401 을 반응을 기술하는 유효한 승인 토큰을 발급합니다. 나는've tried 읽WWW-Authenticate응답 헤더 필드에 이 snippet:

fetch(url).then(function(resp) {
  resp.headers.forEach(function(val, key) { console.log(key + ' -> ' + val); });
}

하지만 모두가 이 출력:

content-type -> text/html; charset=iso-8859-1

는 그 자체가 정확하지만,는's 아직도 주변 6 개의 필드에 따르면 크롬's 개발자 도구입니다. 을 사용하면resp.헤더입니다.get("WWW-Authenticate")(또는 임의의 다른 분야에 대한 문제),서만 나옵니다.

의 기회를 얻을 다른 필드를 사용하여 가 API?

해결책

이 제한 액세스를 응답 헤더를 사용할 때를 가져 API 를 통해 CORS. 이로 인해 제한,당신은에 액세스할 수 있습만 다음과 같은 표준 headers:

-Cache-Control -콘텐츠의 언어 -Content-Type -만료 -마지막 수정 -Pragma

할 때 쓰는 코드는 구글 크롬 확장 프로그램을 통해,당신은 당신을 사용하여CORS,따라서 할 수 있't 액세스의 모든 헤더가 있습니다. 을 제어하는 경우에는 서버,당신은 반환할 수 있는 사용자 정보에서 응답은대신에헤더

이에 대한 자세한 정보를 원하시는 제한-https://developers.google.com/web/updates/2015/03/introduction-to-fetch#response_types

해설 (6)

에서

그래서 당신은 것을 배울 수 있습니다 헤더에 액세스하여 항목을 반복기입니다.

// Display the key/value pairs
for (var pair of res.headers.entries()) {
   console.log(pair[0]+ ': '+ pair[1]);
}

또한,이]2일부:

For security reasons,일부 헤더를 만에 의해 제어 할 수있다 사용자 에이전트. 이러한 헤더를 포함한 자 헤더 이름과 자금성은 응답 헤더 이름이 있습니다.

해설 (1)

이전 버전과의 호환성을 위해 지원하지 않는 브라우저 ES2015 반복기를(아마도 가져올/약속 polyfills)에헤더가 있습니다.forEach기능은 최고의 옵션:

r.headers.forEach(function(value, name) {
    console(name + ": " + value);
});

에서 테스트 IE11 와드로 약속 polyfill 및 whatwg-가져오로 가져올 polyfill. 헤더입니다.항목(),헤더가 있습니다.키()고 합니다.(값)작동하지 않습니다.

해설 (0)

에 대한 해결하기 위해 저희에게 이러한 제한 문제를 추가 노출되는 헤더 이름은 좋은 충분합니다.

액세스 통제-폭-headers:headername1,headername2,...

설정한 후에 이 헤더는 클라이언트 측 스크립트를 읽을 수 있는 그 헤더(headername1,headername2,...)응답에서.

해설 (0)