【玩转腾讯云】腾讯云云函数结合金山文档打造轻量级office在线预览服务

本文介绍下如何使用云函数来实现office办公文件的预览

前言

曾几何时，文档预览曾经很麻烦，小公司需要购买服务器，自行搭建文件服务器来满足产品的文件预览需求，用户上传的文件经由后端进行转码之后才能预览，技术团队需要搭建文件存储服务及转码服务才能实现基础功能，我司曾经就是这么做的。

虽然有公开的微软office预览服务以及kkfileview等实现方案，但仍然存在诸多问题，比如微软office预览的大小限制，kk的略微繁重。

难道如果我只是想要一个轻量级的文档服务就那么难吗？No、No、No，之前一直在关注腾讯云云函数，也在不停基于云函数探索有意思的功能来满足平时的开发需求，前段时间正好公司项目需要用到金山的服务做文件预览，使用效果还可以，那么灵感来了，为什么不能将两个大佬的能力结合一下？说干就干，腾讯云云函数和金山的文档的整合，我看行。

探讨可行性

首先问题的关键在于通过后端服务去获取预览地址并通过一个网页去承载金山的预览服务，幸运的是这些都可以通过云函数做到，首先云函数是支持nodeJS编写的，所以我们只要使用nodejs去请求金山的接口获取预览地址，然后通过设置函数返回类型为网页就可以将预览地址嵌入函数返回的iframe中来实现预览功能，是不是很简单易用。

talk is cheap，show me the code.下面我们来践行一下吧~

云函数编写

'use strict';
const rp = require('request-promise')
const officeBaseUrl = '私有服务端?fileUrl='
exports.main = async (event, context) => {
    let fileUrl = 'http://默认下载的预览文件地址.doc'
    let param = {}
    if (event.queryStringParameters) {
        param = { ...event.queryStringParameters }
    } else {
        param = { ...event }
    }
    if (param.url) {
        fileUrl = param.url
    }
    let previewRes = await rp({ url: officeBaseUrl + fileUrl })
    previewRes = JSON.parse(previewRes)
    return {
        statusCode: 200,
        headers: {
            "content-type": "text/html"
        },
        body: `<script>location.replace("${previewRes.data.wpsUrl}");</script>`
    }
}

问题记录

细心的同学会发现在云函数返回体部分在这里写的是一段js代码重定向到了一个url。这里之所以没有使用iframe去嵌入预览地址是因为会报获取token失败的错误，所以退而求其次采取了直接跳转到预览地址的方式来查看文件。

体验地址

http://tcb.xuedingmiao.com/office_preview

参考资料

• 使用集成响应返回 HTML
• 金山文档在线预览编辑服务