web-dev-qa-db-ja.com

Googleマップがhttps：//で機能しない

私はhttpでグーグルマップを使用しています、それは完全にうまく機能しています。しかし、同じ上にssl証明書をインストールすると、機能しなくなりました。それは私にエラーを与えています

混合コンテンツ：「 https：// url 」のページはHTTPS経由で読み込まれましたが、安全でないスクリプトを要求しました ' http：//google-maps-utility-library-v3.googlecode .com/svn/trunk/markerclusterer/src/markerclusterer.js？_ = 1 *************** '。このリクエストはブロックされました。コンテンツはHTTPS経由で提供する必要があります。

google-mapssslgoogle-maps-api-3httpsmarkerclusterer
7
dbuser dbuser

更新：2016年5月12日、Googleはこのライブラリのgoogle-maps-utility-library-v3.googlecode.comソースを廃止しました。ただし、 GoogleがソースをGitHubにしばらく前に移動したため 、この投稿の最後に記載されているGitHubの詳細、特にスクリプトとリソースを直接に含めることに関する最後の注意事項を考慮してください。プロジェクト

スクリプトインクルードURLを次の場所から変更することに加えて：

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js

に：

https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/src/markerclusterer.js

次の行に沿ってMarkerClustererをインスタンス化するときは、imagePathオプションも指定する必要があります。

var mc = new MarkerClusterer(map, markers, { 
    imagePath: 'https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m' 
});

これにより、強調表示したスクリプトエラーと同じ理由をカバーする次の警告が回避されます。

混合コンテンツ：「 https：// url 」のページはHTTPS経由で読み込まれましたが、安全でない画像をリクエストしました ' http：//google-maps-utility-library-v3.googlecode .com/svn/trunk/markerclusterer/images/m1.png '。このコンテンツもHTTPS経由で提供する必要があります。

これが発生する理由は、デフォルトで、MarkerClustererライブラリがクラスターイメージ（m1.png、m2.pngなど）のルートとして次の非https設定を使用するためです。

MarkerClusterer.prototype.MARKER_CLUSTER_IMAGE_PATH_ =
    'http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/' +
    'images/m'

しばらく前にこの問題が発生しましたが、ライブラリのGitHubリポジトリで次のプルリクエストに応答して対処されたようです。

画像リンクでHTTPをHTTPSに変更

この GitHubバージョン には、次のスクリプトURLを使用して RawGit からアクセスできます。

https://cdn.rawgit.com/googlemaps/js-marker-clusterer/gh-pages/src/markerclusterer.js

次のimagePathを使用してGitHubイメージにアクセスできます。

var mc = new MarkerClusterer(map, markers, { 
    imagePath: 'https://cdn.rawgit.com/googlemaps/js-marker-clusterer/gh-pages/images/m' 
});

上記のURL（cdnプレフィックス付き）には トラフィック制限やスロットリングはなく、ファイルは超高速のグローバルCDNを介して提供されます ですが、 RawGitは無料のホスティングサービスです）稼働時間やサポートの保証はありません 。

これについては、次のSO回答：

GitHubでホストされている外部JavaScriptファイルをリンクして実行します

この投稿では、GitHub上のファイルにリンクしている場合、本番環境では、特定のリリースタグをターゲットにして、スクリプトの目的のリリースバージョンを確実に取得することを検討する必要があることも説明しています。

ただし、js-marker-clustererリポジトリの管理者はまだリリースを作成していないため、現在これは不可能です。

結果として、ライブラリとそのリソースをダウンロードして、本番目的でプロジェクトに直接含めることを真剣に検討する必要があります。

12
Chris Cook

Httpsを介してWebサイトにアクセスする場合、Webサイトが提供するすべてのコンテンツもhttpsからのものである必要があります。これには、画像、スタイルシート、JSスクリプトが含まれます。 URLでhttpをhttpsに変更するだけです。

3
Bartosz Zasada

今日、マーカークラスターライブラリでこの問題に直面したため、jsソースファイルから手動でimagesディレクトリを更新する必要がありました。markercluster.jsを開きます。

と交換：

https://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer

Githubのディレクトリで：

https://googlemaps.github.io/js-marker-clusterer

そして、あなたは大丈夫なはずです。

2
Mohanad Kaleia

GoogleマップのスクリプトインクルードURLを確認し、URLからhttpプロトコルを削除します。

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/mar...

となります

//google-maps-utility-library-v3.googlecode.com/svn/trunk/mar...

このようにして、スクリプトは正しいプロトコル（httpまたはあなたの場合はhttps）を使用して提供されます

1
Luigi Pressello

Google http：//をhttps：//に変更するだけです

http://maps.google.com/ から https://maps.google.com/

0
Merle_the_Pearl

次のメタを頭に追加します

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

私の問題を解決しました。

0
Mahendra Pratap