Ionic 3 и хранилище firebase
Существует ситуация, когда у меня есть несколько аудиофайлов в хранилище firebase, и мне нужно загрузить в локальную память телефона, поэтому, когда я запускаю приложение, он должен проверить, есть ли какой-либо звук в локальной памяти, если он существует, он воспроизводит, в противном случае загрузите его из хранилища firebase.
Кто-нибудь может мне помочь с этим ionic 3 и firebase?
У меня есть эта связь
<script src = "https://www.gstatic.com/firebasejs/5.0.4/firebase.js"></script>
<script >
var config = {
apiKey: "AIzaSyAg6dBk2BJ-DlFHm0f0G-9XpIcjb-Zl7DY",
authDomain: "helloworld-4e6e6.firebaseapp.com",
databaseURL: "https://helloworld-4e6e6.firebaseio.com",
projectId: "helloworld-4e6e6",
storageBucket: "helloworld-4e6e6.appspot.com",
messagingSenderId: "386944915967"
};
firebase.initializeApp(config);
</script>
вот файл my.ts
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { AboutPage } from '../about';
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-
native/file-transfer';
import { NativeAudio } from '@ionic-native/native-audio';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
bleep = new Audio();
constructor() {
}
download() {
const url = 'https://firebasestorage.googleapis.com/v0/b/helloworld-
4e6e6.appspot.com/o/audio%2Fp10_1.mp3?alt=media&token=12bf3400-17a7-4cf9-
b862-973707a3164e';
fileTransfer.download(url, this.file.dataDirectory +
'test.mp3').then((entry) => {
console.info('download complete: ' + entry.toURL());
}, (error) => {
console.info('Error during download: '+error);
});
}
wajid()
{
const fileTransfer: FileTransferObject = this.transfer.create();
this.download();
this.nativeAudio.preloadSimple('uniqueId1', this.file.dataDirectory +
'test.mp3').then((res) => {
console.info('Mp3 ready');
}, (error) => {
console.info("Some error during load the audio "+error);
});
this.nativeAudio.play('uniqueId1').then((onSuccess)=>{
console.info('Mp3 reproduced ok');
}, (onError)=>{
console.info("Some error during reproduce of the audio "+onError);
});
// can optionally pass a callback to be called when the file is done
playing
//this.nativeAudio.play('uniqueId1', () => console.info('uniqueId1 is
done playing'));
}
вот моя кнопка html
<div class= "sections" style = "width: 18%;" (tap) = "wajid()" (press) = "wajidlong5()">
<div class = "sections" id = "sec1" >
ﻞَ
</div><!--
--><div class = "sections" id = "sec2" >
ﻌَ
</div><!--
--><div class = "sections" id = "sec3" >
ﺟَ
</div>
</div>
@Cristian, откуда я научился достигать этого, мне действительно нужно сделать это как можно скорее! помоги мне чувак
Здесь: ionicframework.com/docs/native, ищите File Transfer, там вы также можете проверить, существует ли уже файл
@Cristian, мне нужно загрузить звук из хранилища firebase, а затем проверить, не существует ли он, воспроизводится из ресурсов, иначе он загрузит и поместит этот звук в папку ресурсов, а затем воспроизведет из ресурсов. Пожалуйста, помогите :)
Вы не можете вкладывать напрямую в активы. Проверьте плагин FILETRANSFER ionic
@Cristian, во-первых, как мне скачать это аудио?
Ответы 1
Чтобы загрузить аудио, используйте: Передача файлов
const fileTransfer: FileTransferObject = this.transfer.create();
import { File } from '@ionic-native/file';
constructor(private file: File) { }
download() {
const url = 'https://firebasestorage.googleapis.com/v0/b/helloworld-4e6e6.appspot.com/o/audio%2Fp10_1.mp3?alt=media&token=12bf3400-17a7-4cf9-b862-973707a3164e';
fileTransfer.download(url, this.file.dataDirectory + 'test.mp3').then((entry) => {
console.info('download complete: ' + entry.toURL());
}, (error) => {
// handle error
});
}
Чтобы проверить, находится ли файл в вашей папке, используйте этот собственный плагин Файл.
Посмотрите на две спецификации плагинов.
Если проблема возникла, спрашивайте здесь, и я отредактирую ответ
Чтобы воспроизвести файл, вы должны использовать ИСХОДНОЕ АУДИО. ТАК:
this.nativeAudio.preloadSimple('uniqueId1', this.file.dataDirectory + 'test.mp3').then(onSuccess, onError);
И СЕЙЧАС:
this.nativeAudio.play('uniqueId1').then(onSuccess, onError);
// can optionally pass a callback to be called when the file is done playing
this.nativeAudio.play('uniqueId1', () => console.info('uniqueId1 is done playing'));
Полный код:
import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';
import { NativeAudio } from '@ionic-native/native-audio';
constructor(private transfer: FileTransfer,private file: File,private nativeAudio: NativeAudio) {
const fileTransfer: FileTransferObject = this.transfer.create();
this.download();
this.nativeAudio.preloadSimple('uniqueId1', this.file.dataDirectory + 'test.mp3').then((res) => {
console.info('Mp3 ready');
}, (error) => {
console.info("Some error during load the audio "+error);
});
this.nativeAudio.play('uniqueId1').then((onSuccess)=>{
console.info('Mp3 reproduced ok');
}, (onError)=>{
console.info("Some error during reproduce of the audio "+onError);
});
// can optionally pass a callback to be called when the file is done playing
//this.nativeAudio.play('uniqueId1', () => console.info('uniqueId1 is done playing'));
}
download() {
const url = 'https://firebasestorage.googleapis.com/v0/b/helloworld-4e6e6.appspot.com/o/audio%2Fp10_1.mp3?alt=media&token=12bf3400-17a7-4cf9-b862-973707a3164e';
fileTransfer.download(url, this.file.dataDirectory + 'test.mp3').then((entry) => {
console.info('download complete: ' + entry.toURL());
}, (error) => {
console.info('Error during download: '+error);
});
}
В вашей page.ts. download () - это функция для загрузки файла. this.file.dataDirectory - это каталог, в который будет загружен файл.
мне нужно указать путь, заменяющий this.file.dataDirectory, или пусть он будет таким, каким он есть, кстати, мой файл должен быть загружен в каталог (Desktop \ hello \ www \ assets \ звуки)
мой URL-адрес аудио хранилища firebase -> firebasestorage.googleapis.com/v0/b/…, и где мне нужно его загрузить, то есть -> Desktop \ hello \ www \ assets \ звуки, вы можете отредактировать эти URL-адреса
Ставлю url, путь, куда сохранять, ищу по File plugin
Я разместил ваш код выше при нажатии кнопки, так что теперь он должен загрузиться, и как воспроизвести загруженный файл?
извините, Кристиан, я так смущен, что выдает мне ошибку, вы можете отредактировать сообщение и сделать это шаг за шагом? 1. Аудио загружается в хранилище Firebase, и там есть URL-адрес. 2. Загрузите аудио из хранилища и сохраните его в папке с ресурсами при нажатии кнопки. URL есть 3. Затем воспроизведите загруженный звук из ресурсов, и если звук не существует в ресурсах, он должен загрузить его из хранилища firebase. по крайней мере, в пунктах 1 и 2 вы можете прояснить это для меня, чтобы я смог его достичь. я буду вам очень благодарен.
Когда я нажимаю кнопку, чтобы вызвать эту функцию загрузки, я получаю сообщение об ошибке «не могу прочитать свойство 'create' из undefined.
Помогите мне с этим братом, даже если я могу заплатить некоторую сумму, чтобы добиться этого :(
Я объясняю все шаги, чтобы написать полный код, у меня уходит 1 час, поэтому я не могу. Пожалуйста, задайте какой-нибудь конкретный вопрос, и я смогу вам ответить .. Но я не могу написать весь код ...
Я вставил ваш код выше, и когда я нажимаю кнопку, чтобы загрузить аудио, возникает ошибка.
Определяется это? this.file.dataDirectory ... импортировать файл
я не понял тебя
позволь мне проверить это сейчас, Кристиан
мне нужно скачать аудио в приложении
Я скопировал весь ваш код, все еще давая мне ошибку, которая не может прочитать свойство create из undefined.
Я отредактировал свой пост, Кристиан, теперь помоги мне с этим, когда я нажимаю кнопку, он по-прежнему дает мне ту же ошибку, которая не может прочитать свойство 'create' of undefined
Ваш конструктор () пуст
что должно быть в конструкторе? любезно скопируйте мой пост, исправьте и отредактируйте свой пост. Я буду очень благодарен тебе, Кристиан.
конструктор (частный перенос: FileTransfer, частный файл: File, частный nativeAudio: NativeAudio) {... поместите все сюда}
Не совсем .... Вы должны узнать больше об ионном ... Это не так просто.