【问题标题】:Why is capacitor saving everything to IndexedDB instead on sdcard on Android?为什么电容器将所有内容保存到 IndexedDB 而不是 Android 上的 sd 卡?
【发布时间】:2021-03-10 19:27:54
【问题描述】:

我将 Angular 9 与 ionic5 一起使用,并尝试在我的 Android 9 设备上保存文件。不幸的是,每次我尝试使用 Capacitor 写入文件时,该文件都会保存到 IndexedDB 而不是磁盘/sdcard 上。有什么方法可以告诉 ionic 我想保存到 sdcard 和/或修复我的代码?

保存文件的代码

const fileName = decodeURIComponent(attachment.Name);

const savedFile = await Filesystem.writeFile({
    path: fileName,  // filename.png
    data: attachment.Content,  // base64 encoded png file
    directory: FilesystemDirectory.ExternalStorage,
});
console.log(savedFile.uri);

权限

应用程序应该有权写入 SD 卡,因为这是在 AndroidManifest.xml 中定义的:

<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

预期结果

根据documentation,这应该将文件保存到sdcard的根目录。

实际结果

执行此操作时,返回的 URI 是 /EXTERNAL_STORAGE/filename.png,但该文件不存在于 sdcard 上,因为它保存在 IndexedDB 中,如 Chrome Inspector 的屏幕截图所示,该屏幕附在我的 Android 上运行的应用程序上:

【问题讨论】:

    标签: android angular ionic-framework capacitor ionic5


    【解决方案1】:

    在我写完这个问题后,stackoverflow 能够找到一个 similar one,但没有解决,但回答了我的问题。

    解决方案是确保您使用Plugins 而不是import

    正确

    const { Filesystem } = Plugins;

    不正确

    import { Filesystem } from '@capacitor/core';

    【讨论】:

    • 此解决方案令人困惑,因为您描述为“不正确”的内容可在电容器文档的示例代码中找到。 capacitorjs.com/docs/apis/filesystem#example
    • 有趣。他们可能在过去几个月里改变了它。当您使用导入方法时,代码是否正常工作?
    • 你必须把它改成: import { Filesystem } from ‘@capacitor/vue’ 然后它才能正常工作。
    • @capacitor/vue 不只适用于 Vue 框架吗?因为这里我说的是 Angular 应用程序。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-05-30
    • 2012-05-16
    • 2012-11-27
    • 1970-01-01
    • 1970-01-01
    • 2011-06-08
    相关资源
    最近更新 更多