クロスドメインの問題をフロントエンドとして解決するには?

小さな関数を完成させ、すべてを正しく記述しましたか? axios の結果を確認すると、コンソールが人気になり、ネットワーク タブがクロスオリジンの問題を要求する必要があることがわかりましたか? はい、クロスドメインの問題です, これはブラウザの同一オリジン ポリシーに由来します. ajax を送信すると、URL とリクエスト アドレスは異なるソース (プロトコル、ドメイン名、ポート) によって引き起こされます. この時点で、バックエンドと通信できます。クラスメートフレンドリー。

1. 勝った場合は、バックエンドがサーバー側の問題を解決します。何もする必要はありません。

2. もしあなたが彼ほど強くないなら、あなたは自分で構成を書くことができます。 

① JSONP を使用してリクエストを送信する

②リクエストヘッダーにクロスドメインへのパーミッションを追加 

        res.setHeader("Access-Control-Allow-Origin", "*");

③vue-cli を使用している場合、おめでとうございます、vue cli に付属のプロキシ サーバー davServer

        vue.config.js では、module exports = { davServer:{ proxy:{ xxx } } }

必要なのは、xxx に属性を追加することだけです。たとえば、クロスドメインの問題のあるインターフェイスが発生した場合、すべてのインターフェイスに /api というプレフィックスが付いている場合は、次のようにすることができます。

devServer: {
    // 配置代理
    proxy: {
      '/api': {
        target: '跨域接口基地址'
      }
    }
  },

もう 1 つの重要なステップは、リクエスト モジュールのベース アドレスを削除し、ターゲットがインターフェイス サーバーのプレフィックスであることを確認することです。そうしないと、同じことが繰り返されます。

ここでの意味は、リクエスト パスに /api が含まれている場合、davServer によって独自のパスを持つターゲット サーバーに転送されるということです。

その後、プロジェクトを再起動して開いて、データが正常に取得されているかどうかを確認します。