フェッチAPIを使用してCORSリクエストでヘッダフィールドを取得する方法

Question

ソースコードにアクセスできないサーバがありますので、そこに何が起こっているのかわかりません。

CORSリクエストを送信しようとしていますが、リクエストは成功しています。レスポンスにはLocationヘッダーが必要です。また、Dev ToolsのFirefoxのNetwork Monitorタブと同様にcURLを使用していることを確認できます。しかし、私はXMLHttpRequestを使ってJavaScriptでこれにアクセスすることはできませんまたはAPIをフェッチします。

fetch apiを使用している私のコードは以下の通りです。

fetch(url, { 
    method: 'post', 
    mode: 'cors', 
    credentials: 'include', 
    body: 'creating a new session', 
    headers: { 
    'Access-Control-Request-Headers': 'Location', 
    'Content-Type': 'text/html', 
    }, 
}). 
then((res) => { 
    if (res.status >= 200 && res.status < 300) { 
    console.log('Location:', res.headers.get('Location')); 
    } else { 
    throw new Error('Ooops...something went wrong.'); 
    } 
}) 
.catch(e => console.log(e.message)); 

Firefoxの[ネットワークモニタ]タブには、次のエントリがあります。

[Response Headers] 
Access-Control-Allow-Credentials: "true" 
Access-Control-Allow-Origin: "http://localhost:8081" 
Content-Length: <some length> 
Date: <some date> 
Location: <required info is shown> 
Server: <some info> 

[Request Header] 
Host: <host name> 
User Agent: <user agent info for Firefox> 
Accept: <a lot of stuff> 
Accept-Language: "en-US,en;q=0.5" 
Accept-Encoding: "gzip, deflate" 
Content-Type: "text/plain;charset=UTF-8" 
Referer: "http://localhost:8081" 
Origin: <same as Referer> 
Content-Length: "22" 
Authorization: <some string> 
Connection: "keep-alive" 

ロケーションヘッダーを抽出するには何が必要ですか？

Answer 1

@ JaromandaXが指摘したように、サーバレスポンスには'Access-Control-Expose-Headers': 'Location'がないため、レスポンスオブジェクトからLocationヘッダーにアクセスできなくなりました。サーバーで修正する必要がありましたが、今はすべてが完璧に機能しています。