HTML5 剪贴板 API 和 Photoshop 透明像素 (PNG)答案

【问题标题】：HTML5 Clipboard API and Photoshop Transparent Pixels (PNG)HTML5 剪贴板 API 和 Photoshop 透明像素 (PNG)
【发布时间】：2013-01-16 10:24:44
【问题描述】：

我正在尝试在 Photoshop 中选择半透明纹理并将其粘贴到 HTML5 剪贴板 API 中并保持其透明度。

我只是花了很多时间研究这个。一段时间以来，我在制作原型时使用 Photoshop 复制半透明纹理（目标为 Axure RP）。

现在，我尝试在 html 5 中使用新的剪贴板 API。我剖析了此过程生成的 PNG 文件。

如果我使用矩形选框通过剪贴板 API 将半透明纹理复制到浏览器，它会将 alpha 字节设置为 FF（完全不透明）。

如果我使用拖放 API 将“另存为 Web”PNG 24 文件复制到浏览器，它会按预期工作并且透明像素工作（并且 alpha 字节不会强制为 FF）。

我尝试了许多不同的文件格式，例如 24 位深度、更改图层的透明度、填充等。

注意：尽管 Photoshop 说它是 24 位的，但它实际上仍将其导出为 8 位（以及一大堆无用的文本数据）。

有谁知道是否有一种解决方法可以使用剪贴板 API 将 Photoshop 剪贴板选择项放入浏览器，以便保留 alpha 值？

提前谢谢...

更新： - 我使用的是 Chrome 版本 24.0.1312.56 m

【问题讨论】：

标签： html drag-and-drop png photoshop

【解决方案1】：

据我了解，您需要粘贴当前保存在剪贴板中的 Photoshop 规范吗？目前，剪贴板 API 规范不完整，其最新更新的工作草案（2012 年 2 月 23 日）。如果我们查看specification 的第 10 节：这些是强制性的 mime 类型：

text/plain
text/uri-list
text/csv
text/css
text/html
application/xhtml+xml
image/png
image/jpg
image/gif
image/svg+xml
application/xml, text/xml
application/javascript
application/json

您的问题取决于您使用的浏览器，如果它实现了该功能并支持 Photoshop，那么您也许可以这样做。

[1]http://www.w3.org/TR/clipboard-apis/#introduction

【讨论】：

谢谢。我看看能不能用 Chrome 提交错误报告。