Блог

Главная - Вопросы по программированию - Нет ошибки «Управление доступом-Разрешить происхождение» при чтении в JSON из корзины S3 в JavaScript

Нет ошибки «Управление доступом-Разрешить происхождение» при чтении в JSON из корзины S3 в JavaScript

#javascript #json #amazon-web-services #amazon-s3 #cors

Вопрос:

У меня есть веб-приложение, встроенное в JavaScript, которое загружает данные из файла JSON. Я пытаюсь прочитать в этом JSON, который у меня есть в корзине S3 (JSON обновляется ежедневно), используя эту функцию:

 const url = `https://s3.us-east-2.amazonaws.com/sfbucket.starr/sf_events.json`;


const successCb = (resp) => {
    console.log(resp);
};

const errorCb = (err) => {
    console.error('Error - ', err);
};

function downloadObject(url, successCb, errorCb) {
    fetch(url)
      .then(response => response.json())
      .then(successCb)
      .catch(errorCb);
}

downloadObject(url, successCb, errorCb);

Я получаю эту ошибку:

 Access to fetch at 'https://s3.us-east-2.amazonaws.com/sfbucket.starr/sf_events.json' from origin 'http://localhost:7887' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Веб — сайт уже развернут, но я тестирую это на http://localhost:7887/

Вещи, которые я пробовал:

  1. Я сделал ведро S3 общедоступным.
  2. Я читал, что мне, возможно, потребуется отредактировать конфигурацию CORS в корзине S3. Итак, я сделал эту конфигурацию CORS: 
          [
 {
     "AllowedHeaders": [
         "*"
     ],
     "AllowedMethods": [
         "PUT",
         "POST",
         "DELETE"
     ],
     "AllowedOrigins": [
         "http://www.example1.com"
     ],
     "ExposeHeaders": []
 },
 {
     "AllowedHeaders": [
         "*"
     ],
     "AllowedMethods": [
         "PUT",
         "POST",
         "DELETE"
     ],
     "AllowedOrigins": [
         "http://localhost:7887/"
     ],
     "ExposeHeaders": []
 },
 {
     "AllowedHeaders": [],
     "AllowedMethods": [
         "GET"
     ],
     "AllowedOrigins": [
         "*"
     ],
     "ExposeHeaders": []
 }

    ]

Что я могу попытаться решить эту проблему?

Комментарии:

1. Обратите внимание, что здесь мы предпочитаем технический стиль письма. Мы мягко препятствуем приветствиям, надеемся, что вы можете помочь, спасибо, заранее благодарим, благодарственные письма, пожелания, добрые пожелания, подписи, пожалуйста, помогите, болтливые материалы и сокращенные txtspk, мольбы, как долго вы застряли, советы по голосованию, мета-комментарии и т. Д. Просто объясните свою проблему и покажите, что вы пробовали, чего ожидали и что на самом деле произошло.

2. Вы пробовали без «/» в AllowedOrigins ? Например: http://localhost:7887 вместо http://localhost:7887/ того, чтобы ?

3. И также кажется, что ваш файл также не является допустимым json, он начинается с var sf_events =

Ответ №1:

Я предполагаю, что Fetch может инициировать «предполетную подготовку»… Поэтому, возможно, потребуется включить Http-метод «ПАРАМЕТРЫ».

Проверьте эту ссылку

Попробуйте добавить «ПАРАМЕТРЫ» вместе с «ПОЛУЧИТЬ»…

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

Метки: