Загрузите изображение из облака Google и отобразите на сайте React - PullRequest
0 голосов
/ 03 мая 2020

Я пытаюсь изучить React и Firebase прямо сейчас. Я хотел бы

  1. Загрузить изображение из моего облачного хранилища Google
  2. Показать это изображение на моей веб-странице

Я следую этому руководству здесь, чтобы скачать файлы: https://firebase.google.com/docs/storage/web/download-files

Однако, похоже, устарело. Я последовал совету по этому другому потоку переполнения стека, чтобы изменить импорт пакета. google-cloud TypeError: gcs.bucket не является функцией .

Так что сейчас я могу загрузить файл, однако я не знаю, как получить к нему доступ. Из того, что я понимаю, это было бы в памяти, но как бы это отобразить? Документы для загрузки файла находятся здесь https://googleapis.dev/nodejs/storage/latest/File.html#download.

Это то, что у меня сейчас

const { Storage } = require('@google-cloud/storage');

function MyPage(props: any) {

    const storage = new Storage({
        projectId: 'myProjectId',
    });

    const myImage = await storage
        .bucket('myBucket')
        .file('myImage.jpg')
        .download();
    });

    return (
        <div id="MyPageContainer">
            <h1>Hello!</h1>
        </div>
    );
}

1 Ответ

1 голос
/ 05 мая 2020

Вместо того, чтобы загружать файлы из облачного хранилища на ваш веб-сервер, вы должны указать в своем HTML ссылку, чтобы пользователи могли загружать файлы непосредственно из облачного хранилища, как упомянуто @JohnHanley в комментариях.

Это возьмет на себя обработку файла через бэкэнд вашего приложения в само облачное хранилище, что более эффективно, но для его реализации есть факторы производительности и стоимости. Если вы хотите доставлять защищенные файлы напрямую с вашего веб-сервера, вы можете заменить его для подписанных URL-адресов, вы можете проверить документацию для него в здесь .

Если вы по-прежнему выбираете go при обработке через ваш we-сервер, вы можете взглянуть на этот пример , и как только вы загрузите файл, вам потребуется создать HTML tag + location, чтобы браузер загружал с вашего сервера.

...