FetchAPIでCORSの問題を修正するにはどうすればよいですか

ティダサパンカジャ

私はreactjsを使用してフロントエンドのみの基本的な天気アプリを構築しています。APIリクエストには、FetchAPIを使用しています。私のアプリでは、見つけ単純なAPIから現在の場所を取得しており、JSONオブジェクトとして場所を提供します。しかし、Fetch APIを介してリクエストすると、このエラーが発生します。

Failed to load http://ip-api.com/json: Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response.

そこで私はこれを修正するための複数の解決策を探して見つけました。

  1. ChromeでCORSを有効にするとエラーは解決しますが、アプリをherokuにデプロイするときに、同じCORSの問題が発生することなく、モバイルデバイスからアプリにアクセスするにはどうすればよいですか。
  2. CORSリクエストを有効にするプロキシAPIを見つけましたただし、これはロケーションリクエストであるため、プロキシサーバーのロケーションがわかります。したがって、それは解決策ではありません。
  3. このStackoverflowの質問に回答し、httpリクエストのヘッダーにヘッダーを追加しましたが、問題は解決しません。(それでも同じエラーが発生します)。

では、どうすれば問題を永続的に解決できますか?Fetch APIでhttpリクエストのCORS問題を解決するために使用できる最善のソリューションは何ですか?

ブレントブラッドバーン

そのAPIは寛容であるように見え、 Access-Control-Allow-Origin:*

何が問題を引き起こしているのかはわかりませんが、それが単なるフェッチAPIではないと思います

これはFirefoxとChromeの両方でうまくいきました...

fetch('http://ip-api.com/json')
   .then( response => response.json() )
   .then( data => console.log(data) )

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

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

編集
0

コメントを追加

0

関連記事

分類Dev

この問題を修正するにはどうすればよいですか?

分類Dev

phpMyAdminに関するこれらの問題を修正するにはどうすればよいですか?

分類Dev

replace()で発生するこの問題を修正するにはどうすればよいですか?Python

分類Dev

Scrapyを使用する際の注文の問題を修正するにはどうすればよいですか?

分類Dev

TikZでこのタグの配置の問題を修正するにはどうすればよいですか?

分類Dev

かみそりで次の問題を修正するにはどうすればよいですか?

分類Dev

Laravelのあいまいな列の問題を修正するにはどうすればよいですか?

分類Dev

Linuxで日付同期の問題を恒久的に修正するにはどうすればよいですか?

分類Dev

CFNetworkの問題をiOSで迅速に修正するにはどうすればよいですか?

分類Dev

XamarinでTakePictureのSyncContext.csの問題を修正するにはどうすればよいですか?

分類Dev

Pythonでシーザー暗号のこの問題を修正するにはどうすればよいですか?

分類Dev

Clojureでこの依存関係の問題を修正するにはどうすればよいですか?

分類Dev

最新のDropboxで `libdropbox_apex.so`の問題を修正するにはどうすればよいですか?

分類Dev

認識されないクラスの問題を修正するにはどうすればよいですか?

分類Dev

Pythonでinput()の問題を修正するにはどうすればよいですか?

分類Dev

ElixirでGoogleFirestoreの問題を修正するにはどうすればよいですか?

分類Dev

TypeErrorでこの問題を修正するにはどうすればよいですか?

分類Dev

「日付」でnullの問題を修正するにはどうすればよいですか?

分類Dev

Pythonで文字列整数の問題を修正するにはどうすればよいですか

分類Dev

CodeIgniter 3.1.0でbase_url()の問題を修正するにはどうすればよいですか?

分類Dev

--prodモードでngForリストの問題を修正するにはどうすればよいですか?

分類Dev

Viewを無効にしてScrollViewの問題を修正するにはどうすればよいですか?

分類Dev

コーディングの問題、これを修正するにはどうすればよいですか?

分類Dev

vuetifyの拡張パネルの問題を修正するにはどうすればよいですか?

分類Dev

この更新の問題を修正するにはどうすればよいですか?

分類Dev

入力の「nextLine()」の問題を修正するにはどうすればよいですか?

分類Dev

この解凍の問題を修正するにはどうすればよいですか?

分類Dev

iOS:次の警告の問題を修正するにはどうすればよいですか?

分類Dev

SwiftのDisappearing / Invisible / Empty UITableViewCellsの問題を修正するにはどうすればよいですか?

Related 関連記事

  1. 1

    この問題を修正するにはどうすればよいですか?

  2. 2

    phpMyAdminに関するこれらの問題を修正するにはどうすればよいですか?

  3. 3

    replace()で発生するこの問題を修正するにはどうすればよいですか?Python

  4. 4

    Scrapyを使用する際の注文の問題を修正するにはどうすればよいですか?

  5. 5

    TikZでこのタグの配置の問題を修正するにはどうすればよいですか?

  6. 6

    かみそりで次の問題を修正するにはどうすればよいですか?

  7. 7

    Laravelのあいまいな列の問題を修正するにはどうすればよいですか?

  8. 8

    Linuxで日付同期の問題を恒久的に修正するにはどうすればよいですか?

  9. 9

    CFNetworkの問題をiOSで迅速に修正するにはどうすればよいですか?

  10. 10

    XamarinでTakePictureのSyncContext.csの問題を修正するにはどうすればよいですか?

  11. 11

    Pythonでシーザー暗号のこの問題を修正するにはどうすればよいですか?

  12. 12

    Clojureでこの依存関係の問題を修正するにはどうすればよいですか?

  13. 13

    最新のDropboxで `libdropbox_apex.so`の問題を修正するにはどうすればよいですか?

  14. 14

    認識されないクラスの問題を修正するにはどうすればよいですか?

  15. 15

    Pythonでinput()の問題を修正するにはどうすればよいですか?

  16. 16

    ElixirでGoogleFirestoreの問題を修正するにはどうすればよいですか?

  17. 17

    TypeErrorでこの問題を修正するにはどうすればよいですか?

  18. 18

    「日付」でnullの問題を修正するにはどうすればよいですか?

  19. 19

    Pythonで文字列整数の問題を修正するにはどうすればよいですか

  20. 20

    CodeIgniter 3.1.0でbase_url()の問題を修正するにはどうすればよいですか?

  21. 21

    --prodモードでngForリストの問題を修正するにはどうすればよいですか?

  22. 22

    Viewを無効にしてScrollViewの問題を修正するにはどうすればよいですか?

  23. 23

    コーディングの問題、これを修正するにはどうすればよいですか?

  24. 24

    vuetifyの拡張パネルの問題を修正するにはどうすればよいですか?

  25. 25

    この更新の問題を修正するにはどうすればよいですか?

  26. 26

    入力の「nextLine()」の問題を修正するにはどうすればよいですか?

  27. 27

    この解凍の問題を修正するにはどうすればよいですか?

  28. 28

    iOS:次の警告の問題を修正するにはどうすればよいですか?

  29. 29

    SwiftのDisappearing / Invisible / Empty UITableViewCellsの問題を修正するにはどうすればよいですか?

ホットタグ

アーカイブ