如何将服务器上的pdf在页面上预览

                    const res: any = await fetch(`${selected_content?.doc_type}`);
                       res.blob().then((v: any) => {
                        let blob = new Blob([v], { type: 'application/pdf' })
                        const url = URL.createObjectURL(blob);
                        anchorJsx = <div style={{height: '100%'}}>
                           <iframe src={url} title="pdf" width="100%" height="100%"/>
                        </div>
                        set_anchor_jsx(anchorJsx)
                    })

1.首先上述代码一行返回一个Response对象，这返回数据就是一个流stream，可以使用blob() 方法去读取，解析成Blob格式的promise对象，如下图所示：Response - Web API 接口参考 | MDNFetch API 的 Response 接口呈现了对一次请求的响应数据。https://developer.mozilla.org/zh-CN/docs/Web/API/Response

2.下面使用new Blob设定返回值v的格式为pdf，返回的依旧是一个Blob对象；

3.下面是使用 URL.createObjectURL方法，下面是官方的讲解：

解析出的url可以使用习惯的方式进行文件的预览展示，以iframe为例：

<iframe src={url} title="pdf" style={{height: '100vh', width: '100%'}} />

注：下载pdf的文件也可以使用blob对象，用a.href，download属性进行下载。