Загрузка изображений React и Firebase показывает net :: ERR_TIMED_OUT - PullRequest
Новая
       116

Загрузка изображений React и Firebase показывает net :: ERR_TIMED_OUT

0 голосов
/ 03 мая 2020

Несколько часов я сталкиваюсь с net::ERR_TIMED_OUT, когда пытаюсь загрузить изображение в Firebase.

Вот моя конфигурация: 

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';
import 'firebase/storage';
const config = {
    apiKey: "example",
    authDomain: "example",
    databaseURL: "example",
    projectId: "example",
    storageBucket: "example",
    messagingSenderId: "example",
    appId: "example"
};
if (!firebase.apps.length) {
    firebase.initializeApp(config);
}
const auth = firebase.auth();
const storage = firebase.storage();
export {
    auth,
    firebase,
    storage
};

Роли в хранилище: 

rules_version = '2';
service firebase.storage {
    match /b/{bucket}/o {
        match /{allPaths=**} {
        allow read, write: if auth != null; // tried also if true
        }
    }
}

В моем компоненте формы: 

import { storage } from '../../firebase';
state = {
    image: null,
    url: ''
};

handleChange = (e) => {
    if(e.target.files[0]){
        const image = e.target.files[0];
        this.setState(() => ({ image }))
    }
    // console.log(e.target.files[0])
}

handleUpload = () => {
    const { image } = this.state;
    const uploadTask = storage.ref(`images/${image.name}`).put(image);
    uploadTask.on('state_changed', 
    (snapshot) => {
        // progress function ....
    }, 
    (error) => {
        // Error function
        console.log(error)
    }, 
    () => {
        // Complete function
        storage.ref('images').child(image.name).getDownloadURL().then(url => {
            console.log(url)
        })
    });
}

render() {
    return (
        <div>
            <input 
                type="file" 
                onChange={this.handleChange}
            />
            <button onClick={this.handleUpload}>Upload</button>
        </div>
    );
}

Это была моя настройка, но после щелчка для загрузки она показывает net::ERR_TIMED_OUT.

С другой стороны, вставка, обновление , удалите работающий нормально с Firebase, но проблема в изображениях.

Что теперь нужно, пожалуйста?

Спасибо

...