Plugin de positionnement JS pour une utilisation en Chine
caractéristiques:
PS:
En raison des restrictions du navigateur, il peut y avoir des problèmes avec l'utilisation du positionnement H5 de la page Web du nom de domaine HTTP, tel que le positionnement inexact, le positionnement interdit, etc. Si vous voulez que le résultat de positionnement soit plus précis, il est préférable d'utiliser le nom de domaine HTTPS;
Le fichier d'emplacement de ce plug-in est stocké dans un CDN tiers. Si vous souhaitez le stocker sur votre propre CDN, vous pouvez vous référer à l'introduction à l'utilisation de la fonction SetConfig
Journal de mise à jour:
yarn add @pikaz/location
npm i -S @pikaz/location import { getLocation } from '@pikaz/location' < script
type =" text/javascript "
src =" https://cdn.jsdelivr.net/npm/@pikaz/location "
> </ script >
或者
< script type =" text/javascript " src =" https://unpkg.com/@pikaz/location " > </ script > const { getLocation } = window . pikazLocation| Nom de méthode | Description de la méthode | Paramètres / objet | Description du paramètre | Valeur de paramètre par défaut |
| setConfig | Définir la configuration globale (utiliser la configuration par défaut si elle n'est pas appelée) | Timeout: numéro / facultatif | Délai d'expiration par défaut pour toutes les fonctions de positionnement, en millisecondes | 10000 |
| URL: chaîne / facultatif | Adresse CDN du fichier statique | https://cdn.jsdelivr.net/npm/@pikaz/location/lib | ||
| getLocation | La fonction de positionnement par défaut est préférée d'utiliser le positionnement HTML5. Si le positionnement HTML5 échoue, il passera automatiquement au positionnement IP. | Les paramètres correspondant au type de positionnement sont les mêmes que la méthode Geth5Location et la méthode GetIpLocation ci-dessous | - | - |
| GETH5LOCATION | Positionnement HTML5 | Timeout: numéro / facultatif | Temps mort | 10000 |
| Activer Highgacuratie: booléen / facultatif | S'il faut permettre le positionnement de haute précision avec un GPS (plus de temps) | FAUX | ||
| Détail: booléen / facultatif | Si les détails de l'adresse sont requis (plus de temps) | FAUX | ||
| Latitude: numéro / facultatif | Passer manuellement dans les informations sur les informations de la latitude et de la longitude. La latitude et la longitude doivent être transmises en même temps. Sinon, utilisez l'emplacement de l'appareil | - | ||
| longitude: numéro / facultatif | Vous pouvez passer manuellement dans les informations sur les informations de la latitude et de la longitude. La latitude et la longitude doivent être transmises en même temps. Si vous ne passez pas, vous pouvez utiliser le positionnement de l'appareil. | - | ||
| getiplocation | Positionnement IP | Timeout: numéro / facultatif | Temps mort | 10000 |
| Détail: booléen / facultatif | Si les détails de l'adresse sont requis (plus de temps) | FAUX | ||
| IP: chaîne / facultatif | Vous pouvez passer manuellement dans l'adresse IP au format IPv4 (tel que 114.114.114.114) pour interroger les informations d'adresse. Si vous ne le transmettez pas, vous pouvez utiliser l'emplacement IP de l'appareil. | - | ||
| SearchAddress | Résoudre le texte de l'adresse | Timeout: numéro / facultatif | Temps mort | 10000 |
| Détail: booléen / facultatif | Si les détails de l'adresse sont requis (plus de temps) | FAUX | ||
| Adresse: chaîne / requise | La chaîne de texte de l'adresse doit avoir une ou une abréviation complète au niveau provincial ou municipal, et ne contiennent pas seulement des noms de district et de comté, tels que Shenzhen, Guangdong / Shenzhen Nanshan | - | ||
| SearchCodeAddress | Requête de code régional | Timeout: numéro / facultatif | Temps mort | 10000 |
| Détail: booléen / facultatif | Si les détails de l'adresse sont requis (plus de temps) | FAUX | ||
| Code: chaîne / requis | Code régional | - | ||
| liste de recherche | La liaison à trois niveaux entre les provinces, les villes et les districts est réalisée pour obtenir la liste des régions de niveau inférieur dans la région | Code: chaîne / facultatif | Le code régional, s'il n'est pas transmis, obtenez une liste de toutes les régions provinciales | - |
| SearchCodeDetail | Obtenez des informations détaillées sur un codage de région unique, équivalent aux données détaillées dans d'autres méthodes | Timeout: numéro / facultatif | Temps mort | 10000 |
| Code: chaîne / requis | Code régional | - |
Remarque: Si les détails sont activés, les informations détaillées de la province, de la ville et du district seront retournées en fonction des informations de positionnement de base d'origine.
Description: Définissez la configuration globale (utilisez la configuration par défaut si elle n'est pas appelée)
Vous pouvez télécharger l'intégralité du dossier statique dans le répertoire racine du projet sur votre OSS et passer l'adresse de liaison du dossier statique en tant qu'URL. Par exemple, le dossier statique de l'OSS est accessible via https://xxx.com/file/static, et l'URL peut être transmis à https://xxx.com/file. S'il n'est pas défini, l'URL utilise des adresses CDN publiques telles que https://cdn.jsdelivr.net/npm/@pikaz/location/lib par défaut (le CDN tiers peut être instable, il est préférable de télécharger le fichier de localisation vous-même)
import { setConfig } from '@pikaz/location'
setConfig ( {
// 超时时间
timeout : 10000 ,
// 您的oss地址
url : 'https://unpkg.com/@pikaz/location/lib' ,
} ) Remarque: La fonction de positionnement par défaut est préférable d'utiliser le positionnement HTML5. Si le positionnement HTML5 échoue, il passera automatiquement au positionnement IP.
import { getLocation } from '@pikaz/location'
getLocation ( )
. then ( ( res ) => {
// 返回数据结构: {
// ...,//返回对应定位类型数据,同下方的getH5Location和getIpLocation返回数据格式
// type:"h5"//定位类型:h5/ip
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Remarque: fonction de positionnement HTML5. Il est recommandé d'utiliser le protocole HTTPS pour le positionnement HTML5. S'il s'agit de HTTP, alors le positionnement HTML5 peut entraîner un positionnement ou une incapacité inexacts à positionner (selon la politique du navigateur), et l'activation de positionnement de haute précision sera plus longue;
import { getH5Location } from '@pikaz/location'
getH5Location ( {
// 开启gps高精度定位
enableHighAccuracy : true ,
} )
. then ( ( res ) => {
// 返回数据结构:{
// address: "广东省深圳市福田区"//完整地址
// city: "深圳市"//市级名称
// code: "440304"//地区编码
// district: "福田区"//区县级名称
// latitude: 22.547//区县级纬度
// longitude: 114.085947//区县级经度
// province: "广东省"//省级名称
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Remarque: fonction de positionnement IP. Le positionnement IP est moins précis et peut être inexact que HTML5. Cependant, si l'utilisateur refuse de positionner l'autorisation, le positionnement IP peut être utilisé comme solution de garantie;
import { getIpLocation } from '@pikaz/location'
getIpLocation ( )
. then ( ( res ) => {
// 返回数据结构:{
// address: "江苏省南京市"//完整地址
// city: "南京市"//市级名称
// code: "320100"//地区编码
// district: ""//区县级名称
// province: "江苏省"//省级名称
// ip: "114.114.114.114"//ip地址
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Remarque: Le texte de l'adresse de résolution doit contenir la pleine ou l'abréviation du niveau provincial ou municipal, et ne peut pas seulement inclure les noms des districts et des comtés, tels que Shenzhen, province du Guangdong, Shenzhen / Shenzhen / Shenzhen Nanshan
import { searchAddress } from '@pikaz/location'
searchAddress ( {
address : '广东福田' ,
} )
. then ( ( res ) => {
// 返回数据结构:{
// address: "广东省深圳市福田区"//完整地址
// city: "深圳市"//市级名称
// code: "440304"//地区编码
// district: "福田区"//区县级名称
// province: "广东省"//省级名称
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Description: Informations sur l'adresse de la requête du code régional
import { searchCodeAddress } from '@pikaz/location'
searchCodeAddress ( {
code : '440304' ,
} )
. then ( ( res ) => {
// 返回数据结构:{
// address: "广东省深圳市福田区"//完整地址
// city: "深圳市"//市级名称
// code: "440304"//地区编码
// district: "福田区"//区县级名称
// province: "广东省"//省级名称
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Remarque: les liaisons provinciales, municipales et de district à trois niveaux, transmettent le code d'unité administratif correspondant pour obtenir la liste des unités administratives de niveau inférieur; Si le code d'unité administratif n'est pas transmis, obtenez la liste des unités provinciales par défaut
import { searchList } from '@pikaz/location'
searchList ( {
code : '110000' ,
} )
. then ( ( res ) => {
// 返回数据结构: [
// {
// "code":"110101",//该地区编码
// "name":"东城区",//该地区名称
// },
// {
// "code":"110102",//该地区编码
// "name":"西城区",//该地区名称
// }
// ]
} )
. catch ( ( err ) => {
console . log ( err )
} ) Description: Obtenez des informations détaillées sur une seule région: code région, latitude et longitude, nom, nom pinyin
import { searchCodeDetail } from '@pikaz/location'
searchCodeDetail ( {
code : '440304' ,
} )
. then ( ( res ) => {
// {
// "code": "440304", //该地区编码
// "location": { //该地区经纬度
// "latitude": 22.521541,
// "longitude": 114.05498
// },
// "name": "福田区", //该地区名称
// "pinyin": "futianqu" //该地区拼音
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Remarque: si elle est activée, les informations détaillées sur l'adresse seront renvoyées dans les données de retour d'origine.
import { getH5Location } from '@pikaz/location'
getH5Location ( {
// 获取详细地址信息
detail : true ,
} )
. then ( ( res ) => {
// {
// address: "广东省深圳市福田区" //完整地址
// city: "深圳市" //市级名称
// code: "440304" //地区编码
// district: "福田区" //区县级名称
// latitude: 22.547 //区县级纬度
// longitude: 114.085947 //区县级经度
// province: "广东省" //省级名称
// "detail": { //详细地址信息
// "province": {
// "code": "440000", //省级地区编码
// "location": { //省级地区经纬度
// "latitude": 23.13171,
// "longitude": 113.26627
// },
// "name": "广东省", //省级名称
// "pinyin": "guangdong" //省级名称拼音
// },
// "city": {
// "code": "440300", //市级地区编码
// "location": { //市级地区经纬度
// "latitude": 22.54286,
// "longitude": 114.05956
// },
// "name": "深圳市", //市级名称
// "pinyin": "shenzhen" //市级名称拼音
// },
// "district": {
// "code": "440304", //区县级地区编码
// "location": { //区县级地区经纬度
// "latitude": 22.521541,
// "longitude": 114.05498
// },
// "name": "福田区", //区县级名称
// "pinyin": "futianqu" //区县级名称拼音
// }
// }
} )
. catch ( ( err ) => {
console . log ( err )
} )