一行代码搞定react-native-webview 安卓无法播放h5视频问题

简介: 一行代码搞定react-native-webview 安卓无法播放h5视频问题

最近在开发APP功能的时候遇到一个问题,之前也没有遇到这样的需求所以也没有研究过。

功能是这样的:项目中有个webview 加载h5页面,h5页面中有视频播放,IOS端可以点开直接播放,并且有预览画面,而安卓端却没有这个预览画面,且不能直接播放。

一开始怀疑是Android的版本问题,一顿查阅发现并没有什么软用。最后还是在reactnative中文网重新仔细的查看了关于Webview的API,才找到解决方案。

如下图所示,只需要在webview中添加这个mixedContentMode属性就好,真的是一行代码搞定,哈哈

微信图片_20220609184218.png

代码中使用如下:

import { WebView } from 'react-native-webview';
        <WebView
          ref={view => (this.webview = view)}
          source={{ uri: url }}
          mixedContentMode={'compatibility'}
        />
目录
相关文章
|
1月前
|
Ubuntu 网络协议 Java
【Android平板编程】远程Ubuntu服务器code-server编程写代码
【Android平板编程】远程Ubuntu服务器code-server编程写代码
|
3月前
|
人工智能 IDE 开发工具
Studio Bot - 让 AI 帮我写 Android 代码
Studio Bot - 让 AI 帮我写 Android 代码
161 1
|
3月前
|
前端开发 JavaScript
使用 MobX 优化 React 代码
使用 MobX 优化 React 代码
34 0
|
4月前
|
Web App开发 移动开发 小程序
"项目中mpaas升级到10.2.3 适配Android 14之后 app中的H5以及小程序都访问不了,
"项目中mpaas升级到10.2.3 适配Android 14之后 app中的H5以及小程序都访问不了,显示“网络不给力,请稍后再试”,预发内网版本不能使用,线上版本可以正常使用,这个是什么原因啊,是某些参数没有配置吗,还是说是一些参数改错了?
59 2
|
2天前
|
Android开发 内存技术
Android 通过tinyalsa调试解决录制和播放音频问题
Android 通过tinyalsa调试解决录制和播放音频问题
20 1
|
1月前
|
前端开发 开发者
React Hooks:提升前端开发效率和代码可维护性
传统的 React 类组件在处理状态管理和生命周期函数时存在一些限制,而引入的 React Hooks 技术可以帮助前端开发者更高效地管理组件状态和逻辑,提升代码的可读性和可维护性。本文将介绍 React Hooks 的基本用法及其在实际项目中的应用场景。
|
2月前
|
XML Android开发 数据格式
安卓和webview交互
安卓和webview交互
25 0
|
2月前
|
Ubuntu 网络协议 Linux
【Linux】Android平板上远程连接Ubuntu服务器code-server进行代码开发
【Linux】Android平板上远程连接Ubuntu服务器code-server进行代码开发
57 0
|
3月前
|
存储 移动开发 JavaScript
比较H5开发与安卓开发
比较H5开发与安卓开发
65 2
|
3月前
|
安全 算法 JavaScript
安卓逆向 -- 关键代码定位与分析技术
安卓逆向 -- 关键代码定位与分析技术
42 0