Amazon S3 签名 Url 无法与 Office Web Apps Viewer 配合使用（encodeURIComponent 不起作用）

Question

我正在尝试使用 iframe 标签嵌入“Office Web Apps Viewer”，以在我的网站上显示电子表格预览。我尝试使用encodeURIComponent对url进行编码，但它显示“我们正在获取您的文件”加载栏，但没有任何反应。预先感谢。

const originalUrl ="https://exampleDomain.amazonaws.com/Folder/Filename.xlsx?algorithm=algorithmName&credential=region&date=date&expires=time&token=encryptedToken&signature=encryptedSignature&headers=example"
const encodedUrl = encodeURIComponent(originalUrl);
const iFrameUrl = `https://view.officeapps.live.com/op/embed.aspx?src=${encodedUrl}`;
<iframe title="l" src={iFrameUrl} style={{ maxHeight: 'auto', maxWidth: 'auto'}} />

注意：上述代码通过替换 src = https://docs.google.com/viewer?url=yourUrl&embedded=true

与 google docs 一起使用

Answer 1

我也刚刚遇到这个问题，所以我做了一些挖掘。如果 URL 中存在任何

GET

变量，则似乎会失败。我突然想到一个想法，即使用 URL 重定向来屏蔽 S3 URL，并且这很有效。 （我使用 bit.ly 创建了一个没有任何

GET

变量的重定向）

显然，这不是一个出色的解决方案，但它确实有效。如果您拥有服务器，您可以创建自己的后端来生成这些不包含

GET

变量的 URL。

然后您可以生成以下格式的 URL：

https://example.com/api/s3request/s3_domain_path/get_param_1/getparam_2/get_param_3/etc/

这将返回重定向到：

https://s3_domain_path?X-Amz-Security-Token=get_param_1&X-Amz-Algorithm=get_param_2

Answer 2

我遇到错误，请使用encodeURIComponent(url)解决。