从React应用中的s3预签名URL超时中捕获403错误

问题描述

我从s3存储桶中获取了一个预签名的url，超时时间为15分钟（我知道这可以增加，但是出于安全原因，我希望避免长时间过期）。

15分钟后，当我尝试使用此URL时，我的React应用程序控制台中出现403错误。

我无法以通常的方式捕获此错误，因为我实际上没有调用函数来获取此错误，当URL超时时，它来自aws。

我想调用此函数，以在遇到此403错误后立即获取已签名的url，以便它在用户不知情的情况下进行更新，但是我无法捕获它。

有人对此有任何建议吗？

我可以使用setTimeout函数在15分钟后获取另一个签名的url，但想知道是否有更好的方法来处理此问题。

谢谢

解决方法

该问题缺乏具体内容，因此我在这里进行一些假设。

您应该反过来做。与其预先获取签名的URL并等待用户做一些使用它的事情（例如，单击按钮），不如先获得签名的URL，只有在用户单击按钮时才生成签名的URL。这样，您无需担心过期，因为URL在签名后几秒钟就被使用。

例如，如果要在用户单击按钮时打开文件，请使用：

button.addEventListener("click",() => {
    // get the signed URL
    const response = await fetch("<backend url>");
    if (!response.ok) {
        throw new Error();
    }
    const url = await response.text();
    // use the URL
    window.href = url;
}