epub.js icon indicating copy to clipboard operation
epub.js copied to clipboard

How can I load base64 content in page by epub.js

Open zbutfly opened this issue 6 years ago • 3 comments

The content is loaded by a restful api as a json field. I can only get the content in this way for CORS limit.

I found some descrtiption abous ePubReader but it looks not supported in the main epub.js product.

class Book has a constructor like (code from https://stackoverflow.com/questions/16245767/creating-a-blob-from-a-base64-string-in-javascript):

new Book({ replacements: URL.createObjectURL(b64toBlob(content)) });

But the class is not found in epub.js.

I had tried:

var book = new ePub('data:application+zip;base64,' + content );

and

var book = new ePub();
var opened = book.open(content, 'base64').then(
	() => console.log('EPUB content opened.'), 
	(err) => console.log('EPUB content opened fail: ' + err + '.')
);

then (in the callback or after the book instance in main block):

var rendition = book.renderTo('epub-container', {
	method: 'continuous',
	width: '100%',
	height: '100%'
});
rendition.start();

Nothing happened in my page.

Is there any limitation of the target element of renderTo()? For example, some tag (I had tried <article> and <div>), or empty innerHtml (I had emptied it before), or some class?

Thanks for any advice.

zbutfly avatar Dec 08 '18 13:12 zbutfly

did you found any solution? I have the same problem showing base64 format. passing a base64 format to the epub library show nothing.

hesampour avatar Mar 25 '19 06:03 hesampour

this worked for me, using epub.js with angular (data.content is part of json response):

      this.book = ePub(data.content, {encoding: 'base64'});
      const b64 = data.content.replace('data:application/epub+zip;base64,', '');
      this.book.open(b64);

hope it helps someone.. :)

chrisdo-mpt avatar Nov 23 '20 16:11 chrisdo-mpt

How to achieve it in react js? I am receiving epub file in Json, ReactReader is unable to render it. How to go about it?

Pratik-789 avatar Feb 08 '24 13:02 Pratik-789