【发布时间】:2020-07-30 16:57:30
【问题描述】:
我正在浏览器中运行一个使用电容器的ionic 5 APP,并且我正在尝试使用文件传输功能。我遵循文档https://ionicframework.com/docs/native/file-transfer 并使用电容器配置我的应用程序。这样运行:
npm install cordova-plugin-file-transfer
npm install @ionic-native/file-transfer
ionic cap sync
在我的 app.module 中,我注册了提供程序:
import { FileTransfer } from '@ionic-native/file-transfer/ngx';
import { File } from '@ionic-native/file/ngx';
...
providers: [
StatusBar,
SplashScreen,
...
FileTransfer,
File
],
请注意,我还安装了原生文件包,所以我总共有以下 4 个新包:
"@ionic-native/file": "^5.27.0",
"@ionic-native/file-transfer": "^5.27.0",
"cordova-plugin-file": "^6.0.2",
"cordova-plugin-file-transfer": "^1.7.1",
我在组件中的代码是:
import { Input, Component } from '@angular/core';
import { FileTransfer, FileTransferObject } from '@ionic-native/file-transfer/ngx';
import { File } from '@ionic-native/file/ngx';
@Component({
selector: 'app-order-detail-order-card',
templateUrl: './order-detail-order-card.page.html'
})
export class OrderDetailOrderCardPage {
@Input() pdfUrl: string;
@Input() orderCardId: string;
constructor(private transfer: FileTransfer, private file: File) { }
public downloadFile(): void {
const fileTransfer: FileTransferObject = this.transfer.create();
fileTransfer.download(this.pdfUrl, this.file.applicationDirectory + `${orderCardId}.pdf`).then((entry) => {
console.log('download complete: ' + entry.toURL());
}, (error) => {
// handle error
});
}
}
当我在浏览器中运行应用程序时,我收到以下警告,我不确定文件是否应该下载到某个地方?
common.js:284 Native: tried calling SplashScreen.hide, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator
即使我没有得到文件,我也希望看到“下载完成”消息。我不太清楚我是否必须在我的应用程序中配置其他东西才能在本地运行它,或者我必须仅在模拟器或设备本身中使用此功能。
还需要配置什么才能使其正常工作?
【问题讨论】:
-
电容器不支持浏览器上的cordova插件
-
common.js:284 Native:尝试调用 SplashScreen.hide,但 Cordova 不可用.......这是因为您在 Web 浏览器中运行应用程序。运行它模拟器并使用开发工具检查它。此警告已消失。
-
嗨@carlos,你能下载文件吗?
标签: ionic-framework angular9 capacitor ionic5