简体   繁体   中英

Why is callback function for geolocation (with 'await') never getting called?

New JS programmer here, and still trying to understand async and await . The following simple example is intended to retrieve the user's location and then update a global variable. I realize that I have to click on the "allow location access" pop-up, but why doesn't the program pause until that happens?

Instead, the callback is skipped (apparently) forever. That is, there is never any output string "In setUserLocation", and the final printed value of userLocation is the same as the original value. No uncaught error shows up in the console (I did have error checks in the original code).

EDIT: I added an error handler callback to getCurrentPosition . Basically, it gets invoked if I click "block access" when prompted to allow access to location. Otherwise the program behaves as before.

  var userLocation = {lat: "40.0", lon: "-90.0", name: "Default Location"}


  function setUserLocation(position) {  // callback function 
                                                                              
      console.log("In setUserLocation")       // never executed -- why?
      lat = position.coords.latitude.toString();
      lon = position.coords.longitude.toString();

      userLocation.lat = lat ;
      userLocation.lon = lon ;
      userLocation.name = "New Location" ;
      console.log(userLocation) ;
  }

  function failedLocation() {
      console.log("Something went wrong")
  }

  async function retrieveLocation() {

      console.log(userLocation) ;
      console.log("Getting location") ;

      await navigator.geolocation.getCurrentPosition(setUserLocation,failedLocation);

      console.log("Got location") ;
      console.log(userLocation) ;
  }

  retrieveLocation() ;

Here is the console output: 控制台输出

getCurrentPosition doesn't return anything, you have to "promisify" it first:

 let getLocation = () => new Promise((resolve, reject) => navigator.geolocation.getCurrentPosition(resolve, reject)); async function main() { try { console.log('getting location...'); let location = await getLocation(); console.log('got location'); console.log(location) } catch (e) { console.log('ERROR'); console.log(e.message) } } main()

The reason why my callback function was never getting executed at all apparently had to do with location access by Chrome being unchecked in my Mac's Security Preferences under Big Sur. The remaining mystery was then why manually re-checking was not sticking -- it kept reverting to unchecked. That turns out to have been described as a bug here:

https://discussions.apple.com/thread/252188240

Updating Chrome solved that problem, and the callback now executes. However, I still have the problem that it doesn't execute in the desired order, so rather than edit this question (which might be relevant to others coming here), I thought I'd post a new one with the updated (different) question.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM