0

I'm using the excellent exifr library to read the create date from pngs. I'm looping through an array and adding data to a created marker on a map... but I'm stuck on promises!

This is what I want to do in each iteration of the loop.

exifr.parse(bottlefullurl, {xmp: true, tiff:false})
    .then(output => bottledate = output.CreateDate);

jmarker.jmarkerdatedata = bottledate;

Which of course returns undefined as the promise isn't complete. I can console log it so I know the library works.

exifr.parse(bottlefullurl, {xmp: true, tiff:false})
    .then(output => console.log(output.CreateDate));

The documentation is great but the examples all only console.log
https://github.com/MikeKovarik/exifr/blob/master/README.md

I've read some great answers on Stack Overflow like this one...
How do I return the response from an asynchronous call?

... and some articles and MDN docs but it's about three steps ahead of my current Javascript understanding (I can't write arrow functions).

Please help!

Cmeet
  • 1
  • 1

2 Answers2

1

bottledate isn't in the scope of where you assign it, it lives in the scope of the arrow function you created

try this:

jmarker.jmarkerdatedata = exifr.parse(bottlefullurl, {xmp: true, tiff:false})
    .then(output => output.CreateDate);
Ray
  • 11
  • 1
  • Feels like one step closer, returned [object Promise] instead of [undefined]. I've got an onClick function on each of the markers. Might be easier to do it there but I'd love to do it in the loop. – Cmeet Nov 23 '22 at 08:32
0

Turned out to be one level dumber. I had been trying await and getting an error because I was adding my .js file using type='text/javascript' not type=module... so await wouldn't work! Doh.

So it was super simple after fixing that:

jmarker.jmarkerdatedata = await exifr.parse(bottlefullurl, {xmp: true, tiff:false})
.then(output => output.CreateDate);
Cmeet
  • 1
  • 1