Question

我的Web应用程序需要帮助，该Web应用程序将图像上传到firebase storage，然后希望以缩略图形式显示该图像。

我收到错误this.xhr_ =未定义新的XMLHTTPREQUEST

我没有10个代表点，因此我似乎无法直接上传图片。如果有更好的方法，请告诉我。

我已经浏览了Firebase文档和许多堆栈溢出答案，但似乎有任何有效的方法。我尝试全局安装xmlhttprequest，也将其作为依赖项。

如您所见，我也尝试导入XmlHttpRequest，但是它什么也没做。

我遇到的错误来自使用getdownloadurl（）的最后一条语句

<script>
import XMLHTTPREQUEST from 'xmlhttprequest'
import ImageCard from '../../components/ImageCard/ImageCard'
import {db} from '../../firebase/init.js'
import {storage} from '../../firebase/init.js'
export default {
    name: "explore",
    components: {
        ImageCard,
        db,
        storage,
        XMLHTTPREQUEST
    },
    data() {
        return {
            cards: [],
            downloadUrl: ''
        }
    }, 
    created(){
        //fetch data from firestore
        db.collection('Assets').get()
        .then(snapshot => {
            snapshot.forEach( doc => {
                let card = doc.data()
                console.log(card)
                // the card.id is adding an id property onto the let card variable
                card.id = doc.id
                this.cards.push(card)
                console.log(this.cards)
            })
        })

    },
    created() {  
      const storageRef = storage.ref()
      const imagesRef = storageRef.child('AshAngelPaid.jpg');
        console.log('Before getting requesting download url')
      imagesRef.getDownloadURL().then( (url) => {

            document.querySelector('img').src = url;
          console.log('got download url');

Answer 1

基本上，虽然nuxtjs在服务器端呈现组件，但没有xmlhttprequest，只需将.getDownloadURL和相关内容移动到Mounted（）或beforeMount（）生命周期挂钩中。

使用Nuxt JS未定义Firebase Storage XMLHttpRequest错误

1 个答案: