问题标签 [pngjs]

我正在将一些 RUBY 代码转换为 Javascript。此 RUBY 代码使用 ChunkyPNG Ruby 库。

这是红宝石代码：

如何将上述代码转换为 Javascript？我在转换方面面临的两条线是：

和

我可以使用什么 Javascript PNG 库来做同样的事情？

做什么

参考？是RGB中的RG吗？或者它是什么？了解这一点可以帮助我在 Javascript PNG Libraries 中找到等效的 Javascript 方法...

我正在使用 React JS 开发我的应用程序。

我知道如何在客户端/浏览器文件夹结构中导入图像

就我而言：

我想阅读该 PNG 文件，以便将其传递给 PNGJS

例如

我希望它将它传递给'pngjs'，以便PNGJS可以解析整个png文件并检查图像中每个像素的颜色等。

我努力了：

但我收到以下错误：

基本上我想要实现的是使用 pngjs 将下面的 Ruby 代码转换为 Javascript 等价物，因为 Javascript 中没有 ChunkyPNG：

我的期望：
我正在尝试从 url 读取 PNG 图像，然后用 pngjs 解析它

我得到什么：
错误：文件签名无效

我试过的：
结果urlToBuffer()肯定是一个缓冲区。我尝试了不同的编码，尝试了不同的 http 客户端等。

抛出错误的地方：
https ://github.com/lukeapage/pngjs/blob/master/lib/parser.js 行：48

我的代码：

我正在填充“imageData”，将其应用于画布，然后需要将其保存为来自 Javascript 的 RGBA 16 或 32 位图像。

我可以将其保存为这样的 PNG 图像：

但结果是缺少 Alpha 通道的 RGB png 图像。我尝试使用https://www.npmjs.com/package/pngjs来保存图像：

但这只会产生黑色图像，它再次缺少 Alpha 通道。如何从 Javascript 保存 RGBA PNG 或 TGA 图像？

我通过该方法计算的分数值对图像进行排序，该getImageScore方法包含在一个承诺中，因为加载它必须使用的像素需要相当长的时间。我观察到承诺被阻止，永远不会完成。这是最初的整个程序：

运行上面的代码会得到这个输出：

记录got buffer消息后，程序将继续运行......我看到，通过修改我吸引图像的方式，我最终会got image size在控制台中获得日志。因此，这是我修改getImageScore方法的方式：

进行这些更改后，我在控制台中得到以下输出：

从输出来看，我们可以说该str.end(buff);行存在某种问题，因为程序从不输出got str日志。在对方法进行更改之前，似乎不存在此问题getImageScore。首先，我真的不明白为什么在本地对象中加载图像会是一个会导致代码意外运行的问题。其次，修改图像的加载方式不应改变库中的end方法pngjs。有人可以解释这里实际发生的事情以及如何解决这个问题吗？

我使用此代码保存图像，但需要很长时间。有时需要 10 秒或更长时间。我减小了位图大小，它有帮助。但它也降低了质量。如何在不降低质量和速度的情况下以原始大小保存位图？

我搜索这个问题并找到这样的灵魂：

我太困惑了。我不知道如何使用它。

所以开发这个应用程序是使用firebase firestore和firebase storage的nodejs。
我想要做的是，我已经在 Firebase 存储中有几个图像。我会随机下载一张图片并对其执行 stego。为此，我需要先下载图像，以便执行隐秘操作。

此外，我的 firebase 应用程序被初始化为const firebaseApp = firebase.initializeApp(firebaseConfig);

我的 get_image() 代码如下：

我还尝试使用 XMLHTTPRequest 下载图像：

稍后在 main 函数中，我会：

我的问题是，当我运行此代码时，出现错误：

这是因为 await get_image() 并没有真正在等待。（lsbtools.js 行：59）
问题是我只调用一次 get_image()！但在控制台中，我可以看到img_data记录了3-4 次！！这很奇怪！. 对于异步，我正在使用等待，但它并不是真的在等待！

IDK这里有什么问题。我的逻辑是否错误或firebase下载以我不知道的不同方式工作！我已经尝试删除 get_image() 代码并直接在代码中使用它而没有任何函数调用仍然没有运气！

我的主要目标是确保以 RAW 格式下载图像，传递给 PNG.sync.read，然后将其传递给 stego 函数以隐藏一些数据。我首先无法下载图像！图像大小约为 326KB，我的互联网连接良好。

任何帮助表示赞赏！提前致谢

我在 stackoverflow 上阅读的问题并没有帮助我解决我的问题。

这是所有客户端代码，没有nodejs。

我有使用 Fetch api 在 response.body 中返回 png 的代码。我可以使用 File System Access Api 成功将此文件写入磁盘。在不通过 pngjs 处理 png 的情况下，图像被正确保存。

尽管 pngjs 说它接受一个可读流并且 response.body 应该是一个可读流，但 pngjs 会抛出一个错误。我的猜测是网络上的可读流与nodejs格式不同。但是，我可以将 fetch 中的数据作为 ArrayBuffer 返回，而 pngjs 将毫无问题地接受这一点。

我的问题是从 pngjs parse 方法返回的 png 已损坏，即使我实际上没有对 parsed 方法中的图像做任何事情。

这是一些代码。

//Fecth png 到 ArrayBuffer

//用pngjs解析arrayBuffer

//将文件写入磁盘

在解析方法期间，我没有对数据做任何事情，只是为了测试。

从上面的代码中，如果我只返回 arrayBufferres(arrayBuffer)文件是正确的。但是，我是否将它传递给 pngjs 解析方法，即使我没有修改它原来已损坏的文件。

当我不解析文件时，它返回正确大小的 ArrayBuffer 并写出大小为 595kb 的文件，arrayBuffer 大小为 608325

当我解析文件时，即使我没有修改它。生成的文件大小为 1024kb，ArrayBuffer 大小为 1048576。

从两个进程返回的 ArrayBuffer 都是 uint8Array 类型。

预期结果：是不是因为我没有在 pngjs 解析方法中更改文件，所以返回的 ArrayBuffer 应该是相同的大小并且文件不应该被损坏。

更新： 我尝试了不同的 png 编码器/解码器库，结果相同。