#javascript #node.js #reactjs #amazon-web-services #amazon-s3
#javascript #node.js #reactjs #amazon-веб-сервисы #amazon-s3
Вопрос:
У меня есть предустановленный URL-адрес загрузки AWS с 20-секундным сроком действия:
https://our-namespace.s3.amazonaws.com/documents/7443912/ffb9bbc5-5f4f-4315-a4e8-418bc31dbef2.png?X-Amz-Security-Token=123amp;X-Amz-Algorithm=AWS4-HMAC-SHA256amp;X-Amz-Date=20211007T004004Zamp;X-Amz-SignedHeaders=hostamp;X-Amz-Expires=20amp;X-Amz-Credential=ASIA4SLAKW7L216GHWOI/20278006/us-east-1%2GF3/aws4_requestamp;X-Amz-Signature=123
Когда я загружаю этот URL-адрес в браузере, он запускает загрузку. Я ищу способ отобразить это как предварительный просмотр изображения в браузере — вместо инициализации загрузки файла.
Моей первоначальной мыслью было преобразовать этот URL-адрес в большой двоичный объект, а затем отобразить этот большой двоичный объект в режиме предварительного просмотра изображения. Единственная проблема в том, что я не уверен, как это сделать. Я нашел следующий пакет: https://www.npmjs.com/package/rn-fetch-blob
но, похоже, это больше не поддерживается.
Каков был бы оптимальный способ отображения изображения в качестве предварительного просмотра по ссылке только для загрузки AWS?
Комментарии:
1. Установлен ли правильный тип содержимого для базового объекта S3? Что ваш браузер делает для других PDF-файлов?
2. Проблема заключается в заголовках ответов от AWS. AWS отправляет «Content-Type: application / octet-stream», но вам нужен «Content-Type: application / pdf»
3. @jarmod @Unigazer Я случайно использовал неправильный формат URL-адреса для ссылки S3. Я только что обновил его в вопросе — ваши комментарии все еще актуальны? Если да, то как я могу заставить AWS отправлять
content-type
asapplication/pdf
? И откуда вы знаете, что оно поступает какapplication/octet-stream
? Я не уверен, как это просмотреть4. Да, тип содержимого имеет значение. Это определяет, как загруженный файл будет представлен агенту пользователя. Все SDK и awscli позволяют загрузчику указывать тип содержимого.
5. Все эти разговоры о прокси и решениях для кодирования не должны быть необходимыми. Объекты S3 могут иметь метаданные типа содержимого. Установите это правильно для загруженного PNG и PDF, затем создайте предварительно подписанные URL-адреса для каждого, а затем вызовите эти URL-адреса в своем браузере. Затем ваш браузер может выбрать отображение / предварительный просмотр файла, а не его загрузку. Примечание: если вы загружаете файлы через консоль AWS S3, она обычно назначает правильный тип содержимого, поэтому вам не нужно.
Ответ №1:
Вам нужно установить правильный Content-Type
для каждого объекта в S3, например application/pdf
, или image/png
.
Вы можете сделать это при загрузке объекта или использовать консоль AWS S3 для последующего его изменения. Обратите внимание, что Content-Type
это считается метаданными.
Установка правильного Content-Type
значения для объекта означает, что когда объект обслуживается S3 или CloudFront, этот тип содержимого будет передан клиенту, что позволит ему принять решение о отображении или загрузке, в зависимости от обстоятельств.
Комментарии:
1. Понял, так что в настоящее время
content-type
заголовок всегдаbinary/octet-stream
. Просто чтобы убедиться, что я вас правильно понял — если я изменил заголовок на что-то более подходящее, напримерimage/png
, тогда я смогу просмотреть это в теге изображения, например<img src="s3-link-with-correct-headers" />
?2. Да, несмотря на браузер и другие потенциальные проблемы с кэшированием. Это должно быть просто подтвердить (как предлагалось ранее). Загрузите пару PDF-файлов или PNG-файлов, один с правильным типом содержимого, другой без. Создайте предварительно подписанные URL-адреса для каждого, затем вставьте их в строку URL-адреса вашего браузера (или используйте их в простом HTML-файле в качестве атрибутов img src).