「ローカル テスト プロジェクト構成ドメイン名の小さな操作」
な
関連記事 [公式アカウント「ずっと 東へ」にご注目を！
CORS クロスドメインの問題構成ホワイトリスト CORS_ORIGIN_WHITELIST
ホスト
ローカルのテスト ドメイン名を変更する必要があります。たとえば、C:/Windows/System32/driver/etc/host ファイルです (中間のスペースに注意してください)。
| 127.0.0.1 www.haha.com |
フロント エンドとバック エンドが分離されている場合、多くの場合、次の 2 つのことが必要になります。
| 127.0.0.1 www.haha.com # フロントページ |
| 127.0.0.1 www.api.com # バックエンド |
CORSクロスドメイン処理なら、djangoのクロスドメイン処理だと仮定し、フロントエンドポートを8080、バックエンドポートを8000と仮定すると、今回の簡単な設定は:
# 允许哪些域名访问Django ALLOWED_HOSTS = ['127.0.0.1', 'Localhost', 'www.haha.com', 'www.api.com'] # CORS追加白名单（显然针对的是前端域名）（后端可能自己识别不到自己吗？）CORS_ORIGIN_WHITELIST = ('http://127.0.0.1:8080','http://localhost:8080','http://www.haha.com:8080','http://www.api.com:8000',)
[詳細] バックエンド ドメイン名をここに含めるのはなぜですか? 明らかに、このドメイン名を使用して後で 127.0.0.1:8000 にアクセスすると、クロスドメインとして認識されるため、ホワイトリストにも追加する必要があります。
フロントエンド
フロントエンド処理の方が簡単です. 一般的には、host.js ファイルを使用してホスト ドメイン名を一元管理し、後で変更することも容易です. 次に、それを js ファイルで直接使用し、html ファイルに直接インポートします。
例として 01 を取り上げます。
// host.jsvar host = 'http://www.haha.com:8080'
{# xxx.html #}<script type="text/javascript" src="js/hosts.js"></script>
js ファイルの axios の使用法を例にとると、通常、ホスト変数 host:host を導入する必要があります。
// xxx.js/*axios.get('http://127.0.0.1:8000' + '/', {responseType: 'json'}). then (...)*/axios.get(this.host + '/', {responseType: 'json'}). then (...)
