uniapp微信小程序在web-view嵌入的uniapp H5页面中预览word文件

在小程序中预览文件可以使用uni.uploadFile下载后再uni.openDocument打开预览，但uni.openDocument API是不支持H5的，这时候可能会想到使用微软在线预览，但是实际出来的效果会存在各种兼容性问题。因此我们需要在h5页面中跳回小程序然后走小程序的预览文件逻辑。

//预览按钮的方法
preview(url,name,type){
    // #ifdef H5
    if(["pdf","ppt", "pptx", "doc", "docx", "xls", "xlsx","txt"].includes(type)){
        jWeixin.miniProgram.navigateTo({
            url:'/pages/webview/preview?url='+url//这里就是跳回小程序的页面路由，随意
        })
    }else if(["jpg", "png","jpeg"].includes(type)){
        let arr = []
        arr[0] =url
        uni.previewImage({
            current: 0,
            urls: arr,
            longPressActions: {
                itemList: ['发送给朋友', '保存图片', '收藏'],
                success: function(data) {},
                fail: function(err) {
                    console.log(err.errMsg);
                }
            }
        });
    }else{
        uni.showToast({
            title:'不可预览',
            icon:'none'
        })
    }
    // #endif
},

//在小程序的preview路由中
<template>
    <view class="container">
        <web-view></web-view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                finish:false
            }
        },
        onLoad(e) {
            var that=this
            if(e.url){
                // 先重置
                that.finish=false
                uni.downloadFile({
                    url:e.url,
                    success: (res) => {
                        var temp=res.tempFilePath
                        setTimeout(()=>{
                            uni.openDocument({
                                filePath:temp,
                                showMenu:true,
                                success() {
                                    that.finish=true
                                    console.log(that.finish);
                                }
                            })
                        },0)
                    }
                })
            }
        },
        
        onShow() {
            if(this.finish){
                uni.navigateBack({
                    delta:1,//返回层数，2则上上页
                })
            }
        },
        methods: {
            
        }
    }
</script>

<style lang="scss">
.container {
        width: 100%;
        height: 100vh;
}
</style>