在弹出窗口中从网页访问<input type =“file”/>属性

时间:2017-09-21 07:23:51

标签: javascript firefox-webextensions browser-extension

在网页中,我有一个<input type='file'>标记。选择文件后,我通过后台脚本将其从内容脚本传递到弹出脚本。

然后我尝试访问文件列表的length属性(在弹出窗口中)。抛出错误Error: Permission denied to access property "length"

我该如何解决?我需要特殊权限吗?

我使用的是Firefox 55.0.3(64位)。

--------- ---------代码

content.js

const nodes = document.querySelectorAll('input[type=file]')
nodes.forEach(node => {
  node.onchange = event => browser.runtime.sendMessage({type: 'changed', files: event.target.files})
})

background.js

let files
browser.runtime.onMessage.addListener((message, sender, sendResponse) => {
  if (message.type === 'changed') files = message.files
  if (message.type === 'request_files') sendResponse({files: files})
})

popup.js

browser.runtime
  .sendMessage({type: 'request_files'})
  .then(response => console.log(response.files.length)) // Error here!

popup.html

<!DOCTYPE html>
<html lang='en'>
<head>
  <meta charset='UTF-8'>
  <script src='popup.js'></script>
</head>
<body></body>
</html>

的manifest.json

{
  "background": {
    "scripts": ["background.js"]
  },
  "content_scripts": [{
    "matches": ["<all_urls>"],
    "js": ["content.js"]
  }],
  "browser_action": {
    "default_popup": "popup.html"
  },
  "manifest_version": 2
}

test.html(测试扩展名)

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Demo</title>
</head>
<body>
<input type='file'>
</body>
</html>

0 个答案:

没有答案