Question

我想在iframe中显示PDF文件，但是此文件在JWT令牌的保护下受到保护，因此我使用以下代码构建了iframe：

const MyFrame = ({ token, src, type, ...otherProps }) => {
    const [blobObject, setBlobObject] = useState(null);

    const method = 'GET';
    const authorization = `Bearer ${token}`;
    const headers = new Headers({ authorization, type });
    const options = { method, headers };

    useEffect(() => {
        fetch(src, options)
            .then(response => response.blob())
            .then(response => {
                var blob = new Blob([response], { type });
                const obj = URL.createObjectURL(blob);
                setBlobObject(obj);
            });
    }, []);

    return <iframe src={blobObject} {...otherProps} />;
};

用法：

<MyFrame src="..." token={myToken} type="application/pdf" />

虽然可行，但在浏览PDF文件时会出现某些问题。如果我单击PDF内的任何链接，新页面将不会加载到框架上，而是会加载到主页上。

有没有办法让这些链接在新标签页中打开？

注意： 我不知道它是否重要，但可能值得一提，在控制台中，我收到以下警告：

资源被解释为文档，但以MIME类型application / pdf传输：“ blob：http://localhost:3000/43452329-a89f-4e95-a9d7-1a68df2213be”。

在新标签页中打开的iframe中来自Blob PDF的链接

0 个答案: