数据 URI 哈希参数(隐藏数据 URI 的 PDF 工具栏)
Data URI Hash Parameters (Hide PDF toolbar for data URI)
我有一个 PDF base64 编码数据 URI。
例如:
return <object data="data:application/pdf;base64,JVBERi0xLjMKJf////8KOCAwIG9...VmCjI0MTU4OAolJUVPRgo=" type="application/pdf"></object>
我可以毫无问题地将它嵌入到页面中。但是,默认情况下,浏览器在 PDF 中包含一个工具栏。
似乎禁用此工具栏的唯一方法是在 url 的末尾包含一些哈希参数。
例如
<object data="path/to/file.pdf#toolbar=0&navpanes=0&scrollbar=0" type="application/pdf"></object>
如果通过相对路径或 URL 访问 PDF,这很好用,但我想不出一种方法来使用数据 URI。
有没有办法在 URI 的末尾包含这些哈希参数?
或者有人知道用其他方式隐藏此工具栏的方法吗?
非常感谢任何帮助。提前致谢。 :)
我自己也处于同样的位置,而且,不幸的是看着
https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs
声明(在"common problems"内):
No support for query strings, etc.
The data portion of a data URI is opaque, so an attempt to use a query string (page-specific parameters, with the syntax ?parameter-data) with a data URI will just include the query string in the data the URI represents.
好像说明这是不可能的
如果您试图阻止打印 PDF,并且可以访问生成它的代码(例如 iText),您可以使用类似于(加密文档)的代码以编程方式禁用打印按钮
stamper.setEncryption(null,null, PdfWriter.HideWindowUI, PdfWriter.STRENGTH40BITS);
stamper.setViewerPreferences(PdfWriter.HideToolbar);
但是这不会阻止文档的保存。 (看 :
http://developers.itextpdf.com/question/how-disable-save-button-and-hide-menu-bar-adobe-reader)
如果能够将 has 参数传递给嵌入(或对象)元素就好了,但是哼哼。
就像 kolin 所说的那样,没有办法直接发送带有数据 URI 的查询字符串。但是,您可以将数据 URI 转换为 blob URL 并在其中传递参数。
只需获取您的 base64 数据并将其转换为 pdf blob,如下所示:
function b64toBlob(b64Data, contentType) {
var byteCharacters = atob(b64Data)
var byteArrays = []
for (let offset = 0; offset < byteCharacters.length; offset += 512) {
var slice = byteCharacters.slice(offset, offset + 512),
byteNumbers = new Array(slice.length)
for (let i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i)
}
var byteArray = new Uint8Array(byteNumbers)
byteArrays.push(byteArray)
}
var blob = new Blob(byteArrays, { type: contentType })
return blob}
然后使用 createObjectURL 方法创建一个 URL 你可以像这样放置查询字符串:
URL.createObjectURL(b64toBlob(data.buffer.data, 'application/pdf')) + '#toolbar=0&navpanes=0&scrollbar=0'
将对象的数据属性设置为生成的字符串,您将拥有它。
昨天我也遇到了类似的问题并找到了有效的解决方案。当您在 URI 中使用 base64 并尝试设置默认行为 none(#toolbar=0&navpanes=0&scrollbar=0&) 时,src 无法检测以“#”开头的边界。你可以用这个来获得想要的结果 data:application/pdf;#toolbar=0&navpanes=0&scrollbar=0&;base64,your_base64_string
。
根据您的代码,您可以 return 像这样:
return <object data="data:application/pdf;#toolbar=0&navpanes=0&scrollbar=0&;base64,JVBERi0xLjMKJf////8KOCAwIG9...VmCjI0MTU4OAolJUVPRgo=" type="application/pdf"></object>
希望这对您和其他人有所帮助。
你只需要在 Url 标签后的数据 Url 中添加 '#toolbar=0&' 来隐藏 pdf 查看器中的工具栏,如下所示-
- 数据:application/pdf;#toolbar=0;base64
我有一个 PDF base64 编码数据 URI。
例如:
return <object data="data:application/pdf;base64,JVBERi0xLjMKJf////8KOCAwIG9...VmCjI0MTU4OAolJUVPRgo=" type="application/pdf"></object>
我可以毫无问题地将它嵌入到页面中。但是,默认情况下,浏览器在 PDF 中包含一个工具栏。
似乎禁用此工具栏的唯一方法是在 url 的末尾包含一些哈希参数。
例如
<object data="path/to/file.pdf#toolbar=0&navpanes=0&scrollbar=0" type="application/pdf"></object>
如果通过相对路径或 URL 访问 PDF,这很好用,但我想不出一种方法来使用数据 URI。
有没有办法在 URI 的末尾包含这些哈希参数?
或者有人知道用其他方式隐藏此工具栏的方法吗?
非常感谢任何帮助。提前致谢。 :)
我自己也处于同样的位置,而且,不幸的是看着
https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs
声明(在"common problems"内):
No support for query strings, etc. The data portion of a data URI is opaque, so an attempt to use a query string (page-specific parameters, with the syntax ?parameter-data) with a data URI will just include the query string in the data the URI represents.
好像说明这是不可能的
如果您试图阻止打印 PDF,并且可以访问生成它的代码(例如 iText),您可以使用类似于(加密文档)的代码以编程方式禁用打印按钮
stamper.setEncryption(null,null, PdfWriter.HideWindowUI, PdfWriter.STRENGTH40BITS);
stamper.setViewerPreferences(PdfWriter.HideToolbar);
但是这不会阻止文档的保存。 (看 : http://developers.itextpdf.com/question/how-disable-save-button-and-hide-menu-bar-adobe-reader)
如果能够将 has 参数传递给嵌入(或对象)元素就好了,但是哼哼。
就像 kolin 所说的那样,没有办法直接发送带有数据 URI 的查询字符串。但是,您可以将数据 URI 转换为 blob URL 并在其中传递参数。
只需获取您的 base64 数据并将其转换为 pdf blob,如下所示:
function b64toBlob(b64Data, contentType) {
var byteCharacters = atob(b64Data)
var byteArrays = []
for (let offset = 0; offset < byteCharacters.length; offset += 512) {
var slice = byteCharacters.slice(offset, offset + 512),
byteNumbers = new Array(slice.length)
for (let i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i)
}
var byteArray = new Uint8Array(byteNumbers)
byteArrays.push(byteArray)
}
var blob = new Blob(byteArrays, { type: contentType })
return blob}
然后使用 createObjectURL 方法创建一个 URL 你可以像这样放置查询字符串:
URL.createObjectURL(b64toBlob(data.buffer.data, 'application/pdf')) + '#toolbar=0&navpanes=0&scrollbar=0'
将对象的数据属性设置为生成的字符串,您将拥有它。
昨天我也遇到了类似的问题并找到了有效的解决方案。当您在 URI 中使用 base64 并尝试设置默认行为 none(#toolbar=0&navpanes=0&scrollbar=0&) 时,src 无法检测以“#”开头的边界。你可以用这个来获得想要的结果 data:application/pdf;#toolbar=0&navpanes=0&scrollbar=0&;base64,your_base64_string
。
根据您的代码,您可以 return 像这样:
return <object data="data:application/pdf;#toolbar=0&navpanes=0&scrollbar=0&;base64,JVBERi0xLjMKJf////8KOCAwIG9...VmCjI0MTU4OAolJUVPRgo=" type="application/pdf"></object>
希望这对您和其他人有所帮助。
你只需要在 Url 标签后的数据 Url 中添加 '#toolbar=0&' 来隐藏 pdf 查看器中的工具栏,如下所示-
- 数据:application/pdf;#toolbar=0;base64