时间戳

首页 > 解决方案 > Firebase 存储不是 vuejs 应用程序中的功能

javascript - Firebase 存储不是 vuejs 应用程序中的功能

问题描述

美好的一天开发人员，我正在使用 Firebase 在 Vuejs 中构建这个应用程序，将一些视频和图像存储在我的 Firebase 存储模块中，但是当我初始化检索图像的功能时，我收到了这个错误：“firebase__WEBPACK_IMPORTED_MODULE_2__.storage(.. .).ref(...).child(...).then 不是函数”

在我的 Vuex 方法中，我设置它是为了访问我的 firebase 存储中的图像

actions: {
    getVideoAboutMe({commit}) {
      firebase
        .storage()
        .ref("myVideo")
        .child("coverr-a-greek-cemetery-top-view-1578925848736.mp4")
        .then(uploadTaskSnapshot => {
          commit("setVideoAboutMe", uploadTaskSnapshot);
          console.log(uploadTaskSnapshot);
          return uploadTaskSnapshot.ref.getDownloadURL();
        })

        .catch((error) => {
          alert("Error", error);

        });
    },

而我的主js文件就是这样设计的：

import * as firebase from "firebase";
import "firebase/storage";

Vue.config.productionTip = false;
Vue.component("myAboutMe", aboutTag);

new Vue({
  router,
  store,
  vuetify,
  render: h => h(App),
  created() {
    firebase.initializeApp({
      apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      authDomain: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      databaseURL: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      projectId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      storageBucket: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
    });
    this.$store.dispatch("getVideoAboutMe");
  }
}).$mount("#app");

然后创建组件上的所有逻辑，但错误完全指的是 vuex 中的这个方法，比如如果存储不存在（我认为它确实导致了导入 firebase）。关于如何改进这一点的任何建议？...谢谢！

标签： javascriptfirebasevue.jsfirebase-storage

解决方案

child()不返回承诺，所以你不能调用then()它。它返回一个引用对象。如果您想获取该引用引用的对象的下载 URL，只需直接调用getDownloadURL()即可。它返回一个承诺。

      firebase
        .storage()
        .ref("myVideo")
        .child("coverr-a-greek-cemetery-top-view-1578925848736.mp4")
        .getDownloadURL()
        .then(...)
        .catch(...)

推荐阅读