在 pdf 的嵌入中添加 s3 签名的 url 不起作用答案

【问题标题】：Adding s3 signed url in embed for a pdf doesn't work在 pdf 的嵌入中添加 s3 签名的 url 不起作用
【发布时间】：2019-03-01 19:33:04
【问题描述】：

看起来像的网址 https://abc.s3.ap-south-1.amazonaws.com/1/2/4/2018/26/pdf.pdf_1537903203247/V0/output/pdf.pdf?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=Q434A%2F200926%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20180926T053715Z&X-Amz-Expires=900&X-Amz-Signature=f3996e2401e95e7ebd071187fd55ead39c5296b1cf4d968&X-Amz-SignedHeaders=host

没有显示，但是 url 是单独下载的。我在这里修改了 url。但是如果在不同的选项卡中打开，实际的 url 可以工作并下载 pdf。有解决办法吗？

【问题讨论】：

您的实际问题是什么？
@JohnRotenstein 我从 s3 签名的 url 获取的 pdf 没有加载到 html 的嵌入标签中。但是其他本地 pdf 文件可以。我怎样才能让它工作？
在 S3 控制台中，当您检查对象元数据时，是否显示Content-Type: application/pdf？
@Michael-sqlbot 它是应用程序/八位字节流，如果它是应用程序/pdf，它会显示出来，但我有另一个问题。我将此文件作为块或多部分上传。我不确定如果我可以申请/pdf 并且仍然可以使用分段上传。
是的，你可以。这是在开始分段上传时完成的。

标签： html pdf amazon-s3 embed pre-signed-url

【解决方案1】：

正如@Michael-sqlbot 正确指出的那样。内容类型必须是应用程序/pdf。 Javascript 代码供参考：

var s3 = new AWS.S3({
            apiVersion: '2006-03-01',
            region: 'ap-abc-1',
            params: {
                Bucket: BucketName,
                ServerSideEncryption: "AES256",
                ContentType: 'application/pdf'
            }
        });

浏览器理解 url 实际上是一个 pdf 是有道理的，有必要将这个内容类型添加到它。但是，我想指出，对于其他文件类型，如 mp3、mp4、jpg、 png 等。在我的特定情况下，这不是必需的。不知道它是否普遍正确。

【讨论】：

【解决方案2】：

如果你想在 iframe 中打开 pdf 文件，那么你可以从后端编写 base64 字符串，然后在 UI 中将 base64 字符串转换为 blob url。

let base64strds = 'base64pdfstring';
// decode base64 string, remove space for IE compatibility
var binary = atob(base64strds.replace(/\s/g, ''));
var len = binary.length;
var buffer = new ArrayBuffer(len);
var viewers = new Uint8Array(buffer);
for (var i = 0; i < len; i++) {
    viewers[i] = binary.charCodeAt(i);
}

// create the blob object with content-type "application/pdf"               
var blob = new Blob( [viewers], { type: "application/pdf" });
var url = URL.createObjectURL(blob);

var objFra = document.createElement('iframe');   // Create an IFrame.
        objFra.style.visibility = "hidden";    // Hide the frame.
        objFra.src = url;                      // Set source.
        document.body.appendChild(objFra);  // Add the frame to the web page.
        objFra.contentWindow.focus();       // Set focus.
        objFra.contentWindow.print();

【讨论】：

嗨 Rohit，感谢您的评论，但是我们不想在场景中包含任何后端。感谢您的努力。