无法从 react-native 中的 navigation.geolocation.getCurrentPosition() 返回位置

Posted 2023-02-23

【中文标题】无法从 react-native 中的 navigation.geolocation.getCurrentPosition() 返回位置

【英文标题】：Cannot return position in from navigation.geolocation.getCurrentPosition() in react-native

【发布时间】：2019-06-09 11:38:45

【问题描述】：

我正在尝试在以 react-native 拍摄图像后获取地理位置。用户捕获图像，图像连同地理位置一起存储在一个对象中，并通过 http 请求发送到服务器。

保存获取地理位置的功能很好，但我无法返回要存储在对象中以进行 http 传输的地理位置。我得到一个未定义的。

        console.log('getCoordinates run')
        await navigator.geolocation.getCurrentPosition(
            position => 
                let coordinates = `$position.coords.longitude, 
                      $position.coords.latitude`

                return coordinates
            ,
            error => Alert.alert(error.message),
             enableHighAccuracy: false, timeout: 20000, maximumAge: 1000 
        )

    


captureImage = async () => 
        if (this.camera) 
            const options =  quality: 0.5, base64: true ;
            const data = await this.camera.takePictureAsync(options);
            console.log(data);



            let postData = 
                user: 1,
                coordinates: this.getCoordinates(),
                image: `data:image/jpeg;base64$data.base64`,
            
            console.log(postData)

             axios.post('https://localhost:5000/api/posts', postData)
                 .then(post => res.json(post))
                 .catch(err => console.log(err))

        
    

预期结果是，当 captureImage 函数运行带有 postData 对象的 getCoordinates 函数时，会在数据传输到服务器之前返回当前地理位置。

【参考方案1】：

geolocation.getCurrentPosition 函数在这里的工作原理是它设置一个回调以在获取用户位置后发送数据。获取和发送相关数据需要时间。这就是我们使用回调或承诺的原因。但是在您的代码中，您只需调用该函数，无需等待其响应，只需执行 API 调用即可。

我假设您已经使用 Async 函数来执行此操作。但如果我是你，我会尝试在这里使用 Promises 来解决这个问题。简单的例子是，

captureImage = async () => 
    if (this.camera) 
        // ... do your camera tasks
    

    this.sendImageData(data); // data is what you got from camera.


getGeoInfo = () => 
   return new Promise((resolve, reject) => 
       navigator.geolocation.getCurrentPosition(
        position => 
            let coordinates = `$position.coords.longitude, 
                  $position.coords.latitude`

            resolve(coordinates);
        ,
        error => reject(error),
         enableHighAccuracy: false, timeout: 20000, maximumAge: 1000 
      )
   )


sendImageData = (cameraData) => 
   let coordinates = '';
   getGeoInfo.then(crdnts => coordinates = crdnts );

   // now coordinates have all relevant data you wished.
   const data =  //... make the object as you want 
   // do the API call using axios as you've already done.

【讨论】：

像魔术一样工作。我真的必须深入了解 Promise 的工作原理。