尝试将图像上传到 firebase firebase 时显示 cors 授权错误

Question

这是错误：

上传图片或保存产品时出错：FirebaseError：Firebase 存储：超出操作的最大重试时间，请重试。 （超出存储/重试限制）

https://firebasestorage.googleapis.com/v0/b/olx-clone-18561.appspot.com/o?name=images%2Fproject%20olx.webpnet::ERR_FAILED

这是我的 firebase 配置

我尝试上传文件（图像）到火存储并发生此错误。

Answer 1

嗯...细节不完整。 您应该向我们提供您用于上传图片的功能！！

可以有多种可能性...

1. 正确初始化 FRebase

 // firebaseConfig.js
    import { initializeApp } from 'firebase/app';
    import { getStorage } from 'firebase/storage';
    
    const firebaseConfig = {
      apiKey: "YOUR_API_KEY",
      authDomain: "YOUR_DOMAIN",
      projectId: "..........",
      storageBucket: ".............",
      messagingSenderId: "...........",
      appId: "...........",
      measurementId: "............"
    };
    
    const app = initializeApp(firebaseConfig);
    const storage = getStorage(app);
    
    export { storage };

2. 您可以使用此功能在react js中上传文件

 // FileUpload.js
    import React, { useState } from 'react';
    import { getStorage, ref, uploadBytesResumable, getDownloadURL } from 'firebase/storage';
    import { storage } from './firebaseConfig';
    
    const FileUpload = () => {
      const [file, setFile] = useState(null);
      const [progress, setProgress] = useState(0);
      const [error, setError] = useState(null);
      const [url, setUrl] = useState('');
    
      const handleFileChange = (e) => {
        setFile(e.target.files[0]);
      };
    
      const handleUpload = () => {
        if (!file) return;
    
        const storageRef = ref(storage, `images/${file.name}`);
        const uploadTask = uploadBytesResumable(storageRef, file);
    
        uploadTask.on('state_changed', 
          (snapshot) => {
            const progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
            setProgress(progress);
          }, 
          (error) => {
            setError(error.message);
          }, 
          () => {
            getDownloadURL(uploadTask.snapshot.ref).then((downloadURL) => {
              setUrl(downloadURL);
            });
          }
        );
      };
    
      return (
        <div>
          <input type="file" onChange={handleFileChange} />
          <button onClick={handleUpload}>Upload</button>
          <p>Progress: {progress}%</p>
          {error && <p>Error: {error}</p>}
          {url && <p>File available at: <a href={url}>{url}</a></p>}
        </div>
      );
    };
    
    export default FileUpload;

3. 检查网络状况和重试限制 互联网连接可能是罪魁祸首。此外，如果文件太大，请尝试减小文件大小。如果需要，您还可以调整重试设置。

4. 调整 Firebase 存储规则 确保您的 Firebase 存储规则允许上传。

如果问题再次出现，您可以回复。

如果我的回答对你有帮助就点个赞吧