Выборка изображений из Amazon s3 дает ошибку CORS. (Проблема Chrome)

Я пытаюсь получить изображения из Amazon s3 с этими конфигурациями CORS:

<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>

и полученная ошибка:

Image from origin 'https://s3.amazonaws.com' has been blocked from loading by Cross-Origin     Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Я получаю эту ошибку в Chrome, но не в Firefox. Я пробовал просматривать, но не нашел решения. Может ли кто-нибудь помочь мне с этим?

Спасибо

Ответ 1

Я смотрю на вопросы AWS, и я вижу это совсем немного. Проблема с этим вопросом (и теми, кто нравится) заключается в том, что он предоставляет только половину уравнения (конфигурация CORS) для сообщества. "C" в MVCE, конечно, не выполняется.

Недостающая половина уравнения - это то, как вы пытаетесь получить доступ к ресурсу на лицевой стороне. В частности, критические заголовки запросов являются критическими.

Используете ли вы fetch? canvas? Amazon SDK? Что-то вроде domtoimage?
Вы захватили заголовки запросов для неудачный запрос?
- Если да, то почему они не в вопросе?

Основы CORS

Если вы не отправите заголовок запроса origin, вы не получите заголовки ответа CORS. Если вы отправляете заголовок origin, а источник разрешен, вы должны получить заголовки CORS. Это просто.

Поэтому недостающий заголовок origin должен быть первым, что вы исключаете. Вы абсолютно уверены, что отправляете заголовок origin? Чаще всего это библиотека, которую вы используете для отправки? Если вы копаете немного глубже, реальный вопрос может быть "почему в моей просьбе нет заголовка origin?"

Боковое примечание: вы можете использовать расширение браузера, например Requestly, чтобы удалить заголовок origin из всех исходящих запросов и поразиться на всех вещах, которые ломаются.

Работает в x, но не y

Вернуться к разделу "разместить заголовки ваших запросов" soapbox. Если Chrome и Firefox действуют по-другому, подтвердите ли вы, что каждый отправляет один и тот же набор заголовков?

Несколько заголовков настроены для вас браузером, а версии браузера могут создавать разные варианты, в отношении которых заголовки отправляются, когда.