0

我正在研究谷歌扩展。我正在尝试处理我的 popup.tsx 和 background.ts 之间的消息传递

在从我的 background.ts 发送消息之前，我打印数据。数据存在。但是，在我的 popup.tsx chrome.runtime.onMessage 中没有触发。我不明白哪个功能不起作用以及问题出在哪里。我检查了很多示例，但结果仍然相同。问题是什么？我正在添加我的消息传递代码..

这是我的 background.ts runtime.sendMessage 函数。该函数位于另一个名为“collectData”的函数中。当我打开新标签或更新标签时，此功能会触发并起作用。每次这个数据工作稳定。我可以看到每一页的数据。

chrome.runtime.sendMessage({
    msg: 'url_data',
    data: data,
  })

然后，我尝试使用 runtime.onMessage 在我的 popup.tsx 中接收数据。当我重置扩展时，它有时只工作一次，然后 onMessage 函数根本不起作用：

const [requestData, setRequestData] = useState<string>()

 chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
    console.log(' popup runtime on message req', request)
    if (request.msg === 'url_data') {
      checkWebsite(request.data).then((res) => {
        console.log('popup data alındı')
        console.log('popu res', res)
        setRequestData(res)

        // chrome.runtime.sendMessage({
        //   msg: 'res_length',
        //   data: res.matches.length,
        // })
        // console.log('popup data res length gönderildi')

        // res.matches.length === 0 ? setIsSecure(true) : setIsSecure(false) 
        setHost(request.data.hostname)
      })
      sendResponse({ message: 'res length sended' })
      console.log('res length response send')
    }
  })

每次，我都会更改请求数据状态。如果它发生变化，我想用 useEffect 更新弹出窗口。

useEffect(() => {
    console.log('useeffect', requestData)
  }, [requestData])

结果，首先，主要问题是消息传递。为什么它不工作？

4

0 回答 0