playVideo 播放视频 APP开发使用X5内核腾讯X5内核打包APP

发表于2022年10月24日由yimen

用做网页的技术做APP！
一门提供标准化的jsbridge-mini.js库，您只需要在页面引用并执行JS即可实现各种原生APP、原生PC的功能能力。

==================APP端==================
【APP端】（安卓版&苹果版）目前提供200+原生功能，2000+JS映射接口，用做网站的技术即可实现各种原生APP能力、APP demo地址https://www.yimenapp.com/doc/demo.cshtml下载教程：
♦ JS-SDK 引用方式：
♦ 普通网页 script 方式加载：下载最新版，请在页面上调用 jsBridge 接口之前引用 jsbridge-mini.js 库；
♦ js module 方式引用：npm install ym-jsbridge 具体请参考 npm package

一门APP开发平台通用JS

核心代码示例，详情参阅demo

jsBridge.x5.playVideo("https://player.alicdn.com/video/editor.mp4", function(succ) {
  if (!succ) {
    alert("播放失败");
  }
});

A标签执行JS示例代码

<a href="javascript:void(0)" onclick="zhixing()">执行</a> 
<!-- 写入一个A标签href值为"javascript:void(0)"，定义点击事件onclick；-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接；-->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.playVideo("https://player.alicdn.com/video/editor.mp4", function(succ) {
  if (!succ) {
    alert("播放失败");
  }
});

}
</script>
<!--执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可；-->

按钮执行JS示例代码

<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮，定义点击执行事件； -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接； -->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.playVideo("https://player.alicdn.com/video/editor.mp4", function(succ) {
  if (!succ) {
    alert("播放失败");
  }
});

}
</script>
<!-- //执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可； -->

clearVideoCache 清除视频缓存 APP开发使用X5内核腾讯X5内核打包APP

发表于2022年10月24日由yimen

一门APP开发平台通用JS

clearVideoCache 清除视频缓存

核心代码示例，详情参阅demo

jsBridge.x5.clearVideoCache(function(){
  alert("视频缓存已清除");
});

A标签执行JS示例代码

<a href="javascript:void(0)" onclick="zhixing()">执行</a> 
<!-- 写入一个A标签href值为"javascript:void(0)"，定义点击事件onclick；-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接；-->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.clearVideoCache(function(){
  alert("视频缓存已清除");
});

}
</script>
<!--执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可；-->

按钮执行JS示例代码

<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮，定义点击执行事件； -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接； -->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.clearVideoCache(function(){
  alert("视频缓存已清除");
});

}
</script>
<!-- //执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可； -->

APP开发使用X5内核腾讯X5内核打包APP videoCacheSize 获取视频缓存大小

发表于2022年10月24日由yimen

一门APP开发平台通用JS

核心代码示例，详情参阅demo

jsBridge.x5.videoCacheSize(function(size) {
  var txt = size + "字节\n";
  txt += (size / 1024 / 1024.0).toFixed(2) + "MB";
  alert(txt);   
});

A标签执行JS示例代码

<a href="javascript:void(0)" onclick="zhixing()">执行</a> 
<!-- 写入一个A标签href值为"javascript:void(0)"，定义点击事件onclick；-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接；-->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.videoCacheSize(function(size) {
  var txt = size + "字节\n";
  txt += (size / 1024 / 1024.0).toFixed(2) + "MB";
  alert(txt);   
});

}
</script>
<!--执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可；-->

按钮执行JS示例代码

<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮，定义点击执行事件； -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接； -->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.videoCacheSize(function(size) {
  var txt = size + "字节\n";
  txt += (size / 1024 / 1024.0).toFixed(2) + "MB";
  alert(txt);   
});

}
</script>
<!-- //执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可； -->

APP开发使用X5内核腾讯X5内核打包APP setEnabledState 未设置

发表于2022年10月24日由yimen

一门APP开发平台通用JS

setEnabledState 未设置

核心代码示例，详情参阅demo

//未设置，恢复为 X5 功能配置里面的全局启停状态
jsBridge.x5.setEnabledState(-1, function() {
  alert("已设置，请重启APP。");
});

A标签执行JS示例代码

<a href="javascript:void(0)" onclick="zhixing()">执行</a> 
<!-- 写入一个A标签href值为"javascript:void(0)"，定义点击事件onclick；-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接；-->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
//未设置，恢复为 X5 功能配置里面的全局启停状态
jsBridge.x5.setEnabledState(-1, function() {
  alert("已设置，请重启APP。");
});
}
</script>
<!--执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可；-->

按钮执行JS示例代码

<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮，定义点击执行事件； -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接； -->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
//未设置，恢复为 X5 功能配置里面的全局启停状态
jsBridge.x5.setEnabledState(-1, function() {
  alert("已设置，请重启APP。");
});

}
</script>
<!-- //执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可； -->

APP开发使用X5内核腾讯X5内核打包APP setEnabledState 停用

发表于2022年10月24日由yimen

一门APP开发平台通用JS

核心代码示例，详情参阅demo

//停用
jsBridge.x5.setEnabledState(0, function() {
  alert("已设置，请重启APP。");
});

A标签执行JS示例代码

<a href="javascript:void(0)" onclick="zhixing()">执行</a> 
<!-- 写入一个A标签href值为"javascript:void(0)"，定义点击事件onclick；-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接；-->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
//停用
jsBridge.x5.setEnabledState(0, function() {
  alert("已设置，请重启APP。");
});

}
</script>
<!--执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可；-->

按钮执行JS示例代码

<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮，定义点击执行事件； -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接； -->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
//停用
jsBridge.x5.setEnabledState(0, function() {
  alert("已设置，请重启APP。");
});

}
</script>
<!-- //执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可； -->

APP开发使用X5内核腾讯X5内核打包APP setEnabledState 启用

发表于2022年10月24日由yimen

一门APP开发平台通用JS

setEnabledState 启用

核心代码示例，详情参阅demo

  //state 参数，数字类型，启用/停用状态
  //-1 未设置（使用打包平台上 x5 功能配置选项的全局启用/停用设置）
  // 0 停用
  // 1 启用
jsBridge.x5.setEnabledState(1, function() {
  alert("已设置，请重启APP。");
});

A标签执行JS示例代码

<a href="javascript:void(0)" onclick="zhixing()">执行</a> 
<!-- 写入一个A标签href值为"javascript:void(0)"，定义点击事件onclick；-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接；-->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
  //state 参数，数字类型，启用/停用状态
  //-1 未设置（使用打包平台上 x5 功能配置选项的全局启用/停用设置）
  // 0 停用
  // 1 启用
jsBridge.x5.setEnabledState(1, function() {
  alert("已设置，请重启APP。");
});

}
</script>
<!--执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可；-->

按钮执行JS示例代码

<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮，定义点击执行事件； -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接； -->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
  //state 参数，数字类型，启用/停用状态
  //-1 未设置（使用打包平台上 x5 功能配置选项的全局启用/停用设置）
  // 0 停用
  // 1 启用
jsBridge.x5.setEnabledState(1, function() {
  alert("已设置，请重启APP。");
});

}
</script>
<!-- //执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可； -->

APP开发使用X5内核腾讯X5内核打包APP getEnabledState 获取启用/停用状态

发表于2022年10月24日由yimen

一门APP开发平台通用JS

APP开发使用X5内核腾讯X5内核打包APP getEnabledState 获取启用/停用状态

核心代码示例，详情参阅demo

jsBridge.x5.getEnabledState(function(state){
  //state，数字类型，启用/停用状态
  //-1 未设置（使用打包平台上 x5 功能配置选项的全局启用/停用设置）
  // 0 停用
  // 1 启用
  alert(state);
});

A标签执行JS示例代码

<a href="javascript:void(0)" onclick="zhixing()">执行</a> 
<!-- 写入一个A标签href值为"javascript:void(0)"，定义点击事件onclick；-->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- 在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接；-->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.getEnabledState(function(state){
  //state，数字类型，启用/停用状态
  //-1 未设置（使用打包平台上 x5 功能配置选项的全局启用/停用设置）
  // 0 停用
  // 1 启用
  alert(state);
});

}
</script>
<!--执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可；-->

按钮执行JS示例代码

<button onclick="zhixing()" >执行</button>
<!-- //写一个按钮，定义点击执行事件； -->
<script src="您的服务器URL/jsbridge-mini.js"></script>
<!-- //在您的服务器引入一门JS地址，请下载jsbridge-mini.js上传您自己的服务器获取链接； -->
<script type="text/javascript">
function zhixing() {


<!--这里可以直接复制JS核心代码到此{}括号内-->
jsBridge.x5.getEnabledState(function(state){
  //state，数字类型，启用/停用状态
  //-1 未设置（使用打包平台上 x5 功能配置选项的全局启用/停用设置）
  // 0 停用
  // 1 启用
  alert(state);
});

}
</script>
<!-- //执行核心代码；
//如果需要进入页面就执行，去掉点击事件即可； -->

网站APP打包X5内核功能之后如何验证X5内核功能是否生效

发表于2022年4月21日由春哥

用户在一门APP打包平台选配了X5内核功能之后，发现和没有配置之前的效果是一样的，那么打包了X5内核功能如何才能在APP内验证该功能是否生效呢；

要查看APP内的X5内核功能是否生效有两个方法；

方法一：从页面的垂直滚动条来查看APP内的X5内核功能是否生效；

没有配置X5内核功能（X5内核功能未生效）的页面垂直滚动条如上图所示是比较粗短的；

已经配置X5内核功能（X5内核功能已生效）的页面垂直滚动条是比较细长的。

方法二：通过长按页面内文字的显示颜色来判断X5内核功能是否生效；

未配置X5内核功能（X5内核功能未生效）的APP，在APP内长按文字显示的颜色如上图；

已配置X5内核功能（X5内核功能已生效）的APP，在APP内长按文字显示的颜色如上图。

网站APP打包配置X5内核

发表于2022年4月21日由春哥

用户选用一门APP打包平台打包自己的移动应用，在打包的过程中是可以选配X5内核功能的，一门APP打包平台针对安卓端的用户接入了腾讯X5内核的SDK；

X5内核技术优势

其中，X5内核相对于系统webview，具有下述明显优势：

速度快：相比系统webview的网页打开速度有30+%的提升；
省流量：使用云端优化技术使流量节省20+%；
更安全：安全问题可以在24小时内修复；
更稳定：经过亿级用户的使用考验，CRASH率低于0.15%；
兼容好：无系统内核的碎片化问题，更少的兼容性问题；
体验优：支持夜间模式、适屏排版、字体设置等浏览增强功能；
功能全：在Html5、ES6上有更完整支持；
更强大：集成强大的视频播放器，支持视频格式远多于系统webview；
视频和文件格式的支持x5内核多于系统内核
防劫持是x5内核的一大亮点

其中，X5云端服务包括云加速、云安全、云转换三大功能。云加速是通过首屏加速、智能路由、图片压缩等技术保障网页浏览的快、省、悦；云安全是通过代理加密、URL安全检测、JS黑名单管理、负载监控等防范网页被劫持插入广告、保障网页浏览的安全稳定；云转换是使用URL聚合+XPATH的解决方案，解决移动阅读难题；

要在APP打包的过程中配置此功能，首选你需要登录一门APP打包平台的开发者中心；