不能用 pages/splash.vue + video 标签实现真正的 app 启动页视频广告,因冷启动时序中 vue 实例尚未初始化,video 组件无 dom 且无 autoplay 权限,倒计时错乱、广告回调丢失;正确方案是仅通过 uni-ad 原生体系配置开通并打包启用。

不能用 pages/splash.vue + <video></video> 实现真正的 App 启动页视频广告——这不是写法问题,而是原生启动阶段根本没 JS 运行环境,video 标签连 DOM 都没挂载上。
为什么 pages/splash.vue + video 标签在 App 端必然失败
App 冷启动时序是:系统加载原生启动图(splash.png)→ 启动 Activity/ViewController → 初始化 WebView → 才开始解析 Vue 页面。你写的 splash.vue 属于 Webview 层内容,此时 JS 引擎都还没 ready,video 组件不可能渲染、更不可能自动播放。
- iOS 会直接拦截带音视频的 autoplay,即使加了
muted和playsinline,首帧仍可能黑屏或跳原生全屏播放器 - Android 厂商 WebView(如华为、小米)普遍禁用无手势触发的
play(),调用直接抛DOMException: play() failed - 倒计时用 JS 实现?App 切后台再切回,
setTimeout会被挂起,倒计时错乱、跳转失效 - 广告点击跳转、曝光回调、计费上报全部丢失——因为这些必须由原生 SDK 触发,JS 层无法满足广告联盟合规要求
正确路径:只走 uni-ad 开屏广告体系
真正能过审、能计费、能稳定展示的方案,是完全绕开 Vue 页面,让 DCloud 原生层接管整个开屏流程。你不需要写任何广告 JS 代码,也不用改 pages/splash.vue。
- 必须在
uni-ad后台完成实名认证,并开通「App 开屏广告」开关(不是仅“已开通”状态,要确认渠道 SDK 审核通过) -
manifest.json→ 「模块权限配置」→ 勾选「Ad(广告模块)」,否则原生层根本不加载 SDK - HBuilderX 打包时,在「发行 → 原生 App-云打包」中勾选对应广告渠道(如优量汇 Android、穿山甲 iOS)
- 广告素材、跳过按钮样式、倒计时文案、落地页链接,全部在
uni-ad后台配置,实时生效,无需发版 - 真机调试时,打开 HBuilderX 控制台日志,搜索
adSplash或fullScreenAd,看到[ad] splash ad loaded: true才算真正就绪
如果非要自定义视频页(非广告用途),必须用 nvue + 手动控制
比如引导页、品牌片等非广告类启动视频,可接受体验折损和平台限制,那只能退而求其次:禁用原生启动图,用 nvue 全屏页模拟,并手动管理播放生命周期。
- 在
pages.json中设"splashscreen": { "autoclose": false, "alwaysShowBeforeRender": false },并确保该视频页是"list"第一项 - 页面必须是
nvue(不是vue),使用原生video组件,autoplay属性无效,必须在onLoad中用this.$nextTick(() => this.videoRef.play()) - 视频资源建议提前缓存:
uni.downloadFile下载到uni.env.USER_DATA_PATH,再用本地路径播放,避免首帧空白 - Android 上视频编码必须为 H.264 + AAC,iOS 避免 HEVC;分辨率不超 720p,码率 ≤1500kbps,否则低端机首帧 >500ms
- 用户点跳过时,必须同步调用
this.videoRef.pause()和this.videoRef.seek(0),否则切后台再切回可能崩溃(错误含MediaPlayer not in valid state)
真正卡住大多数人的,不是技术实现,而是混淆了「广告开屏」和「自定义视频页」两种场景。前者必须走 uni-ad 原生体系,后者才轮到你折腾 nvue 生命周期和编解码兼容性——选错路径,所有代码都是白写。











