更新记录

1.6.0（2023-02-19）

  1. 移除废弃文档SDK API
  2. 修复API 29 PrivateClassLoader内核升级问题
  3. 修复一些稳定性问题
  4. Android 13支持
  5. TBSSDK版本号：44286

1.3.6（2022-05-24）

  • 更新TBS内核版本

1.3.3（2022-02-21）

X5内核改为离线内核

查看更多

平台兼容性

Android Android CPU类型 iOS
适用版本区间：5.0 - 12.0 armeabi-v7a：未测试，arm64-v8a：未测试，x86：未测试 适用版本区间：9 - 15

原生插件通用使用流程：

  1. 购买插件，选择该插件绑定的项目。
  2. 在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
  3. 根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
  4. 打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
  5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择

https://mp.weixin.qq.com/s/rmSa4Fs77MDdjFioRKwXPA

关于腾讯浏览服务内核SDK-内核文档能力调整公告

2023年4月13日零时起，内核文档能力正式下线

我们已经开发了腾讯浏览服务的插件

文档预览(腾讯TBS文档阅读器)

https://ext.dcloud.net.cn/plugin?id=11952

办公文档阅读器(离线TBS内核),支持docx、doc, xlsx, xls, pdf, pptx, txt等各种文档，自定义水印，离线内核，防截屏（只支持安卓），支持组件方式集成

1.6.0版本更新说明

1. 移除废弃文档SDK API 
2. 修复API 29 PrivateClassLoader内核升级问题
3. 修复一些稳定性问题
4. Android 13支持
5. TBSSDK版本号：44286

1.3.3版本更新说明

1.更新腾讯的tbs内核文件（旧内核文件无法打开文档）
2.修复安卓原生页面的ActionBar样式和其他插件产生冲突和覆盖，导致导航栏界面错乱。

1.3.2版本更新说明

1.X5内核改为离线内核。

1.3.1版本更新说明

1.增加插件OpenMode自定义方式打开文档（WPS插件）。
2.增加文档批注时修改用户名功能。
3.X5内核加载优化

使用方法

注意！在前导页面需要动态申请设备存储读写权限

引入插件：

var x5offline = uni.requireNativePlugin("YSCloud-OFFICE-DocPreviewModule")

1. 用原生页面打开文档

openReader() {
                var _this = this;
                x5offline.openReader(this.filePaths, {
                    x5url:'',                        //备用内核地址，当在线安装，本地安装都失败的情况下，下载备用内核进行安装。
                    enableshot: true,                //是否允许该页面被截屏,默认为true
                    navbar:{
                        background:'#EE468BF7',        //原生导航栏背景色
                        text:this.docTitle,            //导航栏标题栏文本
                        textcolor:'#FFFFFFFF',        //标题栏文本颜色
                        backtext:'返回'                //返回键文本，IOS无效，安卓有效
                    },
                    watermark:{
                        textsize:'22.0',            //水印字体大小
                        textcolor:'#FF000000',        //水印字体颜色
                        text:'优势智云',                //水印主文本
                        subtext:'张三',                //水印副文本
                        background:'#FFFFFF00'        //文档背景色    
                    }
                }, (ret)=>{
                    //plus.nativeUI.alert(JSON.stringify(ret));
                    console.log(JSON.stringify(ret));
                });
            }

2. 用vue页面嵌入组件的方式打开文档

<template>
    <view>
        <YSCloud-OFFICE-DocPreviewComponent ref="x5viewer" @readerLoaded="onReaderLoaded" :style="screenStyle">
        </YSCloud-OFFICE-DocPreviewComponent>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                configures: [],
                title:'',
                screenStyle:'width:750rpx;height:670px'
            }
        },
        onLoad() {
            //动态更新屏幕高度
            const info = uni.getSystemInfoSync();
            this.screenStyle = 'width:750rpx;height:'+ info.windowHeight + 'px'
        },
        methods: {

            onReaderLoaded:function(e) {
                uni.setNavigationBarTitle({
                    title:'文档详情'
                });
                var arg = uni.getStorageSync('data');
                // configures:{
                //    x5url:_this.coreUrl,          //内核备用地址
                //    enableshot:false,             //是否允许该页面被截屏
                //    watermark:{
                //      textsize:'22.0',            //水印字体大小
                //      textcolor:'#FF000000',      //水印字体颜色
                //      text:'优势智云',                //水印主文本
                //      subtext:'李四',               //水印副文本
                //      background:'#FFFFFF00'
                //    }     
                // }        
                this.$refs.x5viewer.show(arg.path, arg.configures);
            },
        }
    }
</script>

特别注意：

因为腾讯的tbs内核文件会定期迭代和更新，可能会导致app集成了之前旧版本内核文件，导致无法打开文档的情况。如果存在这样的情况，请联系我们，我们会同步更新最新的插件。

最新X5内核地址(2023年02月12日腾讯发布）：

https://tbstx.imtt.qq.com/others/release/x5/tbs_core_046239_20230210162827_nolog_fs_obfs_arm64-v8a_release.tbs

部分源码：

<template>
    <view class="page">
        <button type="primary" 
           @click="download('57b391bb-969f-4201-bebf-6b2c9e23cb29.docx', '国家职业教育改革实施方案')">docx</button>
          <button type="primary" 
           @click="download('1a721cca-6c00-40a6-b6e3-352b6498405e.xlsx', '南山录取名单')">xlsx</button>
          <button type="primary" 
           @click="download('df566df9-79f0-4031-abf6-571733441afa.pptx', 'ppt演示文稿')">pptx</button>
          <button type="primary" 
           @click="download('69d3c3e7-44b0-4380-9e8e-3cb9ca7ad9f9.pdf', '2020年博士研究生拟录取名单')">pdf</button>
          <button type="primary" 
           @click="download('cf35a6b8-960a-4a1e-b48d-a38c34e6ab6c.txt', '纯文本文档')">txt</button>
          <view>文件路径{{filepath}}</view>
    </view>
</template>

<script>
    var x5offline = uni.requireNativePlugin("YSCloud-OFFICE-DocPreviewModule")
    export default {
        data() {
            return {
                docTitle:'',
                filepath: '',
                filePaths: '',
                coreAbsPath:'',
                coreAbsPaths:'',
                coreDownloadPaths:'',
                coreUrl:'https://tbstx.imtt.qq.com/others/release/x5/tbs_core_046239_20230210162827_nolog_fs_obfs_arm64-v8a_release.tbs',
                docUrl:'',
                filetemp:'',
                list: [{
                    id: 'ext-module',
                    name: '扩展 module',
                    open: false,
                    url: 'pages/sample/ext-module'
                },
                {
                    id: 'ext-component',
                    name: '扩展 component',
                    open: true,
                    url: '/pages/index/plugin_x5reader_offline_component'
                }],
            }
        },
        onLoad() {
            console.log("onLoad");
            var _this = this;
            plus.io.requestFileSystem(plus.io.PUBLIC_DOWNLOADS, function( fs ) {
                    _this.coreDownloadPaths = fs.root.fullPath + "x5.tbs.apk";
                    console.log("coreDownloadPaths:" + _this.coreDownloadPaths);
            }, function ( e ) {
                    alert( "Request file system failed: " + e.message );
            });
        },
        methods: {
            showWaiting(){
                const wait = plus.nativeUI.showWaiting("请稍候...", {
                    height:"100px",
                    width:"140px",
                    loading:{
                        type:"snow"
                    }
                });
            },

            download(url, title) {
                var _this = this;
                uni.showLoading({
                    title: "文件下载中"
                });

                _this.docUrl = 'https://www.yszyun.com/file/extfile/' + url;
                const downloadTask = uni.downloadFile({
                    url: _this.docUrl,
                    success: (res) => {
                        if (res.statusCode === 200) {
                            console.log("下载成功 res res.tempFilePath:" + JSON.stringify(res));
                            _this.filepath = res.tempFilePath
                            _this.filePaths = plus.io.convertLocalFileSystemURL(res.tempFilePath);
                            _this.docTitle = title;
                            console.log("下载成功 res res.filePaths:" + _this.filePaths);
                            uni.hideLoading();
                            uni.showActionSheet({
                                itemList: [
                                    '用原生页面展示', 
                                    '用自定义组件展示', 
                                ],
                                success: function (res) {
                                    console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
                                    switch(res.tapIndex){
                                        case 0:
                                            _this.openReaderWindow();
                                            break;
                                        case 1:
                                            let data = {
                                               path: _this.filePaths,       //文档路径
                                               navtitle:_this.docTitle,     //导航栏标题
                                               configures:{
                                                   x5url:_this.coreUrl,         //内核备用地址
                                                   enableshot:false,            //是否允许该页面被截屏
                                                   watermark:{
                                                        textsize:'22.0',            //水印字体大小
                                                        textcolor:'#FF000000',      //水印字体颜色
                                                        text:'优势智云',                //水印主文本
                                                        subtext:'李四',               //水印副文本
                                                        background:'#FFFFFF00'
                                                   }        
                                                }           
                                            };
                                            uni.setStorage({
                                              key: 'data',
                                              data: data
                                            }).then(res => {
                                                console.log(_this.list[1].url);
                                                _this.list[1].name = _this.docTitle;
                                                uni.navigateTo({
                                                    url:_this.list[1].url
                                                })
                                            });
                                            break;
                                    }
                                },
                                fail: function (res) {
                                    console.log(res.errMsg);
                                }
                            });
                        }
                    }
                });

                downloadTask.onProgressUpdate((res) => {
                    console.log('下载进度' + res.progress);
                    console.log('已经下载的数据长度' + res.totalBytesWritten);
                    console.log('预期需要下载的数据总长度' + res.totalBytesExpectedToWrite);

                });
            },

            openReaderWindow() {
                var _this = this;
                x5offline.openReader(this.filePaths, {
                    //备用内核地址，当在线安装，本地安装都失败的情况下，下载备用内核进行安装。
                    x5url: _this.coreUrl,
                    enableshot: false,              //是否允许该页面被截屏,默认为true
                    navbar:{
                        background:'#EE468BF7',     //原生导航栏背景色
                        text:this.docTitle,         //导航栏标题栏文本
                        textcolor:'#FFFFFFFF',      //标题栏文本颜色
                        backtext:'返回'               //返回键文本，IOS无效，安卓有效
                    },
                    watermark:{
                        textsize:'22.0',            //水印字体大小
                        textcolor:'#FF000000',      //水印字体颜色
                        text:'优势智云',                //水印主文本
                        subtext:'张三',               //水印副文本
                        background:'#FFFFFF00'      //文档背景色 
                    }
                }, (ret)=>{
                    //plus.nativeUI.alert(JSON.stringify(ret));
                    console.log(JSON.stringify(ret));
                });
            }
        }  
    }
</script>

<style>
    button {
        margin: 50rpx 30rpx;
    }
</style>

预览效果

  1. 用原生页面打开效果

  2. 用vue页面嵌入文档组件的方式打开效果

  3. 完整演示gif动画

  4. 安卓版demo apk下载

扫码添加技术微信支持，备注说明对应的插件名称

咨询电话： 400-008-1668 邮箱：marketing@yszyun.com

隐私、权限声明

1. 本插件需要申请的系统权限列表：

存储，设备信息

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

插件自身不采集任何数据，插件使用的腾讯浏览服务SDK采集数据，请参考其官方说明：https://x5.tencent.com/docs/privacy.html

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

评论列表 撰写评论 向官方投诉
加载更多...
插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...