عند تشغيل مقاطع الفيديو تحت WeChat في iOS و Android ، ستواجه الكثير من المشكلات. .
الحل: أضف بعض السمات إلى الفيديو واتصل بالفيديو الأصلي H5.<معرف الفيديو = videoall src = video/01.mp4 poster = images/1.jpg/*视频封面*/preload = auto webkit-playsinline = true/*这个属性是 iOS 10 中设置可以让视频在小窗内播放، هذا هو ، هل هو تشغيل مشغل كامل الشاشة* / playsInline = true /* iOS WeChat Browser يدعم تشغيل النافذة الصغيرة* / x -webkit-airplay = السماح بـ x5-vide-player-type = h5 /* h5 ، وهو مشغل ، وهو أمر ميزة WeChat Android. القيمة هي الشاشة الرأسية*/ النمط = الكائنالملصق = الصور/1.jpg: الصورة المعروضة عندما تحدد السمة تنزيل الفيديو ، أو الصورة المعروضة أمام المستخدم انقر فوق زر التشغيل. إذا لم يتم تعيين هذه السمة ، فاستخدم الإطار الأول للفيديو بدلاً من ذلك. preload = auto: السمة تحدد الفيديو بعد تحميل الصفحة. webkit-playsinline和playsinline：视频播放时局域播放，不脱离文档流。 ولكن هذه السمة أكثر خصوصية. بمعنى آخر ، إذا لم يتم تعيين التطبيق ، فإن هذه التسمية غير فعالة على صفحتك.
من الضروري إضافة هنا. need because the full screen is default.但这时候全屏是有播放控件的，无论你有没有设置control。 يمكن استخدام البث المباشر للبث المباشر ، ولكن لا يلزم الحاجة إلى H5 الشاشة الكاملة ، وبالتالي فإن التحكم في عنصر التحكم أثناء التشغيل بملء الشاشة يتطلب الإعدادات التالية: نفس تشغيل الطبقة.
X-Webkit-Airplay = لا يمكن أن تعرف دورها تمامًا في الوقت الحالي ، لكن Xiaobian تتوقع أن هذه السمة يجب أن تجعل وظيفة AirPlay الخاصة بـ IOS. يمكن استخدام AirPlay تشغيل مقاطع الفيديو والموسيقى وملفات الصور مباشرة من مواقع مختلفة على جهاز iOS. يدعم التشغيل أيضًا الوظائف المقابلة. X5-Video-Player-type: تمكين نفس مشغل الطبقة H5 ، أي عندما يتم تقديم الشاشة الكاملة للفيديو على طبقة الفيديو ، والتي تعد أيضًا سمة فريدة لإصدار WeChat Android. يُطلق على الأسماء المستعارة على نفس الطبقة تشغيلًا غامضًا.目前的同层播放器只在Android（包括微信）上生效，暂时不支持iOS。 أما السبب في أن تشغيل الطبقة نفسها مفتوحة فقط لنظام Android ، لأنه لا يمكن تشغيل Android مثل ISO ، فإن الكامل الافتراضي سيؤدي إلى حظر بعض عمليات الواجهة. same layer at this time solves this problem. ومع ذلك ، أثناء الاختبار ، وجد أن إصدارات مختلفة من آثار ISO و Android كانت مختلفة قليلاً. X5-video-orivation: DECRARS الاتجاه المدعوم من اللاعب ، الشاشة الأفقية ذات القيمة الاختيارية ، الشاشة الرأسية. القيمة الافتراضية تصور. يتم تشغيل كل من البث المباشر و H5 على الشاشة الكاملة بشكل عام ، لكن هذه السمة تتطلب من نوع X5-video-player لفتح وضع H5 X5-Video-Player-FullScreen: إعدادات ملء الشاشة. إنه يحتوي على قيمتان آخرتان للسمات ، ودعم Ture و False ، ويدعم عملية التشغيل الكاملة ذات الشاشة الكاملة ، ولا يدعم False التشغيل الكامل الشاشة.في الواقع ، فإن متصفح ISO WeChat هو جوهر Chrome ، ويتم دعم السمات ذات الصلة ، وهذا هو السبب في أن X5 لا يتم دعمه من نفس الطبقة. متصفح WeChat Android هو kernel x5.
هناك أيضًا مشكلة.
الحل: إضافة كائن: ملء النمط ؛ إذا كانت هناك حواف سوداء ، فإن حجم الفيديو غير مناسب.<div id = videoBox> <video id = videoall src = mp4.mp4 poster = 1.jpg preload = auto webkit-playsinline = true playSinline = true = السماح بـ x5-vide-player-type = h5 x5- video-player-fullscreen = true x5-video-orialitation = portrient style = object-fit: fill> </bideal> <div id = playcontr ()> </viv> </viv> <div id = video PlayContr ()> </viv> </viv>
*{Padding: 0 ؛ 100 ٪ خلفية : -40. 2. jpg); Background-siZe: Cover; Background-POSITION: TOP;} <script> var videoall = document.getElementById ('videoall') ، videoBox = document.getElementById ('videobox') ، btn = d ('btn') ، videond = document.getElementById ('videoend') ؛ .docmeentElement.clientwidth ؛ PrevingDefault () .indexof ('adr')> -1 ؛ IOS Terminal PlayContr () {if (iSandroid) {videoall.style.width = = block ؛ و function ()ما سبق هو حل HTML5 WeChat الكامل -التي قدمتها لك. شكرا جزيلا لدعمكم لموقع VEVB Wulin!