Формат OpenLayers JSON Возвращает пустой ответText String

Question

После недели публикации на форуме OpenLayers и не получения ответов на мои вопросы, я решил посмотреть здесь. У меня есть Googled, Googled и Googled, и даже нашел замечательный учебник по этой теме на испанском языке, но так хорошо написано, что Google translate смог полностью перевести его.

gisandchips.org/2010/05/04/openlayers-y-panoramio/

Так я следовал этому уроку, и теперь я пытаюсь получить доступ к API данных Panoramio для запроса фотографии и отображать их на моей карте , Однако мой код не работает на линии:

var panoramio = json.read (response.responseText);

Согласно поджигатель и оповещения (response.responseText), моя responseText пустая строка ...

В поджигатель У меня есть GET URL http://localhost/cgi-bin/proxy.cgi?url=http%3A%2F%2Fwww.panoramio.com%2Fmap%2Fget_panoramas.php%3Forder%3Dpopularity%26set%3Dfull%26from%3D0%26to%3D40%26minx%3D-20037508.3392%26miny%3D-20037508.3392%26maxx%3D20037508.3392%26maxy%3D20037508.3392%26size%3Dthumbnail

это показывает мне правильный JSON. И я знаю, что мой объект ответа не является нулевым, потому что alert (response) показывает, что он получает [объект XMLHttpRequest]

Честно говоря, у меня нет идей. Прежде чем пытаться разобрать JSON, я пытался разобрать XML и не имел никакой удачи. Мне очень нравится идея поднять данные RSS и API на мою карту. Ниже я прилагаю мой код, я признателен за любую обратную связь вы можете предложить :)

Спасибо,

elshae

var map, popup, selectControl, selectedFeature; 
var vectorLayer, panoramio_style; 

Ext.onReady(function() { 
    var options = { 
     controls: [new OpenLayers.Control.Navigation()], //Needed to use GeoExt controls such as the zoomslider 
     maxExtent: new OpenLayers.Bounds(-20037508.34, -20037508.34, 20037508.34, 20037508.34), 
     units: 'm', 
     allOverlays: false 
    } 

    this.map = new OpenLayers.Map(options); 

    var ghyb = new OpenLayers.Layer.Google(
      "Google Hybrid", 
      {type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20} 
    ); 

    var gmap = new OpenLayers.Layer.Google(
      "Google Streets", // the default 
      {type: google.maps.MapTypeId.ROADMAP, numZoomLevels: 20} 
    ); 

    var gphy = new OpenLayers.Layer.Google(
      "Google Physical", 
      {type: google.maps.MapTypeId.TERRAIN, numZoomLevels: 20} 
      // used to be {type: G_PHYSICAL_MAP} 
    ); 

    var osm = new OpenLayers.Layer.OSM(); 

    map.addLayers([osm, gphy, gmap, ghyb]); 

    OpenLayers.ProxyHost = "http://localhost/cgi-bin/proxy.cgi?url="; 

    var mapPanel = new GeoExt.MapPanel({ 
     title: "Map", 
     map: this.map, 
     center: new OpenLayers.LonLat(93.9, 29.53).transform(new OpenLayers.Projection("EPSG:4326"), 
       new OpenLayers.Projection("EPSG:900913")), 
     zoom: 2, 
     region: "center" 
    }); 

    //Obtain Bbox coords 
    var proj = new OpenLayers.Projection("EPSG:900913"); 
    var ext = mapPanel.map.getMaxExtent().transform(mapPanel.map.getProjectionObject(), proj); 
    var minx = ext.left; 
    var miny = ext.bottom; 
    var maxx = ext.right; 
    var maxy = ext.top; 
    alert(minx + " " + miny + " " + maxx + " " + maxy); 

    url = "http://www.panoramio.com/map/get_panoramas.php"; 
    var parameters = { 
     order: 'popularity', 
     set: 'full', 
     from: 0, 
     to: 40, 
     minx: minx, 
     miny: miny, 
     maxx: maxx, 
     maxy: maxy, 
     size: 'thumbnail' 
    } 

    new Ext.Panel({ 
     width: 1800, 
     height: 600, 
     layout: "border", 
     renderTo: document.body, 
     items: [mapPanel] 
    }); 

    OpenLayers.loadURL(url, parameters, this, showPhotos); 
    //alert(OpenLayers.Request.XMLHttpRequest); 

}); 

function showPhotos(response) { 

    var json = new OpenLayers.Format.JSON(); 
    var panoramio = json.read(response.responseText); //Something is wrong here!!! 
    var features = new Array(panoramio.photos.length); 
    for (var i = 0; i < panoramio.photos.length; i++) { 
     var upload_date = panoramio.photos[i].upload_date; 
     var owner_name = panoramio.photos[i].owner_name; 
     var photo_id = panoramio.photos[i].photo_id; 
     var longitude = panoramio.photos[i].longitude; 
     var latitude = panoramio.photos[i].latitude; 
     var pheight = panoramio.photos[i].height; 
     var pwidth = panoramio.photos[i].width; 
     var photo_title = panoramio.photos[i].photo_title; 
     var owner_url = panoramio.photos[i].owner_url; 
     var owner_id = panoramio.photos[i].owner_id; 
     var photo_file_url = panoramio.photos[i].photo_file_url; 
     var photo_url = panoramio.photos[i].photo_url; 

     var fpoint = new OpenLayers.Geometry.Point(longitude, latitude); 

     var attributes = { 
      'upload_date': upload_date, 
      'owner_name': owner_name, 
      'photo_id': photo_id, 
      'longitude': longitude, 
      'latitude': latitude, 
      'pheight': pheight, 
      'pwidth': pwidth, 
      'pheight': pheight, 
      'photo_title': photo_title, 
      'owner_url': owner_url, 
      'owner_id': owner_id, 
      'photo_file_url': photo_file_url, 
      'photo_url': photo_url 
     } 

     features[i] = new OpenLayers.Feature.Vector(fpoint, attributes); 

    }//Outside for loop 

    panoramio_style = new OpenLayers.StyleMap(OpenLayers.Util.applyDefaults({ 
     pointRadius: 7, 
     fillColor: "red", 
     fillOpacity: 1, 
     strokeColor: "black", 
     externalGraphic: "panoramio-marker.png" 
    }, OpenLayers.Feature.Vector.style["default"])); 

    vectorLayer = new OpenLayers.Layer.Vector("Panoramio Photos", { 
     styleMap: panoramio_style 
    }); 

    vectorLayer.addFeatures(features); 

    this.map.addLayer(vectorLayer); 

    selectControl = new OpenLayers.Control.SelectFeature(vectorLayer, 
      {onSelect: onFeatureSelect, onUnselect: onFeatureUnselect}); 
    this.map.addControl(selectControl); 
    selectControl.activate(); 
}//End showPhotos 

// popups 
function onPopupClose(evt) { 
    selectControl.unselect(selectedFeature); 
} 

function onFeatureSelect(feature) { 
    selectedFeature = feature; 

    // HTML del PopUp 
    var html = "some HTML I have here"; 

    popup = new OpenLayers.Popup.FramedCloud("chicken", 
      feature.geometry.getBounds().getCenterLonLat(), 
      null, 
      html, 
      null, 
      true, 
      onPopupClose); 

    feature.popup = popup; 
    this.map.addPopup(popup); 
} 

function onFeatureUnselect(feature) { 
    this.map.removePopup(feature.popup); 
    feature.popup.destroy(); 
    feature.popup = null; 
} 

Answer 1

Похоже, вы врезались в Same Origin Policy. Вы не можете делать запросы Ajax для хостов вне вашего домена, если вы не используете JSONP или какую-либо другую технику, чтобы обойти эту политику. Ваш запрос к www.panoramio.com является проблемой, так как я не думаю, что вы размещены на www.panoramio.com :)

Возможно, вы захотите проверить, предлагает ли панорама услугу JSONP. В противном случае вы можете проверить следующее переполнение стеки поста в течение нескольких популярных решений для работы вокруг Same Origin Policy (главным образом JSONP, CORS и обратные метод прокси):

• Ways to circumvent the same-origin policy

и порожние responseText характерно для большинства браузеров, когда они блокируют ответ от сторонних доменов:

• Empty responseText from XMLHttpRequest