How can I use Firebase Storage with Vue.js?

How can I use Firebase Storage with Vue.js?

You can use Firebase Storage in your Vue.js app by installing the Firebase SDK and initializing it in your project.

What are the steps to upload a file to Firebase Storage?

First, create a file input in your Vue component, then use the Firebase Storage API to upload the file when selected.

Can you show me a code example for uploading a file?

Sure! Here's a simple example:

import firebase from 'firebase/app';
import 'firebase/storage';

const uploadFile = (file) => {
  const storageRef = firebase.storage().ref();
  const fileRef = storageRef.child(file.name);
  fileRef.put(file).then(() => {
    console.log('File uploaded successfully!');
  });
};

This function uploads a file to Firebase Storage.

How do I retrieve the uploaded file's URL?

You can retrieve the file's URL using the getDownloadURL method after the upload is complete. Here's how:

fileRef.getDownloadURL().then((url) => {
  console.log('File available at', url);
});