BiB/iを使って自分のサイトでEPUBを読めるようにする

昨日、松島智さんが作ったJSを使ったブラウザベースのEPUB リーダーが発表された。自分のサイトをEPUB対応にするテストをしつつ、使い方を紹介してみます。 

http://sarasa.la/bib/i/

EPUBの実態は、.zipファイルで、その拡張子を.epubに変更することにより、EPUBリーダーで電子書籍として閲覧可能になるというしくみになっています。EPUBはオープンフォーマットなので、配布されているファイルを入手したら、EPUBリーダーがあればデバイスやアプリの種類を問わず、閲覧ができます(DRMが掛かっている商業向けファイルはこの限りではありません)。

bibi/i(ビビ)は、公開データを自分のサイトにアップロードするだけでEPUB電子書籍がブラウザで閲覧できるようになります。これ、サイトにEPUBデータをアップロードして公開したい場合などに便利なので、自分のサイトでもやってみました。

準備は、次のような手順です。

1)サーバーからプログラムファイルをダウンロードする

こちらです。

http://sarasa.la/bib/i/#download

2)データをサーバーにアップロードする

「bib」ディレクトリをまるごと、ご希望のディレクトリにアップロードします。

ScreenSnapz089

3)閲覧可能にしたい本を「bookshelf」ディレクトリにコピーします。

ScreenSnapz090

epubファイルをこのままコピーします。
展開に時間がかかる可能性もあるので、重いファイルの場合は、EPUBを展開済みにしてディレクトリごとアップロードするほうがよいそうです。

4)URLにアクセスします。
この場合はホームページの直下にbibフォルダを作ったので以下のようになりました。

http://amargon.net/bib/i

ScreenSnapz091

bib/i/ でi/index.htmlが開きます。とりあえずここにファイルをドラッグ&ドロップしてもepubが閲覧できるようになります。

5)ローカルにあるepubファイルをドラッグ&ドロップでブラウザの上に置いて、開いてみました。

開きました。面白い!(軽いファイルなら、上記のURLで、みなさんご自分で持っているファイルをお試しいただくこともできると思います。)

ScreenSnapz092

6)実際には、サーバーにアップロードしたのは、サーバ上にアップロードしたファイルを閲覧させるためです。サーバ上のデータを開く際、URLにはルールがあります。

http://amargon.net/bib/i/?book=HelloWorld.epub
↑サーバ名+ ↑bibiのディレクトリ +↑ ?book=ファイル名.epub 

といった形になるそうです。

iframeも使えるそうです。時間があったらそれも試してみます。

【告知】
新刊。EPUBからKDPデータをツクル手法で、比較的簡単に行える方法で紹介してます。

本書のサポート情報を追加しました。Windowsで推奨無料ソフトプラグインをインストールする際に拡張子が化けてしまうトラブルについて紹介しています。(「よくあるお問い合わせ」の箇所)

http://www.impressjapan.jp/books/1112101100 

7月5日、ボイジャーのブースにおじゃますることになりました。よろしくお願いいたします。
http://www.voyager.co.jp/news/info_tibf/tibf2013.html

こちらはクイックブックスの人気の新刊です。どうぞ^^