取得 - 認証と、私はCORSを超えるフェッチに苦しんでいたプリフライト応答

Question

への対応：

Request Method:OPTIONS

私は見て：私はこの要求を実行すると、クロムなどのヘッダを設定

const token = 'this.is.secret!'; 
fetch('http://corsserver/api/hello', { 
    method: 'get', 
    credentials: 'include', 
    mode: 'cors', 
    headers: { 
     'Authorization': `Bearer ${token}`, 
     'Content-Type': 'application/x-www-form-urlencoded' 
    } 
}).then(response => { 
    console.log(response); 
}).catch(error => { 
    console.log(error); 
}); 

これ以上、it's a preflighted requestです。

私はそれが本当にクールで物事を意味します。しかし、私はプリフライトが大丈夫になった後に実際のリクエストを送信する方法を理解できません！次のステップは何ですか？ GETリクエストを送信するにはどうすればよいですか？

ここでは非常に基本的なものがありません。

Answer 1

リクエストが成功した場合、ブラウザは自動的に実際のGETリクエストを送信します。しかし、OPTIONSリクエストが成功しなかった場合、ブラウザは決してGETリクエストを行いません。

そして、を実行しているブラウザでGETリクエストを行う方法は他にありません。

ブラウザがGETリクエストを実行していない場合は、OPTIONSが失敗している必要があり、その理由を把握する必要があります。ブラウザはdevtoolsコンソールにその理由を示すメッセージを記録する必要があります。そこでまずチェックしてから、その情報を追加するために質問を編集/更新するか、エラーメッセージとともに別の新しい質問を投稿してください。 。問題が何であるかについて

---

一つの推測：たぶんサーバーはOPTIONS要求に対する認証を必要とされます。その場合は、ブラウザがOPTIONSリクエストを行ったときに、コードからAuthorizationヘッダー+値を送信しないため、サーバーを修正しないでください。

この場合、実際にはOPTIONSリクエストの目的は、ブラウザが質問するためのものです。Authorizationリクエストヘッダーを含むクロスオリジンリクエストを取得できますか？と、サーバーがAuthorizationヘッダーを許可するかどうかを示す方法で応答するようにします。

したがって、サーバーは、認証を必要とせずに、2xxの成功応答で、少なくともOPTIONSの要求（許可された起点からのもの）に応答するように構成する必要があります。

サーバーがOPTIONS要求の認証を要求しているかどうかは、ブラウザがログしているCORSエラーメッセージにOPTIONS応答の401ステータスが表示されている場合です。

---

のNode.jsサーバー環境でOPTIONSを処理するためのコード例：

if (req.method === 'OPTIONS') { 
    res.send(); 
    return; 
} 

...サーバーは、あなたがこのために何をしたいです無応答の本体で200応答を送るようにします。これは、OPTION要求をすべて明示的に許可することに注意してください。