Как получить AWS stati c url файла из Javascript?

Question

Я пытаюсь получить ссылки на несколько статических c изображений из моего AWS S3-контейнера. У меня есть пара javascript функций, которые меняют изображение, на которое нажимает пользователь (нажатие кнопки «Нравится» делает его зеленым). У меня проблемы с получением этих изображений. Самое большее, что я получил, это ошибка 403 (Запрещено), и я не совсем уверен, почему. Сейчас я определяю несколько переменных url в теге script и вызываю их в моей функции JS.

Определение переменных:

<script>
  var is_bookmark_url = "{% static 'img/is-bookmark.svg' %}";
  var bookmark_url = "{% static 'img/bookmark.svg' %}";
  var like_button = "{% static 'img/like-button.svg' %}";
  var liked_button = "{% static 'img/like-button-liked.svg' %}";
</script>

Вызов переменных в JS Функция:

function changeLike(id) {
    el = document.querySelector('#' + id)
    source = el.src
    if (source.substring(source.length - 26) == "/img/like-button-liked.svg" || 
        source.substring(33, 59) == "/img/like-button-liked.svg") {
        el.src = like_button_url;
    } else { 
        el.src = liked_button_url;
    }
}

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

Дело в том, что у меня возникают проблемы: я получаю сообщение об ошибке

GET https://appname.s3.amazonaws.com/img/bookmark.svg?
AWSAccessKeyId=XXXXXXXXXXXX&Signature=XXXXXXXXXXXXX%3D&Expires=1586147111 
403 (Forbidden)

Так что это определенно генерирует URL, но это запрещено. Почему это?

Answer 1

Ошибка ясно показывает, что приложение не имеет доступа к объекту S3.

Вам необходимо сделать объект S3 publi c для доступа к нему.

Чтобы опубликовать отдельный объект c, выполните следующие действия:

1. В консоли Amazon S3 выберите сегмент с объектом, который вы хотите обновить.
2. Перейдите в папку, в которой находится объект.
3. Откройте объект, выбрав ссылку на имя объекта.
4. Выберите вкладку «Разрешения».
5. Под доступом Publi c выберите Все.