文档章节

JS实现页面查看zip文件中的内容

xrkffgg
 xrkffgg
发布于 04/26 09:48
字数 382
阅读 1
收藏 0

1 前言

1.1 业务场景

附件zip上传到服务器后,在页面中可直接查看zip中的文件内容,如:readme.txt。

2 实现原理

2.1 引入工具库

jszip、jszip-utils

npm i jszip -S

npm i jszip-utils -S

2.2 查看txt中内容

// 查看
view(row){
    var JSZip = require("jszip")
    var JSZipUtils = require("jszip-utils")
    let that = this

    JSZipUtils.getBinaryContent(row.downloadPath, function(err, data) {
        if(err) {
            throw err; 
        }
        JSZip.loadAsync(data).then(function (files) {
            files.files['readme.txt'].async("string").then(function(con){
            that.content = con
            that.dialog = true
            })
        })
    })
},

在vue中引入,其中在JSZipUtils使用中this的指向进行了重定向。

row.downloadPath是附件的下载地址,con是txt中内容。

readme.txt是要查看的文件名+后缀。

这里使用了input定义的v-model="content"来展示。

3 后记

感谢支持。若不足之处,欢迎大家指出,共勉。

如果觉得不错,记得 点赞 ,谢谢大家 😂

欢迎关注 我的: 【Github】【掘金】【简书】【CSDN】【OSCHINA】【SF】

这两个库都是关于JS处理压缩文件的,功能很多,目前只学到了一小点,更多功能还需再研究。

3.1 参考资料

本文章采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。

出处为:https://github.com/xrkffgg/Tools

© 著作权归作者所有

xrkffgg
粉丝 0
博文 7
码字总数 7021
作品 0
海淀
前端工程师
私信 提问
BigPipe 学习研究

文章转自:http://www.searchtb.com/2011/04/an-introduction-to-bigpipe.html 1. 技术背景 FaceBook页面加载技术 试想这样一个场景,一个经常访问的网站,每次打开它的页面都要要花费6 秒;...

红薯
2011/07/08
1K
3
ExtJS 5 beta 发布

ExtJS 5 beta 发布,此版本主要的新特性有:支持平板电脑和新主题;添加了新应用架构:MVVM。还有一些改进:改进了数据包,表单包和 Sencha 核心包等。 此版本现已提供下载: Download Ext J...

oschina
2014/04/04
6.2K
17
使用 Grails 与 jQuery 创建 Web Calendar

Grails 是一套用于快速 Web 应用开发的开源框架,它基于 Groovy 编程语言,并构建于 Spring、Hibernate 和其它标准 Java 框架之上,从而为大家带来一套能实现超高生产力的一站式框架。 jQue...

红薯
2010/06/25
1K
1
关于RunJS你不知道的几个事情

关于RunJS,一直没有一个好的教程或者文档来说明怎么使用,当然基本的使用就是编辑html、css、js代码并发布分享了。这里我要列出一些关于RunJS你不知道的几个tip。 收起左边栏:大家可以点击...

王振威
2012/11/12
5.1K
10
搭建Cocos2d-JS开发环境

使用Cocos2d-JS引擎开发游戏,主要的程序代码是JavaScript语言,因此,凡是能够开发JavaScript语言工具都适用于Cocos2d-JS游戏开发。本书我们推荐WebStorm和Cocos Code IDE工具。 搭建WebSt...

智捷课堂
2015/03/18
0
0

没有更多内容

加载失败,请刷新页面

加载更多

FPGA 设备 USB Platform Cable USB

lsusbFuture Technology Devices International, Ltd FT232H Single HS USB-UART/FIFO IC

MtrS
今天
4
0
lua web快速开发指南(6) - Cache、DB介绍

"数据库"与"缓存"的基本概念 数据库与缓存是服务端开发人员的必学知识点. 数据库 "数据库"是一种信息记录、存取的虚拟标记地点的集合统称. 比如现实生活中, 我们经常会用到文件柜、书桌等等数...

水果糖的小铺子
今天
6
0
Oracle分页查询语句的写法

Oracle分页查询语句的写法 Oracle分页查询语句使我们最常用的语句之一,下面就为您介绍的Oracle分页查询语句的用法,Oracle分页查询语句基本上可以按本文给出的格式来进行套用。   Oracle分...

康师傅
昨天
5
0
java并发图谱

1527
昨天
2
0
Mybatis之拦截器Interceptor

使用mybatis时用PageHelper进行分页,用到了PageInterceptor,借此了解下mybatis的interceptor。Mybatis的版本是3.4.6,MybatisHelper的版本是5.1.3。 1、PageInterceptor 先上一段代码,如下...

克虏伯
昨天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部