开发node桌面级应用工具:apk转化epub

本文涉及的产品
云解析 DNS,旗舰版 1个月
全局流量管理 GTM,标准版 1个月
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
简介:

随着苹果ibooks对国内的开放,最近接了个麻烦的需求:

把现有的APK转化支持苹果ibooks电子书的epub格式

  • apk,基本都知道就是安卓的应用程序
  • epub,是ibooks支持的电子书格式 (xhtml组成的静态多页面)

这apk与epub两个完全不是一个世界的东西,怎么能关联并转化?

因为我司产出的APK应用是通过phonegap打包的SPA应用,这也是一套黑科技,通过ppt批量生成应用,本质上还是web那一套,所以给epub转化提供契机

通过H5写应用已经流行几年了,这里也不多说了,如流行的phonegap国产appcan、APICloud和HBuilder之类的打包工具太多了,本质上基本差不都,如果没有接触的可以看看

这是一个APK

image

APK解压后的文件结构

image

其中assets就是web目录,其中还包含应用的sqlite数据库

image

很明显只有一个index的单面结构,现用就是需要把index单页面,分解成多个独立的静态页面,并且要符合xhtml语法规范

常规来说,这只是一个静态分析,应该简单。

但是这里我没有采用静态分析,原因不多说,跟项目的复杂度有关系,详情可以参考我的项目分享 Hybrid App应用制作与跨平台解决方案

 

我采用的是动态编译,简单来说,让浏览器自己解析

通过加载一个后台的Chromium来解析页面,然后直接提取出Chromium渲染后的最终HTML结构

如果只是这样解析,提取的只可能当前执行的页面部分,不可能是全部的页面结构

因此,依照静态编译的思路需要符合几点要求

  1. 单页面的入口index.html,能够根据传递参数自动加载不同的页面
  2. 数据库xxtebook.db能够通过算法分解到每一个独立的页面中,做成json的数据格式

考虑到最终是桌面级应用工具,我这里采用了node语言编写

当然用node的原因也是因为有神器node-webkit,可以把node打包成exe执行文件

 

具体的思路流程:

读取apk文件 =》改名rar =》解压后读取web目录

=》读出sqlite数据

=》根据数据创建基本页面 n*.xhtml多个

=》给生成的所有xhtml页面写入区分页面标记(因为apk中的web资源代码是共享的js/css/图片等等)

=》将所有ajax处理的资源转化成js格式(如 svg 读出数据写入js文件,静态访问直接加载这个脚本)

=》分解每个页面的数据sqlite数据,并写入到对应的xhtml中(数据库的数据需要分解成json写入对应的页面中)

=》启动web服务器

=》启动webkit,并加载每一个xhtml页面做分解,等待页面渲染拿到每个页面最终的静态结构

=》合并epub的标准文件结构,生成对应的规范

=》打包输出最终的epub文件

 

对比下单页面结构与多个xhtml静态文件

 

单页面SPA结构,通过JS生成DOM

通过JS动态渲染HTML结构,页面总入口都是同一个

image1

 

静态xhtml,DOM与数据静态化

image2

 

把一个index分解成多个xhtml页面,每个页面的js、css等资源代码都是共享的,所以需要在每一个页面写入不同的数据,用来区分页面

架设一个web服务端,通过http加载这些xhtml页面,通过浏览器解析就能得到最终独立xhtml的结构

由于执行代码做了接口处理,只要xhtml中传递不同的页码,代码就自动执行不同的页面,这样就能达到,不同的页面都有不同的解析结果

由于是node全自动操作,所以web与页面的解析都必须通过自动化工具处理,这里我用的是browser-syncphantomjs

通过phantomjs 解析后就能拿到浏览器渲染后的HTML结构了

 

遇到的问题:

解压丢失文件:node确实没有一个解压插件好使,最终用shell执行脚本命令,通过调用winrar软件处理

node-webkit不支持64位的sqlite3读取:这是因为nodejs和node-webkit的ABI不同,处理的办法就是重新编译64位的sqlite3,我估计很难成功,后来找了一款神器 sql.js直接数据库分解

phantomjs可以通过execFile调用,但是执行路径,是以node调用命名为根路径计算的

phantomjs加载页面,需要监听onResourceReceived事件,之后再获取数据,页面的完全渲染无法把控的,有请求,有JS绘制等等,必须有一个延时的等待

通过browser-sync做服务器,phantomjs获取的html的结构中会有__bs_script__这个注入节点,需要删除

通过browser-sync做服务器,background加载的url都会加上整个http跟地址,所以在最终数据中需要处理

 

打包运行的效果

GQGA$7U`@N@X(R}20Z}DSKW

UI有点丑。。。

如果有这方面需求,或者有啥疑问的,可以留言。。。。


本文转自艾伦 Aaron博客园博客,原文链接:http://www.cnblogs.com/aaronjs/p/4912316.html,如需转载请自行联系原作者

相关文章
|
11天前
|
JavaScript 前端开发 数据可视化
【01】Cocos游戏开发引擎从0开发一款游戏-cocos环境搭建以及配置-Cocos Creator软件系统下载安装-node环境-优雅草卓伊凡
【01】Cocos游戏开发引擎从0开发一款游戏-cocos环境搭建以及配置-Cocos Creator软件系统下载安装-node环境-优雅草卓伊凡
25 2
【01】Cocos游戏开发引擎从0开发一款游戏-cocos环境搭建以及配置-Cocos Creator软件系统下载安装-node环境-优雅草卓伊凡
|
25天前
|
数据采集 JavaScript Android开发
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
54 7
【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
|
2月前
|
前端开发 Java 开发工具
【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈 章节内容【03】
【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈 章节内容【03】
157 18
【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈 章节内容【03】
|
2月前
|
Dart 前端开发 Android开发
【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
43 1
【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
|
2月前
|
JavaScript 前端开发 jenkins
抛弃node和vscode,如何用记事本开发出一个完整的vue前端项目
本文探讨了在不依赖Node和VSCode的情况下,仅使用记事本和浏览器开发一个完整的Vue3前端项目的方法。通过CDN引入Vue、Vue Router、Element-UI等库,直接编写HTML文件实现页面功能,展示了前端开发的本质是生成HTML。虽然日常开发离不开现代工具,但掌握这种基础方法有助于快速实现想法或应对特殊环境限制。文章还介绍了如何用Node简单部署HTML文件到服务器,提供了一种高效、轻量的开发思路。
69 10
|
2月前
|
存储 资源调度 JavaScript
npm、cnpm 和 pnpm 是三种常用的 Node.js 包管理工具
npm、cnpm 和 pnpm 是三种常用的 Node.js 包管理工具。npm 是官方默认的包管理器,提供依赖管理、安装和更新等功能;cnpm 是由阿里巴巴开发的 npm 镜像,专为中国大陆用户优化,解决下载速度慢的问题;pnpm 通过硬链接技术提高安装速度并节省磁盘空间,特别适合磁盘资源紧张的环境。三者命令类似,但各有特色,开发者可根据需求选择合适的工具。
152 5
|
3月前
|
Web App开发 JavaScript 前端开发
Node.js开发
Node.js开发
89 13
|
4月前
|
存储 JavaScript 前端开发
深入浅出Node.js后端开发
在数字化时代的浪潮中,后端开发作为连接用户与数据的桥梁,扮演着至关重要的角色。本文将以Node.js为例,深入探讨其背后的哲学思想、核心特性以及在实际项目中的应用,旨在为读者揭示Node.js如何优雅地处理高并发请求,并通过实践案例加深理解。无论你是初学者还是有一定经验的开发者,这篇文章都将为你提供新的视角和思考。
|
4月前
|
Web App开发 开发框架 JavaScript
深入浅出Node.js后端开发
本文将带你领略Node.js的魅力,从基础概念到实践应用,一步步深入理解并掌握Node.js在后端开发中的运用。我们将通过实例学习如何搭建一个基本的Web服务,探讨Node.js的事件驱动和非阻塞I/O模型,以及如何利用其强大的生态系统进行高效的后端开发。无论你是前端开发者还是后端新手,这篇文章都会为你打开一扇通往全栈开发的大门。
|
3月前
|
Web App开发 JavaScript 前端开发
深入浅出Node.js后端开发
本文将带领读者从零基础开始,一步步深入到Node.js后端开发的精髓。我们将通过通俗易懂的语言和实际代码示例,探索Node.js的强大功能及其在现代Web开发中的应用。无论你是初学者还是有一定经验的开发者,这篇文章都将为你提供新的见解和技巧,让你的后端开发技能更上一层楼。

热门文章

最新文章

  • 1
    【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
    56
  • 2
    Android历史版本与APK文件结构
    170
  • 3
    Cocos2d-x 游戏开发-打包apk被默认自带了很多不必要的权限导致apk被报毒,如何在Cocos 2d-x中强制去掉不必要的权限-优雅草卓伊凡
    62
  • 4
    当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
    82
  • 5
    【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈 章节内容【03】
    157
  • 6
    【02】写一个注册页面以及配置打包选项打包安卓apk测试—开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
    43
  • 7
    apk安装包EXE,mis程序打包后报毒的正确处理方式-千万不要再人傻钱多被骗-真正的合法途径的处理方式才是正确的-apk安装包EXE,mis程序如何处理-优雅草央千澈
    76
  • 8
    使用Kivy创建“Hello World”应用并打包成APK
    443
  • 9
    使用keytool查看Android APK签名
    513
  • 10
    解决android apk安装后出现2个相同的应用图标
    456