Question

我一直在努力开发一些在javascript中使用异步函数的代码。这些代码在Mozilla中运行良好，但Chrome console.log没有显示任何内容......并且没有记录任何错误。

代码处理图像对象数组，并使用EXIF-js库中的异步函数从数组中的地理标记图像中检索GPS坐标。所有代码都可以正常工作。

使用回调我能够在Mozilla中调试位置坐标，但是当我在Chrome中运行相同的代码时，我什么也得不到。

这是执行问题的时间/速度（FF可能更慢，因此有更多时间来生成要显示的值吗？）..我以为我通过使用回调函数避免了这种情况。

对于方向，这是我理解这个工作的方式（从下往上阅读）：

我声明了图像数组。它不包含gps数据
我运行getLocation s （注意＆＃39; s＆＃39;）将图像数组作为参数传递给函数。
getLocation s 遍历数组，创建一个图像对象以传递给getLocation（单数）函数。该调用包括对结果的回调。
getLocation在图像上运行EXIF.getData，并在转换后通过convertDMtoDD加载具有纬度和经度的位置数组。
getLocation然后调用回调，将该位置作为参数传递。
console.log记录值，但仅限于我使用Mozilla，FF。 Chrome没有显示任何内容？！

function convertDMtoDD(coordinates, direction) {

  //convert the decimal minutes coordinate array to decimal degrees
  //set the sign based on direction where "S" or "E" is negative

  gpsdegrees = (coordinates[0]);
  gpsminutes = (coordinates[1]);
  leftminutes = Math.floor(gpsminutes);
  rightminutes = (gpsminutes - leftminutes) / 60;
  leftminutes = leftminutes / 60;
  rightminutes = leftminutes + rightminutes;
  degdecimal = (gpsdegrees + rightminutes).toFixed(6);

  if (direction == "S" || direction == "W") {
    degdecimal = 0 - degdecimal;
  }
  return degdecimal;
}

function getLocation(myimage, callback) {
  //EXIF.getData in the EXIF.js library gets the EXIF data from the raw image DOM object 
  myimage.onload = EXIF.getData(myimage, function() {
    //EXIF.getTag pulls the various data for each tag such as latitude, longitude, etc.
    //lati and longi are arrays containing decimalminutes values; latd and longd are single values of either "N", "S", "W", or "E")
    var lati = EXIF.getTag(this, "GPSLatitude");
    var latd = EXIF.getTag(this, "GPSLatitudeRef");

    var longi = EXIF.getTag(this, "GPSLongitude");
    var longd = EXIF.getTag(this, "GPSLongitudeRef");

    var location = [];
    //convert data from decimal minutes to decimal degrees and set direction as neg or pos
    location[0] = convertDMtoDD(lati, latd);
    location[1] = convertDMtoDD(longi, longd);

    callback(location);
  });
}

var images = [
  {
    name: 'Chateau Coussay',
    src: 'coussay.jpg'
  }, {
    name: 'Chateau Courlaine',
    src: 'coulaine.jpg'
  }, {
    name: 'Chateau Sainte-Chapelle',
    src: 'chapelle.jpg'
  }
];

function getLocations(imagelist) {
  for (var i = 0; i < imagelist.length; i++) {
    var myimage = new Image(); //create image object to pass to the getLocation function
    myimage.src = imagelist[i].src;
    getLocation(myimage, function(location) {
      console.log("latitude is " + location[0] + " longitude is " + location[1]);
    });
  }
}

getLocations(images);

Answer 1

不确定这是否是罪魁祸首，但image.onload event and browser cache的答案建议在src值之前设置onload处理程序。您还可以尝试在URL的末尾添加缓存清除查询参数，以防有一些缓存不稳定的情况发生。祝你好运！

Javascript函数（异步）在Mozilla FF中有效但在Chrome中无效吗？

1 个答案: