無効なjavascriptファイルの自動ロード

ユーザーの場所に基づいてjavascriptファイルを自動ロードするスクリプトを作成しました。他のローダーと同様に、<script>要素を作成し、src属性を設定して<head>に追加します。次に、onloadとonreadystatechangedなどのイベントを聞き、ファイルによって公開されている値が存在するかどうかを確認します。これは機能します。無効なjavascriptファイルの自動ロード

無効なクロスオリジンURL "http://fail_on_purpose"が入力された場合、私のISPはHTMLを返します（別のアドレスでブラウザを再ロードするようブラウザに指示します）。私はonloadイベントでこれを捕まえることができますが、それは遅すぎます。 HTMLは既に<script>タグ内のページに挿入されています。これにより、ブラウザ（少なくともfirefox）はSyntaxError例外を発行します。

私ができることは、問題のある要素をDOMから削除することです。しかし、これが他のブラウザで問題を引き起こすかどうかはわかりませんので、エラーは一切ないようにしたいと思います。

有効なjavascriptファイルを確認してページに挿入する最も良い方法は何ですか？

更新：

HEADを発行するか、ファイルは/が有効で存在するかどうかを確認するための要求をGET、原因ブラウザで「クロスオリジン」の保護には動作しません。私はCDNにアクセスできないので、修正不可能な問題です。

出典

2016-09-01 Twifty

try-catchの中で '$ .get（）'を試しましたか？ –

@SumitSahay '$ .get（）'はjQueryです。質問は 'javascript'でタグ付けされています。また、AJAXリクエストからjavascriptを追加できるかどうかはわかりません。 – Twifty

できることは、有効なJSファイルをロードすることだけです。それ以外の場合は、まずAJAXを使用してその存在を確認できます。 –

あなたはHEAD要求を送信し、redirection、client errorまたはserver error応答コードで、すなわち、ページが正常に返すかどうかを確認するために応答ヘッダを解析しませんでした。適切に実装されたサーバーは、正しい応答コードを設定する必要があります。

application/javascriptが正しく設定されている場合は、content-typeにも含めてチェックするのが理想的です。

これが一致する場合は、スクリプトが存在することがわかっているので、今のようにスクリプトを読み込むことができます。

また、これらのヘッダーはすでにGETリクエストで取得されているため、すべてのリクエストを1回のリクエストで行うことができます。しかし、間違ったリクエストでは、間違っていると判断する前にすべてのペイロードを待つことになり、時間がかかりデータ転送が浪費されます。後者は、モバイルユーザーが期待している場合は、そのようなデータプランを浪費したくないと考える価値があります。

出典

2016-09-01 22:19:50

私はHEADを送信しようとしましたが、今度はfirefoxが "Cross-Origin Request Blocked"という文句を言っています。私はそれをGoogleの間にこれに任意の洞察力？ – Twifty

レスポンスには "Access-Control-Allow-Origin"ヘッダが必要です（理由：Content-Typeは "単純"のものではありません）。こちらをご覧ください：https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Simple_requests 開発者コンソールの[ネットワーク]タブで応答を調べ、設定されている応答ヘッダーを確認します。ご自分のサーバーからGoogle JavaScriptファイルを提供できますか？（これがGoogleによって許可されているかどうかわからない場合） – mh8020

Google CORSの詳細については、こちらをご覧ください。基本的に、サーバーはあなたのドメインからフェッチすることができない応答を返しています。これは一般的な設定で、ウェブサイトが他の、おそらく悪質な原点（サーバー）からコンテンツを読み込むのを防ぎます。サーバーにアクセスできる場合は、応答するヘッダーを変更することができます。そうしないと、唯一の解決策は、プロキシサーバーを介してデータを取得することですが、正しく設定しないと悪用される可能性があります。 googlingした後、そのためのサービスがあります：https://crossorigin.me/ –

Sumitが示唆しているように、Ajaxリクエストを介してスクリプトを読み込んで、何らかの形でそれをチェックすることができます（たとえば、特定の文字列が含まれていることがわかっているため）。

成功したら、「src」属性が設定されたhead要素またはbody要素に<script>タグを追加します。 URLに対してキャッシングが有効になっている場合、ブラウザは別のHTTPリクエストを行いません。

「src」属性の代わりにscriptElem.textを設定することによって、AjaxをロードしたJSコードを直接使用することは、別のオプションですが、CORS制限の対象であるため、良い方法ではありません。 jQueryのDOMEval関数のhttps://code.jquery.com/jquery-3.1.0.js（行77）を参照してください。

Googleサーバーからコードをロードしたいので、「src」属性の方が優れています。

出典

2016-09-01 22:21:05 mh8020

無効なjavascriptファイルの自動ロード

答えて

関連する問題