如何从Javascript获取AWS静态文件URL?

伊夫林·钦(Evelyn Chin)

我正在尝试从我的AWS S3存储桶中获取一些静态图像的URL。我有几个JavaScript函数可以更改用户单击的图像(单击类似按钮将其变为绿色)。我无法使这些图像正常工作。我得到的最远的错误是403错误(禁止访问),我不确定原因为何。现在,我在script标签中定义了一些url变量,并在我的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;
    }
}

(我知道我的功能与优雅的功能相反,但是我不确定其他如何从网址中获取图片名称,但至少可以正常工作。)

我遇到麻烦的地方是我遇到了错误

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

因此,它肯定会生成一个url,但是它是被禁止的。这是为什么?

索艾尔·阿什拉夫(Sohail Ashraf)

该错误明确表明该应用无权访问该S3对象。

您需要使S3对象公开才能访问它。

要将单个对象公开,请按照下列步骤操作:

  1. 在Amazon S3控制台中,选择包含您要更新的对象的存储桶。
  2. 导航到包含对象的文件夹。
  3. 通过选择对象名称上的链接来打开对象。
  4. 选择“权限”选项卡。
  5. 在“公共访问”下,选择“所有人”。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章