الصفحة الرئيسية>موارد بناء الموقع>بيانات الموقع
تنزيل

يقدم

مكون إضافي لموضع JS للاستخدام في الصين

المميزة:

  • يدعم المتصفح H5 تحديد المواقع ، وتحديد موقع IP ، وعنوان استعلام خطوط الطول وعنوان خط الطول ، واستعلام IP ، وعنوان الاستعلام عن الكود الإقليمي ، وتحليل نص العنوان ، والبحث عن قائمة ارتباط ثلاثية المستويات في المقاطعة والمدينة والمنطقة
  • تم ضغط ملف معلومات الموقع. إذا تم تمكين GZIP ، فإن تحديد المواقع الجزئية سيكلف العشرات من K فقط.
  • لا تحتاج مكتبة تحديد المواقع من جانب الويب إلى تشغيل خدمات تحديد المواقع الإضافية على الخادم ، ولا يوجد حد للتزامن وعدد المرات ولا توجد رسوم

ملاحظة:

  • نظرًا لقيود المتصفح ، قد تكون هناك مشاكل في استخدام تحديد موقع H5 لصفحة الويب لاسم مجال HTTP ، مثل تحديد المواقع غير الدقيقة ، وتحديد المواقع المحظورة ، وما إلى ذلك إذا كنت تريد أن تكون نتيجة تحديد المواقع أكثر دقة ، فمن الأفضل استخدام اسم مجال HTTPS ؛

  • يتم تخزين ملف موقع هذا المكون الإضافي في CDN تابع لجهة خارجية. إذا كنت ترغب في تخزينها على CDN الخاص بك ، فيمكنك الرجوع إلى مقدمة دالة SetConfig

سجل التحديث:

  • يرجى النقر هنا للحصول على مستند 0.1.x. إصدار 1.xx هو تحديث مدمر مقارنة بإصدار 0.1.x. إذا كنت بحاجة إلى الترقية ، يرجى إعادة توصيل المستند.
  • بالمقارنة مع إصدار 0.1.x ، يتم إضافة عنوان استعلام IP جديد ، دقة نص العنوان ، وعنوان استعلام ترميز المنطقة.
  • تم إعادة بناء طريقة تحديد موقع IP ، ويتم معالجة تحديد موقع IP باستخدام ملفات IP. ليس له أي اعتماد على تحديد موقع IP للأطراف الثالثة. سيتم اقتطاع IP ليوم واحد بشكل افتراضي. يمكنك أيضًا الحصول على IPS للمستخدم مع خدماتك الخاصة لتحديد موقع IP.
  • قم بتحسين ملف تحديد المواقع لجعل الملفات المحملة محملة في كل مرة ، وقم بتخزين جميع ملفات تحديد المواقع المحملة باستمرار. في المرة الثانية التي تكون فيها سرعة تحديد المواقع لنفس المدينة ضمن 100 مللي ثانية.
  • الإصدار 1.0.9 يحسن منطق تحميل ملف CDN
  • تمت إضافة حزمة Esmodule إلى الإصدار 1.0.10 ، متوافق مع Vite

مثال تجريبي انقر هنا لتجربة ذلك بنقرة واحدة

الرمز التجريبي انقر هنا لنسخ

ثَبَّتَ

مع NPM أو الغزل 

yarn add @pikaz/location

npm i -S @pikaz/location
 import { getLocation } from '@pikaz/location'

مع CDN 

 < 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

وظائف الطريقة

اسم الطريقة وصف الطريقة المعلمات/الكائن وصف المعلمة قيمة المعلمة الافتراضية
setConfig تعيين التكوين العالمي (استخدم التكوين الافتراضي إذا لم يتم استدعاؤه) مهلة: رقم/اختياري المهلة الافتراضية لجميع وظائف تحديد المواقع ، بالميلي ثانية 10000
عنوان URL: سلسلة/اختياري عنوان ملف CDN ثابت https://cdn.jsdelivr.net/npm/@pikaz/location/lib
getLocation تفضل وظيفة تحديد المواقع الافتراضية لاستخدام وضع HTML5. إذا فشل تحديد موقع HTML5 ، فسيتم تبديله تلقائيًا إلى تحديد موقع IP. المعلمات المقابلة لنوع تحديد موقع - -
Geth5location HTML5 تحديد المواقع مهلة: رقم/اختياري نفذ الوقت 10000
EnableHighcancuracy: منطقية/اختيارية سواء كنت لتمكين تحديد المواقع عالية الدقة مع GPS (المزيد من الوقت يستغرق وقتا طويلا) خطأ شنيع
التفاصيل: منطقية/اختيارية ما إذا كانت تفاصيل العنوان مطلوبة (مزيد من الاستهلاك للوقت) خطأ شنيع
خط العرض: الرقم/الاختياري تمر يدويًا في معلومات عنوان خط العرض وخط الطول. يجب أن يتم نقل خطوط الطول والعرض في نفس الوقت. إذا لم يكن كذلك ، استخدم موقع الجهاز -
خط الطول: رقم/اختياري يمكنك تمرير معلومات عنوان خطوط الطول والطول يدويًا. تحتاج خطوط الطول والعرض إلى نقلها في نفس الوقت. إذا لم تمر ، فيمكنك استخدام وضع الجهاز. -
getiplocation تحديد موقع IP مهلة: رقم/اختياري نفذ الوقت 10000
التفاصيل: منطقية/اختيارية ما إذا كانت تفاصيل العنوان مطلوبة (مزيد من الاستهلاك للوقت) خطأ شنيع
IP: سلسلة/اختياري يمكنك تمرير عنوان IP بتنسيق IPv4 يدويًا (مثل 114.114.114.114) للاستعلام عن معلومات العنوان. إذا لم تقم بتمريره ، فيمكنك استخدام موقع IP للجهاز. -
SearchAddress حل نص العنوان مهلة: رقم/اختياري نفذ الوقت 10000
التفاصيل: منطقية/اختيارية ما إذا كانت تفاصيل العنوان مطلوبة (مزيد من الاستهلاك للوقت) خطأ شنيع
العنوان: سلسلة/مطلوب يجب أن يكون لسلسلة نص العنوان كاملة أو اختصار على المستوى الإقليمي أو البلدية ، ولا يمكن أن تحتوي فقط على أسماء المقاطعات والمقاطعات ، مثل Shenzhen ، Guangdong/Shenzhen Nanshan -
SearchCodeadDress استعلام الكود الإقليمي مهلة: رقم/اختياري نفذ الوقت 10000
التفاصيل: منطقية/اختيارية ما إذا كانت تفاصيل العنوان مطلوبة (مزيد من الاستهلاك للوقت) خطأ شنيع
الكود: سلسلة/مطلوب الكود الإقليمي -
قائمة البحث يتم تنفيذ الارتباط المكون من ثلاثة مستويات بين المقاطعات والمدن والمناطق للحصول على قائمة المناطق ذات المستوى الأدنى في المنطقة الرمز: سلسلة/اختياري الكود الإقليمي ، إن لم يتم نقله ، احصل على قائمة بجميع المناطق الإقليمية -
SearchCodEdetail احصل على معلومات مفصلة حول ترميز منطقة واحدة ، أي ما يعادل تفاصيل البيانات في طرق أخرى مهلة: رقم/اختياري نفذ الوقت 10000
الكود: سلسلة/مطلوب الكود الإقليمي -

ملاحظة: إذا تم تمكين التفاصيل ، فسيتم إرجاع المعلومات التفصيلية للمقاطعة والمدينة والمنطقة بناءً على معلومات تحديد المواقع الأساسية الأصلية.

مثال على الطريقة

setConfig

الوصف: تعيين التكوين العالمي (استخدم التكوين الافتراضي إذا لم يتم استدعاؤه)

يمكنك تحميل المجلد الثابت بأكمله في الدليل الجذر للمشروع إلى OSS الخاص بك وتمرير عنوان الرابط للمجلد الثابت كعنوان URL. على سبيل المثال ، يمكن الوصول إلى المجلد الثابت على OSS من خلال https://xxx.com/file/static ، ويمكن تمرير عنوان URL إلى https://xxx.com/file. إذا لم يتم تعيينه ، فإن عنوان URL يستخدم عناوين CDN العامة مثل https://cdn.jsdelivr.net/npm/@pikaz/location/lib بشكل افتراضي (قد يكون CDN من الطرف الثالث غير مستقر ، ومن الأفضل تحميل ملف الموقع بنفسك) 

 import { setConfig } from '@pikaz/location'
setConfig ( {
    // 超时时间
    timeout : 10000 ,
    // 您的oss地址
    url : 'https://unpkg.com/@pikaz/location/lib' ,
} )

getLocation

ملاحظة: تفضل وظيفة تحديد المواقع الافتراضية لاستخدام وضع HTML5. إذا فشل تحديد موقع HTML5 ، فسيتم تبديله تلقائيًا إلى تحديد موقع IP. 

 import { getLocation } from '@pikaz/location'
getLocation ( )
    . then ( ( res ) => {
        // 返回数据结构: {
        // ...,//返回对应定位类型数据，同下方的getH5Location和getIpLocation返回数据格式
        // type:"h5"//定位类型：h5/ip
        // }
    } )
    . catch ( ( err ) => {
        console . log ( err )
    } )

Geth5location

ملاحظة: وظيفة تحديد المواقع HTML5. يوصى باستخدام بروتوكول HTTPS لتحديد موقع HTML5. إذا كان HTTP ، فقد يتسبب تحديد موقع HTML5 في تحديد موقع غير دقيق أو عدم قدرته على وضعه (اعتمادًا على سياسة المتصفح) ، وسيتم تمكين تحديد المواقع عالية الدقة بشكل أكبر ؛ 

 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 )
    } )

getiplocation

ملاحظة: وظيفة تحديد موقع IP. تحديد موقع IP أقل دقة وقد يكون غير دقيق من HTML5. ومع ذلك ، إذا رفض المستخدم الترخيص ، فيمكن استخدام تحديد موقع IP كحل ضمان ؛ 

 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 )
    } )

SearchAddress

ملاحظة: يجب أن يحتوي نص عنوان القرار على الكامل أو الاختصار للمستوى الإقليمي أو البلدي ، ولا يمكن أن يشمل فقط أسماء المقاطعات والمقاطعات ، مثل شنتشن ، مقاطعة قوانغدونغ ، مدينة شنتشن/شنتان ، 

 import { searchAddress } from '@pikaz/location'
searchAddress ( {
    address : '广东福田' ,
} )
    . then ( ( res ) => {
        // 返回数据结构:{
        //     address: "广东省深圳市福田区"//完整地址
        //     city: "深圳市"//市级名称
        //     code: "440304"//地区编码
        //     district: "福田区"//区县级名称
        //     province: "广东省"//省级名称
        // }
    } )
    . catch ( ( err ) => {
        console . log ( err )
    } )

SearchCodeadDress

الوصف: معلومات عنوان الاستعلام عن الرمز الإقليمي 

 import { searchCodeAddress } from '@pikaz/location'
searchCodeAddress ( {
    code : '440304' ,
} )
    . then ( ( res ) => {
        // 返回数据结构:{
        //     address: "广东省深圳市福田区"//完整地址
        //     city: "深圳市"//市级名称
        //     code: "440304"//地区编码
        //     district: "福田区"//区县级名称
        //     province: "广东省"//省级名称
        // }
    } )
    . catch ( ( err ) => {
        console . log ( err )
    } )

قائمة البحث

ملاحظة: تنقل الروابط الإقليمية والبلدية والمقاطعة على ثلاثة مستويات ، رمز الوحدة الإدارية المقابلة للحصول على قائمة الوحدات الإدارية ذات المستوى الأدنى ؛ إذا لم يتم إرسال رمز الوحدة الإدارية ، فاحصل على قائمة الوحدات الإقليمية افتراضيًا 

 import { searchList } from '@pikaz/location'
searchList ( {
    code : '110000' ,
} )
    . then ( ( res ) => {
        // 返回数据结构: [
        // {
        //  "code":"110101",//该地区编码
        //  "name":"东城区",//该地区名称
        // },
        // {
        //  "code":"110102",//该地区编码
        //  "name":"西城区",//该地区名称
        // }
        // ]
    } )
    . catch ( ( err ) => {
        console . log ( err )
    } )

SearchCodEdetail

الوصف: احصل على معلومات مفصلة حول منطقة واحدة: رمز المنطقة ، خطوط الطول والعرض ، الاسم ، اسم 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 )
    } )

التفاصيل

ملاحظة: إذا تم تمكينها ، فسيتم إرجاع معلومات العنوان التفصيلي في بيانات الإرجاع الأصلية. 

 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 )
    } )
يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل