获取Flutter Web的用户位置 [英] Get User's Location for flutter Web

问题描述

我目前正在使用geolocator插件访问用户的位置（纬度/经度），但似乎尚不适用于网络。我试图找到一些方法来检索用户在网络中的位置，但是我没有找到它。

I'm currently using the geolocator plugin to access user's location (latitude/longitude) but it seems like it does not work for web yet. I've try to find something to retrieve the user's location in web but I did not manage to find it.

有人已经尝试过/找到可以做这份工作的东西了吗？

Has anyone already tried/found something to do the job?

预先感谢，

Lionel

推荐答案

由于扑通团队的不和，我能够获得一些指导（特别感谢David Iglesias）。

Thanks to the discord of the flutter team, I was able to get some guidance (special thanks to David Iglesias).

为了能够检索Web部件的位置，我不得不使用
https://pub.dev/packages/js 公开javascript API并将其与 https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API 。

To be able to retrieve the position for the web part I had to use https://pub.dev/packages/js to expose the javascript API and combine it with https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API.

所以这里是这样：

1）首先创建一个文件（例如：locationJs.dart）以显示JS函数：

1) First create a file (ex: locationJs.dart) to expose the JS function :

@JS('navigator.geolocation') // navigator.geolocation namespace
library jslocation; // library name can be whatever you want

import "package:js/js.dart";

@JS('getCurrentPosition') // Accessing method getCurrentPosition from       Geolocation API
external void getCurrentPosition(Function success(GeolocationPosition pos));

@JS()
@anonymous
class GeolocationCoordinates {
 external double get latitude;
 external double get longitude;
 external double get altitude;
 external double get accuracy;
 external double get altitudeAccuracy;
 external double get heading;
 external double get speed;

 external factory GeolocationCoordinates(
  {double latitude,
  double longitude,
  double altitude,
  double accuracy,
  double altitudeAccuracy,
  double heading,
  double speed});
  }

 @JS()
 @anonymous
 class GeolocationPosition {
 external GeolocationCoordinates get coords;

 external factory GeolocationPosition({GeolocationCoordinates coords});
}

2）调用新创建的文件

2) Call the newly created file

import 'package:Shared/locationJs.dart';

 success(pos) {
  try {
  print(pos.coords.latitude);
  print(pos.coords.longitude);
  } catch (ex) {
    print("Exception thrown : " + ex.toString());
  }
 }
_getCurrentLocation() {
if (kIsWeb) {
  getCurrentPosition(allowInterop((pos) => success(pos)));
}

去吧！

这篇关于获取Flutter Web的用户位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！