有没有一种特殊的方法可以将 url 图片上传到 firebase?

Is there a special way to upload url images to firebase?

Blockquote

我正在 Nuxt 和 Vuetify 中构建我的应用程序,我想使用输入 (v-file-input) 使用 Axios 将 url 图像上传到 Firebase。我对名称没有任何问题,但是当我上传 url 图片并进行 get 调用时,响应只是 url link,而不是图片。那么,上传url张图片有什么特别的方法吗? 是不是和其他输入法一样简单?

提前致谢。

            <template>
       <div>
         <v-app>
         <v-container>
         <h2>Movies</h2>
           <ul>
               <li v-for="movi in moviesData" :key="movi.id">
                        {{movi.name}}
                        {{movi.director}}
                        {{movi.image}}
                  </li>
           </ul>
           </v-container>
           </v-app>
       </div>

       </template>

        <script>
        import axios from 'axios'
        export default {
          data() {
            return {
                moviesData: [],
             }
          },
          methods:{
            getMovies(){
              axios.get('https://proyecto-final-cf888-default- 
     rtdb.firebaseio.com/' + 'movies.json')
                .then( (res)=>{
                  let results=[];
                  console.log(res);
                  for (let id in res.data){
                    console.log(id);
                    console.log(res.data[id]);
                    results.push({
                       id: id, 
                       name: res.data[id].name,
                       director: res.data[id].director,
                       image: res.data[id].image,
                    });
                  }
                  this.moviesData= results;
                  })
                .catch((error)=>{
                  console.log(error) 
                })       
               }
             }, 
            created(){
              this.getMovies();
            }
        }; 
        </script>

        

在 Firestore 中存储 URL 不会存储引用的图像本身。

  1. 您可以将图像上传到 Storage 并在 Firestore 中引用它。
  2. 或者您将 URL 存储在 Firestore 中并在您的应用中发起 HTTP-GET 请求以从网络加载图像。

注:

Firestore 将单个文档限制为 1MB。许多图片都比那个大。

存储还提供自动缩放上传图片等功能

原来是这样:

        <li v-for="movi in moviesData" :key="movi.id">
                    {{movi.name}}
                    {{movi.director}}
         <v-img :src='movi.image'></v-img>
              </li>

非常简单。

谢谢大家!