分享自己写的网页文件处理脚本,可以批量将html, js和css压缩并转成二进制数组

2019-10-16 02:34发布

本帖最后由 zc123 于 2016-12-12 13:55 编辑

  嵌入式web服务器不同于传统服务器,web需要转换成数组格式保存在flash中,才方便lwip网络接口的调用,最近因为业务需求,需要频繁修改网页,每次的压缩和转换就是个很繁琐的过程,因此我就有了利用所掌握的知识,利用python编写个能够批量处理网页文件,压缩并转换成数组的脚本。
  脚本运行背景(后续版本兼容):
      Python 3.5.1(下载、安装、配置请参考网上教程)
      node.js v4.4.7, 安装uglifyjs管理包,支持js文件非文本压缩
      uglifyjs 用来压缩JS文件的引擎,具体安装可参考http://www.zhangxinxu.com/wordpress/2013/01/uglifyjs-compress-js/
      具体实现代码如下:[mw_shl_code=python,true]#/usr/bin/python
#/usr/bin/python
import os
import binascii
import shutil
from functools import partial
import gzip

#创建一个新文件夹
def mkdir(path):
    path=path.strip()
    isExists=os.path.exists(path)

    #判断文件夹是否存在,不存在则创建
    if not isExists:
        os.makedirs(path)
        print(path+' 创建成功')
    else:
        pass
    return path

#删除一个文件夹(包含内部所有文件)
def deldir(path):
    path = path.strip()

    isExists=os.path.exists(path)

    #判断文件夹是否存在,不存在则创建
    if isExists:
        shutil.rmtree(path)
        print(path + "删除成功")
    else:
        pass

#网页一次压缩文件
def FileReduce(inpath, outpath):
        infp = open(inpath, "r", encoding="utf-8")
        outfp = open(outpath, "w", encoding="utf-8")
        for li in infp.readlines():
            if li.split():
                #去除多余的
                li = li.replace(' ', '').replace(' ', '');
                #空格只保留一个
                li = ' '.join(li.split())
                outfp.writelines(li)
        infp.close()
        outfp.close()
        print(outpath+" 压缩成功")

#shell命令行调用(用ugllifyjs来压缩js文件)
def ShellReduce(inpath, outpath):
    Command = "uglifyjs "+inpath+" -m -o "+outpath
    print(Command)
    os.system(Command)

#gzip压缩模块
def FileGzip(inpath, outpath):
    with open(inpath, 'rb') as plain_file:
        with gzip.open(outpath, 'wb') as zip_file:
            zip_file.writelines(plain_file)
    print(outpath+" gzip-压缩成功")

#将文件以二进制读取, 并转化成数组保存
def FileHex(inpath, outpath):
    i = 0
    count = 0
    a = ''
    inf = open(inpath, 'rb');
    outf = open(outpath, 'w')
    records = iter(partial(inf.read,1), b'')
    for r in records:
        r_int = int.from_bytes(r, byteorder='big')  
        a +=  hex(r_int) + ', '
        i += 1
        count += 1
        if i == 16:            
            a += ' '
            i = 0
    a = "const static char " + outpath.split('.')[-2].split('/')[-1] + "["+ str(count) +"]={ " + a + " } "
    outf.write(a)
    inf.close()
    outf.close()
    print(outpath + " 转换成数组成功")

#程序处理主函数
def WebProcess(path):
        #原网页 ..asic  
        #压缩网页 .. educe
        #gzip二次压缩 ..gzip
        #编译完成.c网页 ..programe
        BasicPath = path + "\basic"
        ProgramPath = path + "\program"
        GzipPath = path + "\gzip"
        ReducePath = path + "\reduce"
        #删除原文件夹,再创建新文件夹
        deldir(ProgramPath)
        deldir(ReducePath)
        deldir(GzipPath)
        mkdir(ProgramPath)

        for root, dirs, files in os.walk(BasicPath):
                for item in files:
                        ext = item.split('.')
                        InFilePath = root + "/" + item
                        OutReducePath = mkdir(root.replace("basic", "reduce")) + "/" + item
                        OutGzipPath = mkdir(root.replace("basic", "gzip"))  + "/" + item + '.gz'
                        OutProgramPath = ProgramPath + "/" + item.replace('.', '_') + '.c'

                        #根据后缀不同进行相应处理
                        #html/css 去除' ',' ', 空格字符保留1个
                        #js 调用uglifyjs2进行压缩
                        #gif jpg ico 直接拷贝
                        #其它 直接拷贝
                        #除其它外,剩余文件同时转化成16进制数组, 保存为.c文件
                        if ext[-1] in ["html", "css"]:
                            FileReduce(InFilePath, OutReducePath)
                            FileGzip(OutReducePath, OutGzipPath)
                            FileHex(OutGzipPath, OutProgramPath)
                        elif ext[-1] in ["js"]:
                            ShellReduce(InFilePath, OutReducePath)
                            FileGzip(OutReducePath, OutGzipPath)
                            FileHex(OutGzipPath, OutProgramPath)
                        elif ext[-1] in ["gif", "jpg", "ico"]:
                            shutil.copy(InFilePath, OutReducePath)
                            FileGzip(OutReducePath, OutGzipPath)
                            FileHex(OutGzipPath, OutProgramPath)
                        else:
                            shutil.copy(InFilePath, OutReducePath)

#获得当前路径
path = os.path.split(os.path.realpath(__file__))[0];
WebProcess(path)[/mw_shl_code]
上述实现的原理主要包含:
     1.遍历待处理文件夹(路径为..asic,需要用户创建,并将处理文件复制到其中,并将脚本放置到该文件夹上一层)--WebProcess
     2.创建压缩页面文件夹(.. educe, 用于存储压缩后文件), 由脚本完成,处理动作:
    html, css: 删除文本中的多余空格,换行符
      js:调用uglifyjs进行压缩处理
      gif, jpg, ico和其它: 直接进行复制处理
    3.将压缩后文件调用gzip模块二次压缩, 生成.gz文件
    4.创建处理页面文件夹(..program, 用于存储压缩后文件), 由脚本完成,处理动作:
    以二进制模式读取文件,并转换成16进制字符串写入到该文件夹中
在文件夹下(shift+鼠标右键)启用windows命令行,并输入python web.py, 就可以通过循环重复这三个过程就可以完成所有文件的处理。
特别注意:所有处理的文件需要以utf-8格式存储,否则读取时会报"gbk"读取错误。
如果不想安装node和uglifyjs,下面修改为:
elif ext[-1] in ["gif", "js"]:
shutil.copy(InFilePath, OutReducePath)
filehex(OutReducePath, OutProgramPath)

详细代码和范例可在我的博客下方找到: http://www.cnblogs.com/zc110747/p/6160813.html
实际效果可参考附件, 经过二次压缩,实际大小还是有很明显的变化的。
友情提示: 此问题已得到解决,问题已经关闭,关闭后问题禁止继续编辑,回答。
该问题目前已经被作者或者管理员关闭, 无法添加新回复
9条回答
aozima
1楼-- · 2019-10-16 04:01
浏览器都支持gzip解压的,所以板子上面的文件可以再次gzip压缩,这样能再小些。
我们项目中如果网页文件要放内部FLASH,都这么做的。
zc123
2楼-- · 2019-10-16 05:49
本帖最后由 zc123 于 2016-12-12 12:55 编辑
aozima 发表于 2016-12-12 12:07
浏览器都支持gzip解压的,所以板子上面的文件可以再次gzip压缩,这样能再小些。
我们项目中如果网页文件要 ...

恩,python脚本也有gzip模块的,可以二次压缩的,不过上面代码里要添加些代码(我添加了后修改了下)
天空再浅唱
3楼-- · 2019-10-16 06:28
 精彩回答 2  元偷偷看……
enan
4楼-- · 2019-10-16 10:08
为什么要把WEB转成数组了保存在FLASH里?意义是什么?直接打开WEB文件然后发送不好吗?做个FTP还有可以直接远程更新网页,转成数组了改网页了得重新刷固件
zc123
5楼-- · 2019-10-16 11:34
本帖最后由 zc123 于 2016-12-13 10:30 编辑
enan 发表于 2016-12-12 23:32
为什么要把WEB转成数组了保存在FLASH里?意义是什么?直接打开WEB文件然后发送不好吗?做个FTP还有可以直接 ...
  因为我完成的工作项目带网页IAP更新固件的,转成数组后工程里替换编译下,通过网页刷固件更方便,其实修改下后端地址,更新网页也是没问题的,但这种转成数组的方式更方便些!
zc123
6楼-- · 2019-10-16 11:53
本帖最后由 zc123 于 2016-12-13 10:28 编辑

.......

一周热门 更多>