Javascript 图像预览和网络工作者

是否可以在web worker中使用filereader api来加载图像（即用于预览/缩略图），从而防止主ui线程阻塞

---

类似于将cpu密集型部分（主要是读取文件内容和缩放图像）包装到web worker中，从worker访问页面的DOM级别是不可能的，因此您无法创建图像对象或画布（用于缩放部分），因此答案是否，因为您想要操作图像

---

虽然可以通过ajax或

FileReaderSync

在web worker上加载图像文件，将其转换为base64数据url字符串并发送回主脚本，但无法操纵图像以创建缩略图。（除非您知道png/jpg/bmp格式的文件规范，并且想要硬编码一个直接在二进制字符串上工作的缩放函数，否则看起来不是很好吧？

主线程称为UI线程，因为与UI直接相关的所有事情都必须在那里发生。您不能在Web Worker中操作DOM，但可以在Web Worker中操作图像文件的二进制文件。在图像处理之后，您必须将数据传输到主线程，并让它将其附加到DOM。然后浏览器将在主线程中呈现此图像。

如果可以，这是可能的

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

读点什么：

---

写下整个脚本将超出范围。

请参阅此处了解可供工作人员使用的内容：