Cordova：在 www 文件夹中加载 epub 文件答案

【问题标题】：Cordova: load epub file in www folderCordova：在 www 文件夹中加载 epub 文件
【发布时间】：2017-08-19 11:37:33
【问题描述】：

是时候寻求帮助了；花了太多天试图自己解决这个问题。非常感谢任何帮助。

我在一个网络应用程序中运行react-reader，它可以跨浏览器（包括 Safari）加载 epub 文件，没有任何问题。但是当应用通过 Cordova 在 iOS 上运行时，它不再加载 epub 文件。我假设这可能与 iOS/Cordova 处理文件的方式有关，但我不是这些问题的专家。我确实尝试了不同的 StackOverflow 建议（this、this、this 和 this），但无济于事。

所有 epub 文件都位于一个子文件夹中：www/epubs/

这是适用于网络应用程序的 react 代码，但不适用于 Cordova 应用程序（简化为基本要素）：

import React from 'react'
import { EpubView } from 'react-reader'

export default ({ lang, name }) => (
  <EpubView
    url={'epubs/' + lang + '-' + name + '.epub'}
  />
)

【问题讨论】：

标签： ios xcode cordova reactjs cordova-plugins

【解决方案1】：

解决了！ 一个有效的技巧是将 www 文件夹中的每个文件 fs.download 放入 Cordova 的持久文件系统中。请参阅我的 original post。

首先，在终端中：

npm install cordova-promise-fs
cordova plugin add cordova-plugin-file --save
cordova plugin add cordova-plugin-file-transfer --save

然后，在你的前端：

import CordovaPromiseFS from 'cordova-promise-fs'

const fs = CordovaPromiseFS({
  persistent: true,
  storageSize: 200 * 1024 * 1024,
  concurrency: 3
})

如果你使用 React，上面的代码必须在组件 Class 创建之前声明，而下面的代码应该在组件 Class 内的自己的函数中。更多详情请查看我的GitHub comment。

window.resolveLocalFileSystemURL(
  cordova.file.applicationDirectory + 'www/epubs/alice.epub',
    // If successful...
    (fileSystem) => {
      const downloadUrl = fileSystem.toURL()
      const localUrl = 'alice.epub' // the filename it is stored as in the device
      fs.download(
        downloadUrl,
        localUrl,
        (progressEvent) => {
          if (progressEvent.loaded && progressEvent.total) {
          console.log('progress', Math.round((progressEvent.loaded / progressEvent.total) * 100))
        }
      }
    ).then((filedata) => {
      return fs.toInternalURL(localUrl)
    })
    .then((localPath) => {
      this.setState({ epubPath: localPath })
    }).catch((error) => {
      console.log('some error happend', error)
    })
  },
  // If unsuccessful
  (err) => {
    console.log(err)
  }
)

【讨论】：