كيفية استدعاء التطبيق في HTML5

من الشائع أن يثير h5 هذه الحاجة في التطبيقات. في عصر أصبح فيه الهاتف المحمول هو الملك، يلعب h5 دورًا مهمًا في تحويل حركة مرور التطبيق.

طريقة الاستدعاء التي نستخدمها حاليًا هي مخطط url (مدعوم من نظامي iOS وAndroid). ما عليك سوى تسجيل المخطط أثناء تطوير التطبيق الأصلي، وبعد ذلك عندما ينقر المستخدم على هذا الرابط، سينتقل تلقائيًا إلى التطبيق.

com.iframe

 var last = Date.now(), doc = window.document, ifr = doc.createElement('iframe');// أنشئ إطار iframe مخفي ifr.src = أصليUrl;ifr.style.cssText = 'display:none;border :0;width:0;height:0;';doc.body.appendChild(ifr);setTimeout(function() { doc.body.removeChild(ifr); //setTimeout أقل من 2000 يعد فشلًا في الاتصال بشكل عام if (Date.now() - last < 2000) { if (typeof onFail == 'function') { onFail() } else { // المطالبات المنبثقة أو معالجة التنزيل، وما إلى ذلك.} } else { if (typeof onSuccess == 'function') { onSuccess() } }}, 1000)؛

مبدأ استدعاء حل iframe هو: عندما يتحول البرنامج إلى الخلفية، سيتأخر المؤقت (حالة أخرى يكون فيها المؤقت غير دقيق). إذا تم تنشيط التطبيق، فستدخل صفحة الويب حتماً إلى الخلفية. إذا قام المستخدم بالتبديل مرة أخرى من التطبيق، فسيتجاوز الوقت بشكل عام ثانيتين؛ إذا لم يتم تنشيط التطبيق، فلن تدخل صفحة الويب في الخلفية بشكل أساسي الوقت، والوقت لن يتجاوز 2S.

window.location.href يقفز مباشرة

 window.location.href = originalUrl;

تثير العلامة

 <a href=nativeUrl>إبطال التطبيق</a>

اختبار المتصفح لثلاثة سيناريوهات للاستحضار

1. X يعني فشل الاستثارة، √ يعني أن الاستثارة كانت ناجحة.
2. تشير العلامة الحمراء إلى أنه سيتم استحضارها مباشرة بعد الدخول إلى الصفحة، وتشير العلامة الخضراء إلى أنه سيتم استحضارها بعد تشغيل الحدث يدويًا.
3. جهاز اختبار iOS: iPhone 6p؛ جهاز اختبار Android: Xiaomi 1s

يستحضر iframe نتائج اختبار التطبيق

يستحضر window.location.href نتائج اختبار التطبيق

تثير العلامة نتائج اختبار التطبيق

يثير iframe وwindow.location.href التباين

يثير iframe وwindow.location.href والعلامة المقارنة بين الثلاثة

أولاً، النماذج والمتصفحات التي تم اختبارها محدودة، والنتائج المذكورة أعلاه هي للإشارة فقط.

بمقارنة استدعاء iframe مع location.href، يمكننا العثور على ما يلي:

1. بالنسبة لنظام التشغيل iOS، يعد الانتقال location.href أكثر ملاءمة، لأن هذه الطريقة يمكنها استدعاء التطبيق في Safari بنجاح. وغني عن القول أهمية Safari باعتباره المتصفح الافتراضي لجهاز iPhone، ولكن بالنسبة لعملاء WeChat وQQ، فإن هاتين الطريقتين في iOS غير مجديتين==
2. بالنسبة لنظام التشغيل Android، عندما يتم استدعاء الصفحة مباشرة، يكون iframe وlocation.href متماثلين، ولكن إذا كان يعتمد على الحدث، فإن iframe يستحضر أفضل من location.href.
3. من خلال الاختبار، يمكن العثور على أنه بالنسبة للعديد من المتصفحات، يختلف أداء الاستدعاء المباشر عند الدخول إلى الصفحة والاستدعاء المستند إلى الحدث. ببساطة، يفشل الاستدعاء المباشر أكثر.

من خلال التحليل المقارن أعلاه، من الأفضل استخدام iframe لنظام Android وwindow.location.href لنظام iOS.

الفرق بين الاستحضار المباشر والاستحضار المبني على الحدث عند الدخول إلى الصفحة

هناك اختلافات واضحة بين هذين السيناريوهين للإثارة في Android، سواء تم استحضاره بواسطة iframe أو location.href، خذ كروم Xiaomi 1s كمثال:

 <a id=goApp href=javascript:void(0);>انقر فوقي لفتح التطبيق</a>

الأحداث الملزمة تدفع الاستحضار يدويًا:

 // تم استدعاء window.onload = function () { $('#goApp').on(click, function () { window.lib.callapp(nativeUrl);//iframe //window.location.href = originalUrl; });};

أدخل الصفحة للاستدعاء مباشرة:

 // فشل الاستدعاء window.onload = function () { window.lib.callapp(nativeUrl);//iframe //window.location.href = originalUrl;};

ربط الحدث، استحضار JS

 // فشل الاستدعاء window.onload = function () { $('#goApp').on(click, function () { window.lib.callapp(nativeUrl);//iframe //window.location.href = originalUrl; }); $('#goApp).trigger('click');};

في الأصل، اعتقدت أن طريقة $('#goApp).trigger('click'); كانت مماثلة للنقر اليدوي، ولكن الأداء الفعلي هو أن أداء الأحداث التي تم تشغيلها بواسطة js غير صالح مثل القفز المباشر للصفحة.

من منشور المدونة المرجعي، يمكننا أن نرى أن نظام Android الأساسي ومختلف الشركات المصنعة للتطبيقات مختلفون تمامًا، على سبيل المثال، لم يعد Chrome يدعم تشغيل نظام القفزات عبر js (نقرات غير المستخدم)، وتعيين عناوين iframe src، وما إلى ذلك من 25 و. فصاعدا. لذلك، لا يزال هناك فرق كبير بين تشغيل js ونقرات المستخدم المباشرة، والتي قد تكون مشابهة للقيود المفروضة على تشغيل الصوت.

بعد الاختبار والتحليل أعلاه، تم تحديد أنه من الأنسب استخدام window.location.href لنظام التشغيل iOS وiframe لنظام Android. عندما نستخدم iframe للاستحضار، فإننا عادةً ما نتعامل مع فشل الاستدعاء عن طريق التنزيل مباشرة، ومع ذلك، هناك مشكلة هنا، وهي أن المتصفح لا يمكنه اكتشاف ما إذا كان الاستدعاء ناجحًا، أي إذا عدت إلى المتصفح بعد ذلك تم الاستدعاء بنجاح، وسيظل المتصفح منبثقًا، كما أن تجربة تنزيل المعلومات سيئة للغاية. بالطبع، نحتاج أيضًا إلى التعامل مع بعض وظائف رد الاتصال الخاصة بالنجاح أو الفشل. ربما يحتاج السيناريو الخاص بنا فقط إلى الاستحضار ولا يتطلب التنزيل بعد الفشل.

فيما يتعلق باستخدام location.href لاستحضار التطبيق الأصلي على iPhone، قد تكون طريقة الانتقال إلى الصفحة المتوسطة أفضل من المعالجة المباشرة للصفحة الحالية.

ما ورد أعلاه هو المحتوى الكامل لهذه المقالة وآمل أن يكون مفيدًا لدراسة الجميع وآمل أيضًا أن يدعم الجميع شبكة VeVb Wulin.