Geolocation API

This translation is incomplete. Please help translate this article from English

Secure context
This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Geolocation APIจะช่วยให้ผู้ใช้สามารถใช้งานเว็บไซต์ได้หากพวกเขาต้องการที่จะใช้เหตุผลในการรายงานข้อมูลตำแหน่ง

Web ส่วนขยายที่ต้องการใช้วัตถุ Geolocation ต้องเพิ่ม"geolocation"สิทธิ์ในการแสดงรายการ ระบบปฏิบัติการของผู้ใช้จะแจ้งให้ผู้ใช้อนุญาตการเข้าถึงตำแหน่งในครั้งแรกที่มีการร้องขอ

แนวคิดและการใช้งาน

คุณมักจะต้องการดึงข้อมูลตำแหน่งของผู้ใช้ในแอปพลิเคชันเว็บของคุณเช่นเพื่อพล็อตตำแหน่งของพวกเขาบนแผนที่หรือแสดงข้อมูลส่วนตัวที่เกี่ยวข้องกับตำแหน่งของพวกเขา

Geolocation API เข้าถึงได้ผ่านการเรียก navigator.geolocation; สิ่งนี้จะทำให้เบราว์เซอร์ของผู้ใช้ถามเพื่อขออนุญาตเข้าถึงข้อมูลตำแหน่งของพวกเขา หากพวกเขายอมรับเบราว์เซอร์จะใช้ฟังก์ชันการทำงานที่ดีที่สุดบนอุปกรณ์เพื่อเข้าถึงข้อมูลนี้ (ตัวอย่างเช่น GPS)

นักพัฒนาซอฟต์แวร์สามารถเข้าถึงข้อมูลตำแหน่งนี้ได้สองวิธี:

  • Geolocation.getCurrentPosition(): ดึงตำแหน่งปัจจุบันของอุปกรณ์
  • Geolocation.watchPosition(): ลงทะเบียนฟังก์ชั่นการจัดการที่จะถูกเรียกโดยอัตโนมัติทุกครั้งที่มีการเปลี่ยนตำแหน่งของอุปกรณ์โดยคืนตำแหน่งที่อัปเดต

ในทั้งสองกรณีการเรียกใช้เมธอดใช้เวลาถึงสามอาร์กิวเมนต์:

  • การเรียกกลับสำเร็จที่ได้รับคำสั่ง: หากการเรียกคืนตำแหน่งสำเร็จการเรียกกลับจะดำเนินการกับวัตถุ GeolocationPosition เป็นพารามิเตอร์เดียวเพื่อให้สามารถเข้าถึงข้อมูลตำแหน่งได้
  • ข้อผิดพลาดทางเลือกโทรกลับ: หากการเรียกคืนตำแหน่งไม่สำเร็จการเรียกกลับจะดำเนินการกับวัตถุ GeolocationPositionError เป็นพารามิเตอร์เดียวให้ข้อมูลการเข้าถึงสิ่งที่ผิดพลาด
  • PositionOptions วัตถุที่เป็นตัวเลือกซึ่งมีตัวเลือกสำหรับการดึงข้อมูลตำแหน่ง

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการใช้ Geolocation อ่านใช้ Geolocation API

อินเตอร์เฟซ

Geolocation
คลาสหลักของ API นี้ - ประกอบด้วยวิธีการดึงข้อมูลตำแหน่งปัจจุบันของผู้ใช้เฝ้าดูการเปลี่ยนแปลงตำแหน่งและล้างนาฬิกาที่ตั้งไว้ก่อนหน้านี้
GeolocationPosition
แสดงตำแหน่งของผู้ใช้ GeolocationPositionอินสแตนซ์ถูกส่งกลับโดยการเรียกร้องที่ประสบความสำเร็จให้เป็นหนึ่งในวิธีการที่มีอยู่ภายใน Geolocation ภายในโทรกลับประสบความสำเร็จและมีการประทับเวลาบวก GeolocationCoordinates ตัวอย่างวัตถุ
GeolocationCoordinates
แสดงเรียงลำดับของตำแหน่งที่มีการเชื่อมโยงGeolocationCoordinatesและข้อมูลอื่น ๆ ที่สำคัญ
GeolocationPositionError
A GeolocationPositionErrorถูกส่งคืนโดยการเรียกที่ไม่สำเร็จไปยังหนึ่งในวิธีการที่อยู่ภายใน Geolocation, ภายในการเรียกกลับข้อผิดพลาดและมีรหัสข้อผิดพลาดและข้อความ
Navigator.geolocation
API เข้าสู่ระบบส่งคืนวัตถุ ตำแหน่งทางภูมิศาสตร์

พจนานุกรม

PositionOptions
แสดงให้เห็นถึงเนื้อหาที่มีตัวเลือกที่จะผ่านการเก็บของ Geolocation.getCurrentPosition() และ Geolocation.watchPosition()

ตัวอย่าง

In the following example the Geolocation API is used to retrieve the user's latitude and longitude. If sucessful, the available hyperlink is populated with an openstreetmap.org URL that will show their location.

HTML

<button id = "find-me">Show my location</button><br/>
<p id = "status"></p>
<a id = "map-link" target="_blank"></a>

JavaScript

function geoFindMe() {

  const status = document.querySelector('#status');
  const mapLink = document.querySelector('#map-link');

  mapLink.href = '';
  mapLink.textContent = '';

  function success(position) {
    const latitude  = position.coords.latitude;
    const longitude = position.coords.longitude;

    status.textContent = '';
    mapLink.href = `https://www.openstreetmap.org/#map=18/${latitude}/${longitude}`;
    mapLink.textContent = `Latitude: ${latitude} °, Longitude: ${longitude} °`;
  }

  function error() {
    status.textContent = 'Unable to retrieve your location';
  }

  if(!navigator.geolocation) {
    status.textContent = 'Geolocation is not supported by your browser';
  } else {
    status.textContent = 'Locating…';
    navigator.geolocation.getCurrentPosition(success, error);
  }

}

document.querySelector('#find-me').addEventListener('click', geoFindMe);

Result

ข้อมูลจำเพาะ

สเปค สถานะ คิดเห็น
Unknown} Unknown}

ความเข้ากันได้ของเบราว์เซอร์

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
GeolocationChrome Full support 5Edge Full support 12Firefox Full support 3.5
Notes
Full support 3.5
Notes
Notes GPSD (GPS daemon) support added in Firefox 3.6. WiFi-based location is provided by Google (privacy) or a custom provider (MLS instructions).
IE Full support 9Opera Full support 10.6Safari Full support 5WebView Android Full support ≤37Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 11Safari iOS Full support 5Samsung Internet Android Full support 1.0
clearWatchChrome Full support 5Edge Full support 12Firefox Full support 3.5IE Full support 9Opera Full support 10.6Safari Full support 5WebView Android Full support ≤37Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 11Safari iOS Full support 5Samsung Internet Android Full support 1.0
getCurrentPositionChrome Full support 5Edge Full support 12Firefox Full support 3.5IE Full support 9Opera Full support 10.6Safari Full support 5WebView Android Full support ≤37Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 11Safari iOS Full support 5Samsung Internet Android Full support 1.0
Secure context requiredChrome Full support 50Edge Full support ≤79Firefox Full support 55IE No support NoOpera Full support 37Safari Full support YesWebView Android Full support 51
Notes
Full support 51
Notes
Notes Secure context is only required for applications targeting Android Nougat (7) and higher. See bug 603574.
Chrome Android Full support 50Firefox Android Full support 55Opera Android Full support 37Safari iOS Full support YesSamsung Internet Android Full support 5.0
watchPositionChrome Full support 5Edge Full support 12Firefox Full support 3.5IE Full support 9Opera Full support 10.6Safari Full support 5WebView Android Full support ≤37Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 11Safari iOS Full support 5Samsung Internet Android Full support 1.0

Legend

Full support  
Full support
No support  
No support
See implementation notes.
See implementation notes.

ความพร้อมใช้งาน

เนื่องจาก Google เป็นผู้ให้บริการระบุตำแหน่งผ่าน WiFi ดังนั้นวานิลลา Geolocation API จึงอาจไม่ด้านใช้งานพนักงานพนักงานได้ในห้างหุ้นส่วนจำกัดห้างหุ้นส่วนจำกัดออกออกประเทศจีนที่ที่คุณคุณที่คุณคุณอาจจะใช้ที่คุณคุณคุณผู้ให้บริการบุคคลที่สามในห้างหุ้นส่วนจำกัดห้างหุ้นส่วนจำกัดท้องถิ่นเช่นBaidu , AutoNaviหรือTencent บริการเหล่านี้ที่อยู่ IP ของผู้ใช้และ / หรือระบุตำแหน่งที่ดีขึ้น

ดูสิ่งนี้ด้วย