【epub.js】开源中间件epub.js的使用及其中文api

epub.js在React中的应用与API详解

最新推荐文章于 2025-01-14 10:59:03 发布

转载

最新推荐文章于 2025-01-14 10:59:03 发布 · 2.5k 阅读

6 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/xiaozhaoqi/p/7819086.html

文章标签：

#java #javascript #xhtml #ViewUI

本文介绍了epub.js在Java Web和React环境中的使用，详细讲解了epub.js的API，包括EpubReader与epub.js的集成，以及如何打开图书、渲染、翻页、设置样式和管理事件等操作。

epub是最流行的电子书规范之一，网络上对于Java Web有不少合适的方法来解析和呈现，但是关于epub.js的介绍比较少（尽管github上已经2K星了），更多的是概念性的内容，如：

epub.js是支持跨多个设备的，在浏览器端渲染EPUB文件的JavaScript库，提供通用的电子书功能界面（如渲染、持久和分页）不需要开发专用的应用程序或插件。

具体用法因人而异，在此我介绍结合React使用的案例：

epub.js中间件封装了解析epub文件的过程，ePubReader以控制器方式封装了页面动作响应。

以下是epub.js的官方文档：

https://github.com/futurepress/epub.js/blob/master/documentation/README.md

2017.11.22更新：

如果使用ePubReader解析图书，还想应用epub.js的API，需要以这种形式：

var reader = ePubReader("./book/"+newsid);//获得解析图书的实例

reader.book.on("book:ready",function(){alert('1')});//拿到book变量，然后就能使用epub.js的API了

原因是在ePubReader的源码中：

ePubReader解析并没有像epub.js一样返回一个book对象，而是返回了reader对象，这个reader对象在上图蓝色标记处创建了自己的book对象，这个book对象又来自epub.js的Book对象，所以reader.book就是epub.js中的book了，拿到book以后其他用法和epub.js都一样了。

方法：

ePub(bookPath, options)

创建EPUB图书实例：

bookPath可选参数，指定epub文件路径，可以是网络资源，也可以是本地资源。

 
   var Book = ePub("url/to/book/"); // With default options
var Book = ePub({ restore: true }); 
Book.open("url/to/book/"); // Books can be opened later  
  

Options可选参数，配置解析参数

 
   {
  bookPath : null,
  version: 1, // Changing will cause stored Book information to be reloaded
  restore: false, // Skips parsing epub contents, loading from localstorage instead
  storage: false, // true (auto) or false (none) | override: 'ram', 'websqldatabase', 'indexeddb', 'filesystem'
  spreads: true, // Displays two columns
  fixedLayout : false, //-- Will turn off pagination
  styles : {},
  