خلال تطوير مشروع هذا العام ، تلامس في البداية مع تطوير الويب المحمول ، وتعلمت HTML5 أثناء التطوير. لقد استخدمت بشكل أساسي تقنية jQuery Mobile. لقد وجدت أن هذا غير مناسب لمنتجات الإنترنت. يجب إعادة كتابة معظم الأنماط ، ويتم استخدام بعض الوظائف فقط. أثناء تطوير شبكة الهاتف المحمول ، تعرضت لوظيفة تحديد المواقع لأول مرة. من خلال محركات البحث الرئيسية ، وجدت أن تحديد موقع الهاتف المحمول من خلال وضع المتصفح. عند استخدامه على متصفح الكمبيوتر ، فإن المطالبة "سواء لتمكين وظيفة تحديد المواقع" ستظهر لأول مرة. عندما رأى Boss هذه المطالبة ، شعر أن تجربة المستخدم لم تكن جيدة. إذا لم يكن الأمر جيدًا ، فسأقوم بتطبيقه بطريقة أخرى. هذه ليست مشكلة كبيرة. تغير وجه بوس بشكل كبير ، وقال: لا ينبغي أن تكون هناك تجربة مثل هذه. نقوم بذلك للاندفاع وإصدار ميزات جديدة في أقرب وقت ممكن.
1. طريقة تحديد موقع الهاتف المحمول:
نسخة الكود كما يلي:
var getLocation = function (successfunc ، errorfunc) {// successfunc يحصل على وظيفة رد الاتصال لتحديد المواقع الناجحة ، errorfunc يحصل على فشل رد الاتصال في وضع الاتصال
// اضبط المدينة الافتراضية أولاً
var defcity = {
المعرف: '000001' ،
الاسم: 'beijing' ،
التاريخ: curdatetime () // احصل على طريقة الوقت الحالية
} ؛
// المدينة الافتراضية
$ .cookie ('vpiao_mobile_defaultcity' ، json.stringify (defcity) ، {Expires: 1 ، path: '/'}) ؛
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition (الوظيفة (الموضع) {
var lat = position.coords.latitude ؛
var lon = position.coords.longitude ؛
// var map = new bmap.map ("Container") ؛ // إنشاء مثيل خريطة
var point = new bmap.point (lon ، lat) ؛ // إنشاء إحداثيات نقطة
var gc = new bmap.geocoder () ؛
GC.GetLocation (نقطة ، وظيفة (RS) {
var addcomp = rs.addressComponents ؛
var curcity = {
بطاقة تعريف: ''،
الاسم: addcomp.province ،
التاريخ: curdatetime ()
} ؛
// تقع حاليا المدينة
$ .cookie ('vpiao_mobile_currentcity' ، json.stringify (curcity) ، {Expires: 7 ، path: '/'}) ؛
//alert(addcomp.province + "،" + addcomp.city + "،" + addcomp.district + "،" + addcomp.street) ؛
إذا (Successfunc! = غير محدد)
SuccessFunc (addcomp) ؛
}) ؛
} ،
دالة (خطأ) {
التبديل (error.code) {
الحالة 1:
تنبيه ("خدمة الموقع رفضت.") ؛
استراحة؛
الحالة 2:
تنبيه ("لا يمكن الحصول على معلومات الموقع في الوقت الحالي.") ؛
استراحة؛
الحالة 3:
تنبيه ("الحصول على مهلة معلومات الموقع.") ؛
استراحة؛
تقصير:
تنبيه ("خطأ غير معروف.") ؛
استراحة؛
}
var curcity = {
المعرف: '000001' ،
الاسم: 'beijing' ،
التاريخ: curdatetime ()
} ؛
// المدينة الافتراضية
$ .cookie ('vpiao_mobile_defaultcity' ، json.stringify (curcity) ، {الانتهاء: 1 ، المسار: '/'}) ؛
إذا (errorfunc! = غير محدد)
errorfunc (خطأ) ؛
} ، {timeout: 5000 ، enablehighcancuracy: true}) ؛
} آخر {
تنبيه ("لا يدعم متصفحك الحصول على معلومات تحديد الموقع الجغرافي.") ؛
إذا (errorfunc! = غير محدد)
errorfunc ("لا يدعم متصفحك الحصول على معلومات تحديد الموقع الجغرافي.") ؛
}
} ؛
var showposition = function (position) {
var lat = position.coords.latitude ؛
var lon = position.coords.longitude ؛
// var map = new bmap.map ("Container") ؛ // إنشاء مثيل خريطة
var point = new bmap.point (lon ، lat) ؛ // إنشاء إحداثيات نقطة
var gc = new bmap.geocoder () ؛
GC.GetLocation (نقطة ، وظيفة (RS) {
var addcomp = rs.addressComponents ؛
var curcity = {
بطاقة تعريف: ''،
الاسم: addcomp.province ،
التاريخ: curdatetime ()
} ؛
// تقع حاليا المدينة
$ .cookie ('vpiao_mobile_currentcity' ، json.stringify (curcity) ، {Expires: 7 ، path: '/'}) ؛
//alert(addcomp.province + "،" + addcomp.city + "،" + addcomp.district + "،" + addcomp.street) ؛
}) ؛
} ؛
var showpositionerror = function (error) {
التبديل (error.code) {
الحالة 1:
تنبيه ("خدمة الموقع رفضت.") ؛
استراحة؛
الحالة 2:
تنبيه ("لا يمكن الحصول على معلومات الموقع في الوقت الحالي.") ؛
استراحة؛
الحالة 3:
تنبيه ("الحصول على مهلة معلومات الموقع.") ؛
استراحة؛
تقصير:
تنبيه ("خطأ غير معروف.") ؛
استراحة؛
}
var curcity = {
المعرف: '000001' ،
الاسم: 'beijing' ،
التاريخ: curdatetime ()
} ؛
// المدينة الافتراضية
$ .cookie ('vpiao_mobile_defaultcity' ، json.stringify (curcity) ، {الانتهاء: 1 ، المسار: '/'}) ؛
} ؛
المتطلب السابق هو تقديم API Baidu: <script src = "http://api.map.baidu.com/api؟v=1.4" type = "text/javaScript"> </script>
2. يقوم جانب الكمبيوتر بتنفيذ طريقة IP:
باستخدام الواجهة التي توفرها Tencent ، لم يعد هذا متاحًا
نسخة الكود كما يلي:
<script type = "text/javaScript" src = "http://fw.qq.com/ipaddress"> </script>
<script type = "text/javaScript">
document.write (ipdata [0]) ؛ // إظهار عنوان IP
document.write (ipdata [2]) ؛ // عرض حفظ
document.write (ipdata [3]) ؛ // أظهر المدينة
</script>
اعتماد واجهة sina: http://int.dpool.sina.com.cn/iplookup/iplookup.php؟format=js
طريقة اختبار Multi-Region: http://int.dpool.sina.com.cn/iplookup/iplookup.php؟format=js&ip=127.0.0.1
نسخة الكود كما يلي:
<script type = "text/javaScript">
$ .getScript ('http://int.dpool.sina.com.cn/iplookup/iplookup.php؟format=js' ، function (_result) {
if (remote_ip_info.ret == '1') {
ALERT ('Country:' + Remote_ip_info.country + '<br> المقاطعة:' + remote_ip_info.province + '<br> المدينة: remote_ip_info.type + '<br> الآخرين:' + remote_ip_info.desc) ؛
} آخر {
تنبيه ("لم يتم العثور على معلومات عنوان IP مطابقة!") ؛
}
}) ؛
</script>
واجهة عنوان IP الخاصة بـ Netease youdao (سيتم اختبار هذا)
http://www.youdao.com/smartresult-xml/search.s؟type=ip&q=ip العنوان
واجهة طلب تاوباو (الحصول)
نسخة الكود كما يلي:
<script>
var ip = "124.127.108.133" ؛
var url = "http://ip.taobao.com/service/getipinfo.php؟ip=" + ip ؛
$ .getjson (url ، function (json) {
var myprovince2 = json.data.area ؛
var mycity2 = json.data.region ؛
تنبيه ("مدينتك هي:" + myprovince2 + mycity2) ؛
}) ؛
</script>
واجهة API لمكتبة عنوان IP في المحيط الهادئ
http://whois.pconline.com.cn/؟ip= Budapip addrate string]
بالإضافة إلى ذلك: توفر Google و Sohu والواجهات الأخرى واجهات مقابلة ، يمكنك تجربتها بنفسك.
واجهة استعلام عنوان IP Sohu (GBK الافتراضي): http://pv.sohu.com/cityjson
واجهة استعلام عنوان IP Sohu (يمكن تعيين الترميز): http://pv.sohu.com/cityjson؟ie=utf-8
واجهة استعلام عنوان IP الأخرى من Sohu: http://txt.go.sohu.com/ip/soip
3. الحصول على طريقة IP العميل
نسخة الكود كما يلي:
<script>
var url = 'http://chaxun.1616.net/s.php؟type=ip&output=json&callback=؟&_=' + Math.Random () ؛
$ .getjson (url ، function (data) {
التنبيه (data.IP) ؛
}) ؛
</script>
هذا كل شيء اليوم. لا يزال هناك الكثير من العمل لإكماله. يمكنك تجربة واجهات أخرى عندما يكون لديك الوقت. الجميع مرحب بهم للحضور وتقديم طرق أفضل.