私はこれを見て、実行している問題がCordovaアプリの新しいセキュリティだと思っています。デフォルトでCordovaは外部リソースへの呼び出しをブロックします。すべてのBing Mapsサービスでは、次のドメインの1つを使用します。多くの場合、1つ以上のサブドメインがあります。
- ます。https://*.bing.com
- ます。https://*.virtualearth.net
HTTPも使用されるが、セキュリティ強化のためにhttpsを使用することができますすることができます。 https://cordova.apache.org/docs/en/4.0.0/guide/appdev/whitelist/index.html
Windows 10をターゲットにするときにこれらのドメインをホワイトリストに追加するには、Cordovaプロジェクトのconfig.xmlファイルを開き、塗りつぶしの上に表示されるこの行の後に次の2行を追加します行:
<access origin="*.bing.com" subdomains="true" />
<access origin="*.virtualearth.net" subdomains="true" />
ここでプロジェクトをビルドするとうまくいくかもしれません。また、あなたのアプリが対象とするWindowsのバージョンが10であることを確認していない場合。config.xmlファイルにターゲットバージョンのWindowsを指定するプリファレンスプロパティが存在する必要があります。それは、このような10.0に設定されていることを確認します
<preference name="windows-target-version" value="10.0" />
あなたは今、それが動作するはずのアプリを構築し、展開する場合。私は簡単なマップで私のWindows 10の電話でそれをテストし、それが働いた。
現時点では、Windows 10の電話機のタッチコントロールに関する既知のパフォーマンスの問題があります。お使いの携帯電話のブラウザでインタラクティブSDKを表示しても、これらを見ることができます。私たちのチームはこれらの作業に取り組んでおり、次の月に解決する予定です。
ヒント:Visual Studioを使用して、あなたのWindows Phoneに展開しようとすると、展開エラーが表示される場合、プロジェクトのビルド構成でのターゲットプラットフォームは、Windows Phoneの(ユニバーサル)に設定されていることを確認してください。
最初に私がこれを調べ始めたとき、ドメインをホワイトリストにするプロセスがターゲットデバイスによって異なることに気付きませんでした。その結果、私はAndroidでもこれを動作させる方法を理解しました。 Androidの場合、ホワイトリストはコンテンツセキュリティポリシーのメタタグによって行われます。デフォルトでは、コルドバは、このメタタグを使用しています。
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
私は当初、私はネットワークトレースでブロックされたファイルを参照するために継続することにより、前述のドメインに追加してみました。 Bing Mapsでは、地図コントロールのコードにアクセスするために単一のURLを指定するだけで済みますが、Bing Mapsコントロールはモジュール式のフレームワークを使用するため、読み込み速度が速いだけでなく、必要なことも意味しますインラインスクリプトタグを使用してオンザフライで多数の追加リソースをロードします。これにはメタタグで設定できるセキュリティ設定があります。心の中でこれらすべてのもの、私は次のようにセキュリティメタタグを変更して
:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' 'unsafe-inline' https://*.bing.com https://*.virtualearth.net; style-src 'self' 'unsafe-inline' https://*.bing.com https://*.virtualearth.net; media-src *">
これらの変更は現在JavaScriptとCSSファイルは、前述の二つのドメインからロードされ、また、これらのJavaScriptファイルを可能にすることができますインラインスクリプトを使用して追加のリソースをロードすることができます。
ここでは、Cordovaアプリケーションでフルスクリーンマップを提供するテストに使用した簡単なコードサンプルを示します。
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' 'unsafe-inline' https://*.bing.com https://*.virtualearth.net; style-src 'self' 'unsafe-inline' https://*.bing.com https://*.virtualearth.net; media-src *">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<script type='text/javascript' src='https://www.bing.com/api/maps/mapcontrol?callback=GetMap' async defer></script>
<script>
var map;
function GetMap() {
map = new Microsoft.Maps.Map('#myMap', {
credentials: 'Your Bing Maps Key'
});
}
</script>
<style>
body, html{
padding:0;
margin:0;
}
</style>
</head>
<body>
<div id="myMap"></div>
</body>
</html>
Windowsプラットフォームでは、私はまだ成功しませんでしたが、BingマップはWP8ターゲットで正常に表示されます。 – Ayra