Chrome拓展:将本地文件上传到服务器
需求:在 content-script 中选择本地文件,将File对象传到 background 中进行跨域请求,再返回请求结果到 content-script。
问题:使用 elementui upload组件获取本地文件打印出 File 对象没有问题.
在 content-script 中通过 chrome.runtime.sendMessage() 方法传到 background.
在background 中使用 chrome.runtime.onMessage.addListener 进行监听接收到的数据打印出来就变成了 [object],File对象内容丢失了。
网上查阅资料后知道:谷歌扩展只能传输和 JSON 兼容的数据,可通过 JSON.parse(JSON.stringify(form_data))判断兼容与否。
Blob 和 JSON 不兼容。
解决方案:要上传文件,可通过发送方将 Blob 对象转换为 dataURL,接收方解析回 Blob 对象,再生成 FormData 对象上传文件。
content-script 中:
background 中:
以上记录Chrome拓展中上传本地文件解决方法。