未定义Firebase存储XMLHttpRequest，Nuxt JS出现错误

我的web应用需要帮助，它正在将图像上载到

firebase存储

，然后希望在缩略图中显示该图像

我得到的错误是未定义this.xhr\ux=new XMLHTTPREQUEST

我没有10个代表点，所以看起来我不能直接上传我的图片。 如果有更好的方法，请告诉我

我已经浏览了firebase文档和许多堆栈溢出的答案，但似乎有任何有用的东西。我尝试全局安装

xmlhttprequest

，也作为依赖项

正如您所看到的，我还尝试导入

XmlHttpRequest

，但没有任何效果

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

从“XMLHTTPREQUEST”导入XMLHTTPREQUEST
从“../../components/ImageCard/ImageCard”导入ImageCard
从“../../firebase/init.js”导入{db}
从“../../firebase/init.js”导入{storage}
导出默认值{
名称：“探索”，
组成部分：{
图像卡，
db，
存储
XMLHTTPREQUEST
},
数据（）{
返回{
卡片：[]，
下载URL:“”
}
}, 
创建（）{
//从firestore获取数据
db.collection（'Assets'）.get（）
。然后（快照=>{
snapshot.forEach（doc=>{
let card=doc.data（）
控制台日志（卡）
//card.id正在将id属性添加到let card变量中
card.id=doc.id
这个.卡片.推（卡片）
console.log（this.cards）
})
})
},
已创建（）{
const storageRef=storage.ref（）
const imagesRef=storageRef.child（'AshAngelPaid.jpg'）；
console.log（'获取请求下载url之前'）
imagesRef.getDownloadURL（）。然后（（url）=>{
document.querySelector（'img'）.src=url；
log（'got download url'）；

基本上，当nuxtjs在服务器端呈现组件时，没有xmlhttprequest，只需将.getDownloadURL和相关内容移动到mounted（）或beforeMount（）中即可lifecycle hook.

您好，欢迎，请不要将您的代码作为截图发布-编辑您的问题并发布正确的代码。谢谢@aliusman我知道该怎么做，我希望这是可读的格式。感谢更新，做得好，我有完全相同的问题，但希望在服务器端生成下载URL。您知道这是否可行吗？Ma带axios模块的ybe？

<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');