浏览器插件传递对象、上传文件


Web页面或浏览器插件的 content script 脚本均无法将Form表单中的 File 对象发送至浏览器插件的 background page 中;因为所有消息传递的方式都要求数据内容是JSON可序列化的,而DOM节点、File文件对象等都不是JSON可序列化的;因此,发送至 background page 的数据,File对象都会丢失。而现代浏览器只允许在 background page 中进行跨域请求;


经过大量的寻找,找到如下两种方式将File对象传递至 background page :

方式一:使用 URL.createObjectURL(fileObj) 为File对象创建一个临时URL, 然后在 background page 中通过此临时URL获取File对象。

方式二:使用 SharedWorker 共享线程来进行消息通迅,SharedWorker消息通迅支持对象传递,但它兼容性差,不支持IE、Edge、Safari。


考虑到兼容性,推荐使用方式一;但方式一最终只能通过异步的方式获取File对象,而javascript是单线程执行的。

如下,是这两种方式的相关资料:

https://stackoverflow.com/questions/24193578/pass-input-file-to-background-script

https://stackoverflow.com/questions/21086918/does-chrome-runtime-support-posting-messages-with-transferable-objects/21101597#21101597

https://stackoverflow.com/questions/24211073/chrome-extension-crashes-when-i-try-to-upload-a-big-file


https://juejin.im/post/5c10e5a9f265da611c26d634

https://www.zhuwenlong.com/blog/article/590ea64fe55f0f385f9a12e5

https://developer.mozilla.org/zh-CN/docs/Web/API/SharedWorker

https://developer.mozilla.org/zh-CN/docs/Web/API/Worker


举报

© 著作权归作者所有


1