图像预览和网络工作者

Image previews and web workers

本文关键字：网络工作者图像更新时间：2023-09-26

是否可以在web工作程序中使用filereader api加载图像，即预览/缩略图，从而防止主ui线程被阻塞。

类似于此，但将cpu密集型部分（主要是读取文件内容和缩放图像）封装在web工作程序中

工作人员无法访问页面的DOM级别，因此您无法创建Image对象或画布（用于缩放部分），因此答案是否定的，因为您想要操作图像。

不过，可以通过ajax或FileReaderSync在网络工作者上加载图像文件，将其转换为base64数据url字符串并将其发送回主脚本，但无法通过操作图像来创建缩略图。（除非你知道png/jpg.bmp格式的文件规范，并且想对直接在二进制字符串上工作的缩放函数进行硬编码，否则看起来不太好吗？）

主线程被称为UI线程，因为与UI相关的一切都必须直接发生在那里。您不能在WebWorker中操作DOM，但可以在WebWorkers中操作图像文件的二进制文件。在图像操作之后，您必须将数据传输到主线程，并让它将其附加到DOM。然后浏览器将在主线程中渲染此图像。

如果可以的话，这是可能的。

从工作者向服务器发出ajax请求，将responseType设置为arraybuffer，将responseText设置为response
在服务器上，假设PHP将请求的图像加载到GD表示中（createImageFromJpeg）
获取每个像素信息（imagecolorat）
提取RGBA颜色，（打包）每个颜色并将它们添加到字符串中
把那个字符串发回给工人
根据响应创建一个新的Uint8Array
做一些操作
将所有权提交给主脚本
将数据添加到画布中

阅读：发送Arraybuffer，可传输对象

把整个剧本写下来会超出范围。