web-dev-qa-db-ja.com

http://リンクをすべて//に変更できますか?

Dave Ward 言う、

正確な読み取りではありませんが、 RFC 3986のセクション4.2 は、プロトコル(HTTPまたはHTTPS)を完全に省略する完全修飾URLを提供します。 URLのプロトコルが省略されている場合、ブラウザは代わりに基になるドキュメントのプロトコルを使用します。

簡単に言うと、これらの「プロトコルレス」URLを使用すると、試してみるすべてのブラウザーでこのような参照が機能します。

//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js

最初は奇妙に見えますが、この「プロトコルレス」URLは、HTTPとHTTPSの両方で利用可能なサードパーティのコンテンツを参照する最良の方法です。

これにより、HTTPページで見られる混合コンテンツエラーの多くを確実に解決できます。つまり、アセットがHTTPとHTTPSの両方で利用可能であると仮定しています。

これは完全にクロスブラウザー互換ですか?他に注意事項はありますか?

237
a paid nerd

公開する前に徹底的にテストしました。 Browsershots でテストできるすべてのブラウザの中で、プロトコル相対URLを正しく処理しなかったブラウザ、つまり Dillo と呼ばれる不明瞭な* nixブラウザしか見つかりませんでした。

フィードバックを受けた2つの欠点があります。

  1. ページの基本プロトコルはfile:///であるため、ブラウザーでローカルファイルを「開く」とき、プロトコルなしのURLは期待どおりに動作しない場合があります。特に、CDNがホストするアセットのような外部リソースにプロトコルなしのURLを使用している場合。ただし、ApacheやIISなどのローカルWebサーバーを使用して http:// localhost アドレスに対してテストすることは問題ありません。
  2. プロトコルなしのURLを正しく処理しないiPhoneフィードリーダーアプリが少なくとも1つあるようです。どちらに問題があるのか​​、それがどれほど人気が​​あるのか​​は知りません。 JavaScriptファイルをホストする場合、RSSリーダーは通常JavaScriptコンテンツを無視するため、これは大きな問題ではありません。ただし、RSSで配信する必要があるコンテンツ内の画像などのメディアにこれらのURLを使用している場合、問題になる可能性があります(ただし、単一プラットフォーム上のこの単一リーダーアプリは、おそらく非常に少数のリーダーを占めています)。
201
Dave Ward

1つshouldがすべてのリンクをプロトコル相対に変更できるかどうかの質問は、1つshouldそうする。 Paul Irish によると:

2014.12.17:すべての人にSSLが推奨され、パフォーマンスへの懸念がないため、この手法はアンチパターンになりました。必要なアセットがSSLで利用可能な場合、alwayshttps://資産。

37
Ohad Schneider

プロトコルレスURLを使用してスタイルシートをロードする場合、IE 7および8はそれらを2回ダウンロードします。 http://www.stevesouders.com/blog/2010/02/10/5a- missing-schema-double-download /

したがって、良いパフォーマンスが必要な場合は、CSSでこれを避ける必要があります。

30
Tim Beadle

はい、ネットワークパス参照はすでに RFC 1808 で指定されており、すべてのブラウザで動作するはずです。

15
Gumbo

これは完全にクロスブラウザー互換ですか?他に注意事項はありますか?

ローカルサーバーで開発している場合は、これを混在させるだけで機能しない可能性があります。スキームを指定する必要があります。指定しない場合、ブラウザーはsrc="//cdn.example.com/js_file.js"src="file://cdn.example.com/js_file.js"であると想定する場合があります。

Microsoft Internet Explorerはこれに特に敏感なようです。次の質問を参照してください。 localhost(WAMP)上のInternet ExplorerでjQueryをロードできません

おそらく、必要な変更を最小限に抑えて、すべての環境で機能するソリューションを常に見つけようとするでしょう。

HTML5Boilerplate で使用される解決策は、リソースが正しくロードされない場合にフォールバックすることですが、これはチェックを組み込む場合にのみ機能します:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- If jQuery is not defined, something went wrong and we'll load the local file -->
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>

この回答を投稿しました here も同様です。

更新: HTML5Boilerplate は、プロトコル相対URLの廃止を決定した後、<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">を使用するようになりました。 here を参照してください。

4
bg17aw

://domain.comを使用するときにこれらの問題は発生していませんが、最初にコロンを追加する必要があります。ヨーストはしばらく前にこれについて良い記事を書いていました。しかし、彼のブログ記事の山では失われています。

1
user1431784