傳單地圖網址被禁止

我正在嘗試創建一個jQuery手機應用程序，並且我想使用嵌入在其中的傳單地圖。我現在正在做一個非常基本的概念驗證，但我沒有太多的運氣。每次我嘗試加載地圖時，地圖的.png都不加載，控制檯告訴我它的禁止。我想我可能會設置錯誤的地圖URL，但CloudMade網站上的文檔有點模糊。任何幫助，你可以提供將不勝感激。傳單地圖網址被禁止

代碼：

var map = new L.Map('map'); 

var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/MY_APP_KEY/997/256/{z}/{x}/{y}.png', 
    cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18}); 
map.addLayer(cloudmade); 

map.locateAndSetView(16); 

map.on('locationfound', onLocationFound); 

function onLocationFound(e) { 
    var radius = e.accuracy/2; 

    var marker = new L.Marker(e.latlng); 
    map.addLayer(marker); 
    marker.bindPopup("You are within " + radius + " meters from this point").openPopup(); 

    var circle = new L.Circle(e.latlng, radius); 
    map.addLayer(circle); 
} 

map.on('locationerror', onLocationError); 

function onLocationError(e) { 
    alert(e.message); 
}

當我嘗試加載圖像，我得到以下錯誤：GET http://a.tile.cloudmade.com/MY_APP_KEY/997/256/0/0/0.png 403（禁止）。很明顯，我用我從CloudMade獲得的密鑰替換了MY_APP_KEY，但除此之外，我不確定還有哪些地方可以轉身。

在此先感謝您的幫助。

來源

2012-07-17 RaceOnApp

看起來地理定位方法不起作用，因此它會嘗試加載圖像0,0,0，因爲您尚未定義任何座標。

你可以嘗試設置一些默認選項（即）在您的頂線，像這樣：

var options ={ 
    center: new L.LatLng(37.7, -122.2), 
    zoom: 10 
}; 

var map = new L.Map('map', options);

這至少應該默認地圖舊金山這樣你就可以判斷瓷磚是否加載正確。

的jsfiddle：http://jsfiddle.net/peBZp/

這可能是小葉具有與地理定位和PhoneGap的一個問題。您可以嘗試按照以下文檔：http://docs.phonegap.com/en/1.0.0/phonegap_geolocation_geolocation.md.html，只需使用該函數返回的lat/long設置選項變量，而不是使用傳單的內置方法。

希望有所幫助。

來源

2012-07-18 15:33:12 ScottB

只是做了一個快速複製和粘貼（字面瞥了一眼這個代碼）和SF的地圖顯得很好。 – hellatan 2013-07-25 12:45:12

提供Cloudmade API密鑰是強制性的，但不夠。您還必須提供您必須爲每個用戶和設備請求的令牌。

POST http://auth.cloudmade.com/token/APIKEY?userid=UserID&deviceid=DeviceID

這會給你，你必須附加到瓷磚網址cloudmade服務器上進行身份驗證令牌：

var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/MY_APP_KEY/997/256/{z}/{x}/{y}.png?token=TOKEN'

對於作爲Cloudmade Authorization API doc描述的令牌可以通過一個簡單的POST檢索概念的快速證明不過，你可以直接使用their own API key這並不需要身份驗證令牌：

var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/997/256/{z}/{x}/{y].png

來源

2013-11-30 04:51:31

我遇到了同樣的問題，你的答案有所幫助。我製作了一次性的POST請求，獲得了令牌，並將其硬編碼到我的應用程序中（www.twincitiesbikemap.com）。但是，我怎樣才能做到這一點與jQuery？由於Access-Control-Allow-Origin（儘管我將頁面設置爲*），因此我無法獲得$ .post的工作權限，並且我無法使用jsonp，因爲它需要成爲POST。這可以通過javascript/jQuery完成嗎？ – Ehryk 2014-03-10 08:46:09

我認爲你不應該在客戶端檢索令牌。您應該從您自己的服務器（使用PHP或任何您喜歡的語言）發出POST請求，然後將令牌傳遞給您的客戶端應用程序。順便說一下，擁有不同的令牌只有在您想監視不同用戶或設備的API使用情況時纔有用。如果你不需要（例如，當你的用戶是匿名的），硬編碼令牌就好了。 – 2014-03-10 13:33:20

我使用的是ASP.NET託管，但僅用於提供網頁 - 它們只是靜態的.html文件。由於我不是'正式'使用任何服務器端代碼，除了使用IIS作爲Web服務器之外，我不得不寫一些只是爲了發佈請求。有沒有辦法做到客戶端，儘管它可能不應該這樣做？ – Ehryk 2014-03-10 17:34:34

傳單地圖網址被禁止

回答

相關問題