iframe 不显示 S3 存储的 PDF答案

【问题标题】：Iframe not showing S3 stored PDFiframe 不显示 S3 存储的 PDF
【发布时间】：2019-10-03 11:34:33
【问题描述】：

我有一个使用 EF 和 C# 构建的应用程序，并使用 Amazon S3 作为文件服务器。我所做的是将一些 PDF 上传到 S3 并将其 URL 存储在我的数据库中，然后将其显示在应用程序中。我使用会话将模型传递给视图，然后使用 For Each 遍历 URL，并为每个 URL 创建一个新的 iframe，如下所示：

@{int i = 1;}
@foreach (var tempimg in (List<TempImage>)Session["TempImages"])
{
    <fieldset class="invoiceFieldsets" data-step="@i" id="FieldSet_@i" hidden>
        <div class="row">
            <div class="col-xs-4">
                <div class="fixed-actions invoiceContainer">
                    <div class="card text-center" id="Picture_@i" style="width:450px;height:500px;background-color:ghostwhite;border:none">
                        @*<div class="card-header">
                                Profit and Loss
                            </div>*@
                        <input type="hidden" id="ImagePath_@i" runat="server" value="@tempimg.ImagePath" hidden />
                        <div class="card-body" display="inline-block" id="imagepreview_@i" style="background-image:url(@tempimg.ImagePath)" hidden>
                            <iframe id="pdfviewer_@i" src="@tempimg.ImagePath" style="width:500px; height:500px;" sandbox="allow-same-origin" hidden></iframe>

                            @*<embed width="500" height="500" name="plugin" id="pdfviewer_@i" src="@tempimg.ImagePath" type="application/pdf">*@

                        </div>

                    </div>
                </div>
            </div>

根据值（即如果返回的 URL 包含 .pdf），我隐藏或取消隐藏 iframe：

var imgtype = $("#ImagePath_"+current).val();
if (imgtype.indexOf(".pdf") >= 0) {
    $("#pdfviewer_"+current).prop('hidden', false);
    $("#pdfviewer_"+current).attr('src', imgtype);
}
else {
    $("#imagepreview_"+current).prop('hidden', false);
}

我一直遇到的问题是图片显示正确，但 PDF 没有显示。我确实收到了来自谷歌的 CORBS 的警告，但我什至尝试绕过它，但它仍然无法正常工作。你能帮我解决这个问题吗？

【问题讨论】：

标签： c# jquery amazon-s3 razor model-view-controller

【解决方案1】：

我发现了问题。我发现在定义iframe 时，这部分代码sandbox="allow-same-origin" 导致了这个问题。一旦我删除它，它就开始工作了。我希望这可以帮助遇到同样问题的其他人。

【讨论】：