将 Webview2 Source 直接设置为二进制流
Posted
技术标签:
【中文标题】将 Webview2 Source 直接设置为二进制流【英文标题】:Set Webview2 Source directly to a binary stream 【发布时间】:2021-10-10 16:01:08 【问题描述】:我的应用程序中有一个 Webview2 控件,用于查看 PDF 文档。 该应用程序还存储和读取 MS SQL 服务器 PDF 数据。
目前,我正在从 SQL 中检索二进制数据,将它们转换为临时文件到磁盘并设置:
webview2.source = New Uri("file://" + filename)
到目前为止一切正常,但我当然希望在不读写磁盘的情况下完成这项工作。
有没有办法在不访问磁盘的情况下做同样的事情?
更新(按照推荐),我尝试过。部分代码便于理解:
Dim fieldOrdinal = reader.GetOrdinal(ColumnName)
reader.Read()
Dim blob = New Byte(reader.GetBytes(fieldOrdinal, 0, Nothing, 0, 0) - 1)
reader.GetBytes(fieldOrdinal, 0, blob, 0, blob.Length)
Dim pdfBase64 As String = Convert.ToBase64String(blob)
Dim html As String = "<!DOCTYPE html><html><head></head><body><div>" & $"<iframe width=100% height=500 src=\" & Chr(&H22) & "data:Application/pdf;base64,pdfBase64\" & Chr(&H22) & ">" & "</iframe></div></body></html>"
webview2
控件显示一个框架,但没有内容
最终更新: 这里(正确)到 VB 的翻译和工作代码:
Dim html As String = "<!DOCTYPE html><html><head></head><body><div>" & $"<iframe width=100% height=500 src=""data:Application/pdf;base64,pdfBase64"">" & "</iframe></div></body></html>"
【问题讨论】:
src
中的值需要用引号引起来。此外,反斜杠是 C# 中 "
的转义。
明白了! VB中的等价物是“”。在职的 !谢谢你们俩!
【参考方案1】:
您可以将 PDF 作为 Base64 嵌入到 IFRAME
中,就像嵌入图像一样。
在这种情况下,mime 类型当然是application/pdf
。
使用 Convert.ToBase64String() 将源 PDF 字节转换为 Base64,使用标准 HTML5 标头并将 IFRAME
和/或 DIV
容器设置为所需的大小。
使用WebView2.NavigateToString() 方法加载带有嵌入 PDF 的 HTML:
string pdfBase64 = Convert.ToBase64String([Your PDF bytes]);
string html = "<!DOCTYPE html><html><head></head><body><div>" +
$"<iframe width=100% height=500 src=\"data:application/pdf;base64,pdfBase64\">" +
"</iframe></div></body></html>";
webView2.NavigateToString(html);
VB.Net 版本:
Dim pdfBytes = [DataReader].GetSqlBytes([DataReader].GetOrdinal("[Column Name]")).Value
Dim pdfBase64 As String = Convert.ToBase64String(pdfBytes)
Dim html As String = "<!DOCTYPE html><html><head></head><body><div>" &
$"<iframe width=100% height=500 src=""data:Application/pdf;base64,pdfBase64"">" &
"</iframe></div></body></html>"
webView2.NavigateToString(html)
iframe
的大小不应该这样设置,您应该使用 CSS 样式(并且可能使用简单的 javascript 来处理 late 重新定义包含您的 PDF 的窗口的大小)。
您可以构建一个简单的 HTML 模板并按照描述填充 Base64 内容。
【讨论】:
【参考方案2】:只是为了最终确定答案。在我使用的最终版本下方,包括框架 HTML 中的 CSS 以使 pdf 无边框和父 webview2
的 100% x 100% 大小:
Dim pdfBase64 As String = Convert.ToBase64String(pdfBytes)
Dim html As String = "<!DOCTYPE html><html><head>
</head>
<style>
body margin: 0;
iframe display: block; background: #000; border: none; height: 100vh; width: 100vw;
</style>
<body>" & $"<iframe src=""data:Application/pdf;base64,pdfBase64"">" & "</iframe></body></html>"
【讨论】:
以上是关于将 Webview2 Source 直接设置为二进制流的主要内容,如果未能解决你的问题,请参考以下文章
通过 WebView2 将对象从 .NET 设置为 JavaScript 代码
WebView2:在 C# 中从 Javascript 代码设置对象属性