CORS google chrome拡張機能に代わるものはありますか?CORSを使用せずにajaxリクエストを成功させる方法は?

ライアン・ダンゲル

こんにちは私はReactとaxiosを使用してコースをフェッチするUdemyAPIを構築しました。ChromeでCORS拡張機能がオンになっている場合は正常に機能しますが、それ以外の場合はデータをフェッチしません。

この問題についてはすでに質問しましたので、お読みください。私はオンラインで提供されるすべてのソリューションを試しました。ありがとう

関連する問題:リソースの読み込みに失敗しました。OriginはAccess-Control-Allow-Originで許可されていません

シュロイ

この問題は通常、バックエンドサーバーに関連していますが、サーバーにアクセスできない場合は、2つのオプションがあります

このChrome拡張機能を使用する最初のオプションAllow-Control-Allow-Originですが、残念ながらこの拡張機能は他のブラウザでは使用できないため、使用する必要があります

次のようなオンラインCORSプロキシを使用する2番目のオプション

https://cors-anywhere.herokuapp.com/http://example.com

http://cors-proxy.htmldriven.com/?url=http://www.htmldriven.com/sample.json

CORSプロキシは、サードパーティサービスへの標準AJAXリクエストの実行に関連する同一生成元ポリシーをバイパスする必要がある開発者向けの無料サービスです。

CORSプロキシを使用したAxiox呼び出しの例を次に示します

const urlProxy = 'https://cors-anywhere.herokuapp.com/http://example.com';
export function post() {
    let users = {
        username: '',
        password: '',
    };
    return axios({
            method:'POST',
            url:urlProxy,
            data: users, // Delete it if you dont have a data
            withCredentials: true, // Delete it if your request doesn't required credentials
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json'
                'Origin': '*',
                'Access-Control-Allow-Headers': '*',
                'Access-Control-Allow-Origin': '*',
            }
        })

            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            })
}

withCredentials()XHRリクエストにブラウザでCookieと認証ヘッダーを含めるように追加しました。サービスがCookie(セッションCookieを含む)に依存している場合、このオプションセットでのみ機能します。

2015年3月5日にリリースされた最新のFirefox(ビルド36.0.1)で動作するHTTP応答にCORSヘッダーを追加するFirefox拡張機能がありますこのリンクをチェックしてください

これがお役に立てば幸いです

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

Related 関連記事

ホットタグ

アーカイブ