Plugin de posicionamento JS para uso na China
característica:
PS:
Devido às restrições do navegador, pode haver problemas com o uso do posicionamento H5 da página da web do nome de domínio HTTP, como posicionamento impreciso, posicionamento proibido, etc. Se você deseja que o resultado do posicionamento seja mais preciso, é melhor usar o nome de domínio HTTPS;
O arquivo de localização deste plug-in é armazenado em uma CDN de terceiros. Se você deseja armazená -lo em seu próprio CDN, pode consultar a introdução ao uso da função setConfig
Atualizar log:
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| Nome do método | Descrição do método | Parâmetros/objeto | Descrição do parâmetro | Valor do parâmetro padrão |
| setConfig | Defina a configuração global (use a configuração padrão se não for chamado) | Tempo limite: número/opcional | Tempo limite padrão para todas as funções de posicionamento, em milissegundos | 10000 |
| URL: String/Opcional | Endereço CDN de arquivo estático | https://cdn.jsdelivr.net/npm/@pikaz/location/lib | ||
| getLocation | A função de posicionamento padrão é preferida para usar o posicionamento HTML5. Se o posicionamento HTML5 falhar, ele alternará automaticamente para o posicionamento IP. | Os parâmetros correspondentes ao tipo de posicionamento são os mesmos que o método Geth5Location e o método getiplocation abaixo | - | - |
| Geth5Location | posicionamento HTML5 | Tempo limite: número/opcional | Tempo esgotado | 10000 |
| EnableHighAccuracy: booleano/opcional | Se deve habilitar o posicionamento de alta precisão com o GPS (mais demorado) | falso | ||
| Detalhe: booleano/opcional | Se os detalhes do endereço são necessários (mais demorados) | falso | ||
| Latitude: Número/Opcional | Passe manualmente nas informações de abordagem de inquérito de latitude e longitude. Latitude e longitude precisam ser transmitidas ao mesmo tempo. Caso contrário, use a localização do dispositivo | - | ||
| Longitude: Número/Opcional | Você pode passar manualmente nas informações de endereços de inquérito de latitude e longitude. Latitude e longitude precisam ser transmitidas ao mesmo tempo. Se você não passar, poderá usar o posicionamento do dispositivo. | - | ||
| getiplocation | Posicionamento IP | Tempo limite: número/opcional | Tempo esgotado | 10000 |
| Detalhe: booleano/opcional | Se os detalhes do endereço são necessários (mais demorados) | falso | ||
| IP: String/Opcional | Você pode passar manualmente no endereço IP no formato IPv4 (como 114.114.114.114) para consultar as informações do endereço. Se você não passar, poderá usar o local IP do dispositivo. | - | ||
| SearchAddress | Resolva o texto do endereço | Tempo limite: número/opcional | Tempo esgotado | 10000 |
| Detalhe: booleano/opcional | Se os detalhes do endereço são necessários (mais demorados) | falso | ||
| Endereço: String/requerido | A sequência de texto de endereço deve ter total ou abreviação no nível provincial ou municipal, e não pode conter apenas nomes de distrito e município, como Shenzhen, Guangdong/Shenzhen Nanshan | - | ||
| SearchCodeAddress | Consulta de código regional | Tempo limite: número/opcional | Tempo esgotado | 10000 |
| Detalhe: booleano/opcional | Se os detalhes do endereço são necessários (mais demorados) | falso | ||
| Código: string/requerido | Código Regional | - | ||
| Lista de pesquisa | A ligação de três níveis entre províncias, cidades e distritos é realizada para obter a lista de regiões de nível inferior na região | Código: String/Opcional | Código regional, se não transmitido, obtenha uma lista de todas as regiões provinciais | - |
| SearchCodedEtail | Obtenha informações detalhadas sobre uma única codificação de região, equivalente a detalhar dados em outros métodos | Tempo limite: número/opcional | Tempo esgotado | 10000 |
| Código: string/requerido | Código Regional | - |
NOTA: Se os detalhes estiverem ativados, as informações detalhadas da província, cidade e distrito serão devolvidas com base nas informações de posicionamento básico original.
Descrição: Defina a configuração global (use a configuração padrão se não for chamado)
Você pode fazer upload de toda a pasta estática no diretório raiz do projeto para o seu OSS e passar o endereço de link da pasta estática como um URL. Por exemplo, a pasta estática no OSS pode ser acessada através de https://xxx.com/file/static, e o URL pode ser passado para https://xxx.com/file. Se não estiver definido, o URL usa endereços públicos de CDN como https://cdn.jsdelivr.net/npm/@pikaz/location/lib por padrão (CDN terceirizada pode ser instável, é melhor fazer o upload do arquivo de localização)
import { setConfig } from '@pikaz/location'
setConfig ( {
// 超时时间
timeout : 10000 ,
// 您的oss地址
url : 'https://unpkg.com/@pikaz/location/lib' ,
} ) Nota: A função de posicionamento padrão é preferida para usar o posicionamento HTML5. Se o posicionamento HTML5 falhar, ele alternará automaticamente para o posicionamento IP.
import { getLocation } from '@pikaz/location'
getLocation ( )
. then ( ( res ) => {
// 返回数据结构: {
// ...,//返回对应定位类型数据,同下方的getH5Location和getIpLocation返回数据格式
// type:"h5"//定位类型:h5/ip
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Nota: Função de posicionamento HTML5. Recomenda -se usar o protocolo HTTPS para o posicionamento HTML5. Se for http, o posicionamento HTML5 pode causar posicionamento ou incapacidade imprecisa de posicionar (dependendo da política do navegador) e permitir que o posicionamento de alta precisão será mais demorado;
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 )
} ) Nota: Função de posicionamento IP. O posicionamento IP é menos preciso e pode ser impreciso que o HTML5. No entanto, se o usuário se recusar a posicionar a autorização, o posicionamento de IP poderá ser usado como uma solução de garantia;
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 )
} ) Note: The text of the resolution address must contain the full or abbreviation of the provincial or municipal level, and cannot only include the names of districts and counties, such as Shenzhen, Guangdong Province, Shenzhen City, Guangdong Province, Nanshan, 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 )
} ) Descrição: Informações de endereço da consulta de código regional
import { searchCodeAddress } from '@pikaz/location'
searchCodeAddress ( {
code : '440304' ,
} )
. then ( ( res ) => {
// 返回数据结构:{
// address: "广东省深圳市福田区"//完整地址
// city: "深圳市"//市级名称
// code: "440304"//地区编码
// district: "福田区"//区县级名称
// province: "广东省"//省级名称
// }
} )
. catch ( ( err ) => {
console . log ( err )
} ) Nota: As ligações provinciais, municipais e distritais em três níveis, transmitem o código unitário administrativo correspondente para obter a lista de unidades administrativas de nível inferior; Se o código da unidade administrativa não for transmitido, obtenha a lista de unidades provinciais por padrão
import { searchList } from '@pikaz/location'
searchList ( {
code : '110000' ,
} )
. then ( ( res ) => {
// 返回数据结构: [
// {
// "code":"110101",//该地区编码
// "name":"东城区",//该地区名称
// },
// {
// "code":"110102",//该地区编码
// "name":"西城区",//该地区名称
// }
// ]
} )
. catch ( ( err ) => {
console . log ( err )
} ) Descrição: Obtenha informações detalhadas sobre uma única região: código da região, latitude e longitude, nome, nome 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 )
} ) Nota: Se ativado, as informações detalhadas do endereço serão retornadas nos dados de retorno original.
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 )
} )