当前位置:首页 > 技术分析 > 正文内容

离线资源的加密保护

ruisui883周前 (04-07)技术分析12

上次提到过工作中有个阅读器项目要做成离线版,其中涉及到离线资源的加密保护,需求如下:

1)产品为U盘形式,里面包含阅读器程序和课本资源两部分;

2)课本资源包括视频、音频、HTML5等格式,为了防止用户拷贝传播这些数据,考虑对它们资源进行加密以增加安全性;

3)课本资源整体是HTML5形式,首页是一个书本目录,下面包含很多单元,点击某个单元会跳转到对应的页面;

4)课本资源总体积好几G,每个单元约200多M,要支持远程对单个单元数据进行更新。

下文是为此设计的一个资源加密的粗简方案(毕竟不存在绝对的安全,所以这里并不追求加密的复杂性,仅仅只做个最基础的保护)。

环境:Windows

框架:Electron

语言:JS

资源加密,其实就是对正常文件进行破坏,只要用的时候有办法恢复就行。恢复的时候,避免将临时数据放到本地磁盘,以免被用户拷贝。

根据文件类型的不同,加密的方式和难度也不同。

一、视频音频

视频音频,破坏起来比较容易,可以用AES,或者对局部Buffer数据进行异或运算(参考微信DAT文件加密方式),往往稍微修改一点就可以导致其无法正常播放。

当阅读器播放音频视频的时候,首先读取到文件的Buffer数据(加密),然后对其进行解密得到新的Buffer数据,最后将其转换成blob地址并交给video标签或audio标签播放即可。

核心代码如下:

// 读取资源+解密+转换为URL
function res2url ({fileName, mimeType}) {
  if (!fileName) return Promise.resolve()
  if (fileName.includes('/')) {
    fileName = fileName.split('/').pop()
  }
  let filePath = path.join(resDir, fileName) // resDir资源目录,fileName文件名
  return new Promise((resolve, reject) => {
    fs.readFile(filePath, (err, data) => {
      if (err) {
        reject(err)
      } else {
        data = decrypt(data) // 解密
        let bufferData = new Uint8Array(data)
        let blobData = new Blob([bufferData], { type: mimeType })
        resolve(URL.createObjectURL(blobData))
      }
    })
  })
}

二、HTML5

H5资源,因为文件数量众多,单个加密解密耗时耗力,再结合资源目录结构,以及单元更新的需求,考虑设计方案如下:

1)将目录文件夹和单元文件夹分别打包成ZIP,再对每个ZIP包进行加密(加密方式不能只修改局部Buffer,这样只会对部分文件造成损坏);

2)当要更新单元数据时,替换掉相应的单元ZIP加密包即可;

3)当阅读器要使用H5时,首先用express启动一个WEB服务器,同时将课本目录ZIP解密并用Jszip装载,然后在阅读器中用iframe加载WEB服务器首页(比如访问index.html),服务器监听到请求后,从jszip对象中取出对应的文件返回即可;

4)当要访问某个单元时,根据地址可以判断出需要从哪个ZIP包中获取,然后读取该ZIP包并解密、用Jszip装载,然后将数据返回。

Demo示例如下:

Demo核心代码:

// 读取资源 + 解密 => jszip对象
loadZipItem (zipName) {
  let zipPath = this.zipPathDict[zipName] // ZIP文件路径
  let zipData = fs.readFileSync(zipPath) // ZIP文件数据
  zipData = this.decrypt(zipData) // 解密ZIP文件数据
  return JSZip.loadAsync(zipData).then((zip) => {
    zipDataDict[zipName] = zip // 保存jszip对象,方便后续调用
  })
},
// 根据请求地址path获取对应的jszip对象
async getZipData (_path) {
  let _arr = _path.split('/')
  // 默认返回入口ZIP文件
  if (_arr.length === 1 || !this.zipPathDict[_arr[0]]) { return zipDataDict['main'] }
  // 读取子ZIP文件,如果不存在则加载
  if (!zipDataDict[_arr[0]]) {
    await this.loadZipItem(_arr[0])
  }
  // 返回计算后的ZIP文件
  return zipDataDict[_arr[0]]
},
// 启动WEB服务
async serverStart () {
  let app = express()
  await this.loadZipItem('main') // 加载入口ZIP文件
  app.get('/:path(*)', async (req, res) => {
    let _path = req.params.path
    if (this.zipChildPathPrefix && _path.indexOf(this.zipChildPathPrefix) === 0) {
      _path = _path.substring(this.zipChildPathPrefix.length)
    }
    let _zip = await this.getZipData(_path)
    let _file = _zip.file(_path)
    let _fileName = path.basename(_path)
    if (_file) {
      _file.async('nodebuffer').then((content) => {
        res.type(_fileName)
        res.send(content)
      }).catch((err) => {
        res.status(500).send('读取文件内容时出错')
      })
    } else {
      res.status(404).send('文件未找到')
    }
  })
  app.listen(this.port, () => {
    this.result += `服务器运行在 http://localhost:${this.port}` + '\n'
  })
}

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/3325.html

标签: readfilesync
分享给朋友:

“离线资源的加密保护” 的相关文章

车辆费用统计管理系统

车辆费用统计管理系统headerfooter《车辆费用统计管理系统》是一款适用于中小型货运车辆管理公司统计车辆费用。主要包括车辆信息,费用管理,汇总统计等功能。本管理系统多处具有快速辅助录入功能,操作简单,易学、易用;处理功能高效强大,是协助您的好帮手!主要功能:1.基础设置:车辆档案、驾驶员信息2...

7种超轻量级的Linux发行版,能够帮助你找到适合自己的操作系统

Linux是一种非常受欢迎的开源操作系统,而且有许多版本可以选择。有时候,你需要一种超轻量级的Linux发行版,它可以在资源有限的设备上运行,并且能够快速启动。本文将介绍7种超轻量级的Linux发行版,希望能够帮助你找到适合自己的操作系统。1. Tiny Core LinuxTiny Core Li...

vue3父子组件传对象,子组件访问修改父组件对象中的属性值

在Vue 3中,父子组件之间的数据传输通常通过props和emit进行。父组件可以通过props向下传递数据给子组件,子组件则可以通过emit向上通知父组件更新数据。如果需要在子组件中修改父组件对象中的属性值,可以使用一个名为ref的Vue 3新特性。以下是一个示例,演示了如何在Vue 3中实现父子...

vue中如何在自定义组件上使用v-model和.sync

自定义事件tips推荐始终使用 kebab-case 的事件名。(v-on会将事件名自动转换为小写,避免匹配不到)changeData ×change-data √自定义组件的v-model用法:父组件定义数据源(不需要定义修改数据的方法),在子组件标签上通过v-model="data...

代码分支规范

一.gitflow工作流说明:主分支:master,稳定版本代码分支,对外可以随时编译发布的分支,不允许直接Push代码,只能请求合并(pull request),且只接受hotfix、release分支的代码合并。gitlab上做限制。热修复分支:hotfix,针对现场紧急问题、bug修复的代码分...

HTML5+眼球追踪?黑科技颠覆传统手机体验

今天,iH5工具推出一个新的神秘功能——眼动追踪,可以通过摄像头捕捉观众眼球活动!为了给大家具体演示该功能的使用,我做了一个案例,供大家参考。实际效果如下:案例比较简单,就是通过眼动功能获取视觉焦点位置,剔除用户看中的牌。现在,舞台的属性中多了一个“启用眼动”的选项,另外,还多了一个“启用摄像头”的...