Angular base64转换为pdf返回#Blocked

Question

将我从java服务响应返回的base64流数据转换为在我的角度应用程序上以PDF格式下载，使用atob（）解码然后将其添加到下载函数。转换发生正确，但在下载时会发生一些错误，实习生返回一个#blocked空白屏幕，下面附有图片。这也是我对同一功能的代码的一部分，可以提前请求可能出现问题的帮助

onSubmitPropPreviewPDF() {
        console.log(this.propNo)
        let formValueProp: any = {
            trans_code: this.propNo.data.trans_code,
        }
        this.policyService.propPreviewPDF(formValueProp)
            .pipe()
            .subscribe(previewdata => {
                this.previewdata = previewdata,
                    console.log('previewdata: ', previewdata);
                console.log(atob(this.previewdata.data.pdf_ccnt));
                const linkSource = (atob(this.previewdata.data.pdf_ccnt));
                console.log(linkSource);
                const downloadLink = document.createElement("a");
                console.log(downloadLink);
                const fileName = "sample.pdf";
                downloadLink.href = linkSource;
                console.log(linkSource);
                downloadLink.download = fileName;
                console.log(linkSource);
                console.log(downloadLink);

                downloadLink.click();

                (error: any) => this.errorMessage = <any>error


            }
            )
    }

Answer 1

基于Chromium commit：

将#blocked后缀添加到about：从FilterURL输出的空白URL。

RenderProcessHost :: FilterURL执行一些安全检查，检查来自渲染器进程的URL是否有效。在某些情况下，它会将URL重写为about：blank，以避免提交对渲染器进程无效的URL。

此CL将一个#blocked引用片段添加到URL，因此更容易发现此逻辑何时生效并将其与常规导航区分为：空白URL。

您的sample.pdf是否在包含<embed>或<a>以及base64数据网址的简单html页面中正确显示？

尝试将sample.pdf转换为base64并在测试页面上显示它以验证它是否格式良好：

<embed  type="application/pdf" src="data:application/pdf;base64,xxx_your_base64_pdf_xxx"/>

或者尝试通过右键单击下载链接下载它：

<a href="data:application/pdf;base64,xxx_your_base64_pdf_xxx">download</a>

如果您的PDF格式正确，您还可以使用像FileSaver.js这样的库来继续下载步骤。