ローカル (ファイル プロトコル) AJAX リクエストをサポートするように Chrome を構成する (グラフィック チュートリアル)

この記事では主に、ローカル (ファイル プロトコル) AJAX リクエストをサポートするように Chrome を設定する方法を詳しく紹介します。興味のある方は、

何が問題なのか

WEB 開発プロセスを参照してください。完全なプロジェクトを開発する代わりに、いくつかの簡単なデモを作成します。 現時点での一般的な操作は次のとおりです:

• 新しいフォルダーを作成します
• 必要なファイルを作成します
• Sublime (または他のエディター) でデモのコーディングを完了します
•HTML ファイルをダブルクリックして、ブラウザでデモを直接実行します

この時点でデモに AJAX 操作がある場合、ブラウザはエラーを報告します:

XMLHttpRequest は読み込めません file:// /Users/iceStone/Documents/Learning/angular/demo/angular-moviecat/movie/view.html クロスオリジンリクエストは、http、data、chrome、chrome-extension、https、chrome-extension のプロトコル スキームでのみサポートされます。理由は非常に単純です。ブラウザ (Webkit カーネル) のセキュリティ ポリシーにより、ファイル プロトコルによってアクセスされるアプリケーションは XMLHttpRequest オブジェクトを使用できないと判断されます。また、エラー メッセージには次のように明確に示されています。リクエストはプロトコル スキームでのみサポートされています: http、data、chrome、chrome-extension、https、chrome-extension-resource resource

解決策

私の個人的なお気に入りの Chrome は強力で、言うことはありませんが、想像できてほとんど不可能であるため、サポートも必要です:

Windows:

• Chrome のショートカット プロパティを設定し、「target」の後に --allow-file-access-from-files を追加します。前にスペースがあることに注意して、Chrome を再度開きます。

Mac: •ブラウザはターミナルからのみ開くことができます: ターミナルを開いて次のコマンドを入力します: open -a “Google Chrome” –args –disable-web-security その後、ブロックできますsecure access [ –args: このパラメータはオプションです]

長期的には、必ず HTTP 経由でアプリケーションにアクセスする必要があるため、HTTP サーバー ソフトウェアを構成する必要があります。ただし、始めたばかりの一部の学生にとって、HTTP サーバー (Apache、IIS など) のセットアップは面倒で法外な作業です。

•IDE を使用する学生に言うことはありません。Web 開発に使用されるすべての IDE には http サーバーが組み込まれているため、個別に設定する必要はありません。
•Sublime Text などの軽量エディターを好む学生には、デフォルトで HTTP サーバーが組み込まれていません

次に、Sublime プラグインをお勧めします。 Sublime Server は静的ファイルを提供します。 HTTP サーバーの具体的な使用方法は次のとおりです:

•Command+Shift+P または Ctrl+Shift+P でコマンドを開きます。パネルで、「パッケージ コントロール: パッケージのインストール」と入力します
• しばらく待ちます。しばらくしてから (プラグイン プロバイダーのサーバーに接続します。比較的遅く、壁の後ろにある可能性があります)、SublimeServer を検索します

•必ずフォルダーを開いてSublimeを使用してください。そうしないと、SublimeServerを正常に使用する方法がありません。
•HTML ファイルを開き、右クリック メニューで [SublimeServer で表示] を選択します。この時点で、HTTP 経由でファイルにアクセスできます。
•このオプションが灰色の場合は、SublimeServer ツールが起動されていないことを意味します。 → SublimeServer → SublimeServer を起動

この時点で、すでに Sublime で HTTP サーバーを使用できるようになります。

考えられる問題


「Start SublimeServer」をクリックできない場合は、現在のポート 8080 が占有されている可能性があります (SublimeServer はデフォルトでポート 8080 を使用します)

は、設定ファイルを開いてポートを変更することです別のポートに:

{
  "attempts": 5,
  "autorun": false, // 是否在启动Sublime时自动启动SublimeServer
  "defaultExtension": ".html",
  "interval": 500,
  "mimetypes":
  {
    "": "application/octet-stream",
    ".c": "text/plain",
    ".h": "text/plain",
    ".py": "text/plain"
  },
  "port": 2016 // 端口号
}

もちろん、他のエディタにも同様のプラグインがあります。

関連記事:

Ajax 実装リスト 無限ロードおよび 2 番目のドロップダウン オプションの効果

以上がローカル (ファイル プロトコル) AJAX リクエストをサポートするように Chrome を構成する (グラフィック チュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。