ol.source.OSMの属性 'url'の使用方法

Question

ローカルのopenstreetmapタイルサーバーを配備し、openlayers3を使用してマップを表示するのに何度も試みましたが、残念なことに失敗しました。 ここに私の実験場面があります。 タイルサーバーをポート80に配備し、http://127.0.0.1:80/osm_tiles/ {z}/{x}/{y} .pngで正しく画像を取得します。また、ポート8099にdjango webを置くと、http://127.0.0.1:8099/my/pageでWebページにアクセスできます。テンプレートページでは、私はこの

var layer = new ol.layer.Tile({ 
 
     source: new ol.source.OSM({ 
 
      attributions: [ 
 
       ol.source.OSM.ATTRIBUTION 
 
      ], 
 
      url:'//127.0.0.1:80/osm_tiles2/{z}/{x}/{y}.png'    
 
     }) 
 
    }); 
 

 
var map= new ol.Map({ 
 
     target : 'map_canvas', 
 
     loadTilesWhileAnimating: true, 
 
     view: new ol.View({ 
 
      center:ol.proj.transform([116.391625,39.906813], 'EPSG:4326', 'EPSG:3857'), 
 
      zoom : 12 
 
     }), 
 
     layers:[layer] 
 
    });

のように書いたmap_canvasは何も示していないが、私はfirebug.WHYタイルサーバーから画像を得ることができますか？ 私に助けてください、多くの感謝！そのように、ソースにcrossOrigin: nullを追加

Answer 1

試してみてください。

var layer = new ol.layer.Tile({ 
    source: new ol.source.OSM({ 
     attributions: [ 
      ol.source.OSM.ATTRIBUTION 
     ], 
     url:'//127.0.0.1:80/osm_tiles2/{z}/{x}/{y}.png', 
     crossOrigin: null    
    }) 
});