JavaScript-Versprechen nicht ausgeführt. Then()

Question

Ich hatte ein Problem mit Promise in JavaScript. Was ich versuche zu tun ist, ich habe eine Liste der Adresse, dann für jede Adresse muss ich die Geocode-API aufrufen, um die lat lng zu bekommen, dann werde ich fortfahren, die Marker zusammen mit der Heatmap zu plotten. Hier ist mein Code:

let promiseKey = Promise.all(
      result.map() 
     ); 

     var addedMarkers = promiseKey.then(
     markers => Promise.all(
      markers.map() 
     ) 
     ) 
     .then(drawForecastHeatmap); 

Der Teil, wo ich die geocode API-Aufruf:

function getBranchLatLng(address, branchName, total, queKey){ 
return new Promise(function(resolve){ 
    var key = jQuery.rand(geoCodKeys); 
    var url = 'https://maps.googleapis.com/maps/api/geocode/json?key='+key+'&address='+address+'&sensor=false'; 

    $.ajaxq (qyName, { 
     url: url, 
     dataType: 'json' 
    }).done(function(data) { 
     var address = getParameterByName('address', this.url); 
     var index = errorArray.indexOf(address); 
     try{ 
      var p = data.results[0].geometry.location; 
      var latlng = new google.maps.LatLng(p.lat, p.lng); 

      var markerItem = 
       { 
        'lat': p.lat, 
        'lng': p.lng, 
        'address': address, 
        'branchName': branchName, 
        'total': total, 
       }; 
      console.log(markerItem); 
      resolve(markerItem); 

      if (index > -1) { 
       errorArray.splice(index, 1); 
      } 
     }catch(e){ 
      if(data.status = 'ZERO_RESULTS') 
       return false; 

      //on error call add marker function for same address and keep in Error ajax queue 
      getBranchLatLng(address, 'Error'); 
      if (index == -1) { 
       errorArray.push(address); 
      } 
     } 
    }); 

    //mentain ajax queue set 
    queuCounter++; 
    if(queuCounter == setLimit){ 
     queuCounter = 0; 
    } 

}); 
} 

Das Problem ist jetzt, das Programm nur bei getBranchLatLng gestoppt() und nicht einmal gehen in die addForecastMarker() obwohl ich es geschafft habe, etwas vom Geocode auszudrucken. Einige der Adresse

mich Rückkehr:

jquery.min.js:4 GET https://maps.googleapis.com/maps/api/geocode/json?key=&address= 400() 

Dann, wenn ich versuche, die Verbindung zu verlängern, erhalte ich diese:

error_message: "Invalid request. Missing the 'address', 'bounds', 'components', 'latlng' or 'place_id' parameter." 
results :[] 
status: "INVALID_REQUEST" 

Irgendwelche Ideen auf, wie man diese Adresse mit ‚INVALID_REQUEST lösen zurück zum Promise-Elternteil?

Danke!

Answer 1

Es ist nicht möglich, den Arbeitscode zu generieren, ohne dass alle Testdaten und nicht deklarierten Variablen in Ihrem Code verwendet werden. Aber insgesamt kann ich vorschlagen, dass Sie einen catch Block der Ajax-Anfrage hinzufügen müssen, und denken Sie daran, dass es keinen Workflow in Ihrem getBranchLatLng Promise gibt, der nicht resolving oder rejecting das Versprechen ist.

Unter der Annahme, dass, Incase Fehler, Sie immer noch Ihre getBranchLatLng lösen wollen, ich habe Ihren Code wie folgt aktualisiert, so dass es keine Workflow in Ihrem getBranchLatLng Versprechen sind, dass wird nicht resolve oder reject

let promiseKey = Promise.all(
      result.map(el=>getBranchLatLng(el.branchAddress, el.branchName, el.amount)) 
     ); 

     var addedMarkers = promiseKey.then(
     markers => Promise.all(
      markers.map(marker => addForecastMarker(marker)) 
     ) 
     ) 
     .then(drawForecastHeatmap) 
     .catch(functon(e) { 
      //Do the error handling here 
     }); 

function getBranchLatLng(address, branchName, total, queKey) { 
return new Promise(function(resolve, reject) { 
    var key = jQuery.rand(geoCodKeys); 
    var url = 'https://maps.googleapis.com/maps/api/geocode/json?key='+key+'&address='+address+'&sensor=false'; 

    var qyName = ''; 
    if(queKey) { 
     qyName = queKey; 
    } else { 
     qyName = 'MyQueue'+queuCounter; 
    } 

    $.ajaxq (qyName, { 
     url: url, 
     dataType: 'json' 
    }).done(function(data) { 
     var address = getParameterByName('address', this.url); 
     var index = errorArray.indexOf(address); 
     try{ 
      var p = data.results[0].geometry.location; 
      var latlng = new google.maps.LatLng(p.lat, p.lng); 

      var markerItem = 
       { 
        'lat': p.lat, 
        'lng': p.lng, 
        'address': address, 
        'branchName': branchName, 
        'total': total, 
       }; 
      console.log(markerItem); 
      if (index > -1) { 
       errorArray.splice(index, 1); 
      } 
      resolve(markerItem); 

     }catch(e) { 
       if (index == -1) { 
       errorArray.push(address); 
      } 
       resolve({type: 'error', status: data.status}); 

     } 
    }) 
    .catch(function(e) { 
     resolve({type: 'error', status: data.status}); 
     //Instead of resolving with error code you can also reject the promise 
     //reject(e); 
    }); 

    //mentain ajax queue set 
    queuCounter++; 
    if(queuCounter == setLimit){ 
     queuCounter = 0; 
    } 

    } 
)}; 

function addForecastMarker(marker) { 
console.log('adddddd markerssssss'); 
} 

Dies ist jedoch nicht der Code von Boilerplate, mit dem Sie direkt zum Endergebnis gelangen. Sie müssen den Fehlerbehandlungscode hinzufügen, wenn das Versprechen fehlschlägt. Für Ihre Hilfe habe ich diese Versprechen mit type: 'error' gelöst. Innerhalb des dann Blocks von promiseKey müssen Sie diese lesen und weitere Fehlerbehandlung durchführen und diese aus dem Array entfernen, bevor Sie addForecastMarker darüber aufrufen.

Hoffe, dass es hilft.