Перемещение сообщений из `content.js` в App.js в Reaction-Create-App при создании google-chrome-extension - PullRequest
Новая
       8

Перемещение сообщений из `content.js` в App.js в Reaction-Create-App при создании google-chrome-extension

1 голос
/ 22 сентября 2019

Я использую библиотеку react-create-app для создания расширения google-chrome.Он пытается отправить сообщение из файла content.js в App.js и отобразить его как предупреждение и в console.log.У меня нет ошибок.Предупреждение не появляется и ничего не отображается в console.log.Кто-то может посоветовать вам.Расширение запускается нормально.

Структура проекта 

   project
        build
        node_modules
        public
            /assets
        content.js
        favicon.ico
        index.html
        manifest.json
        src
            App.js
        .gitignore
        package.json

manifest.json 

{
  "manifest_version": 2,
  "name": "chrome extension",
  "description": "Chrome extension",
  "version": "0.0.1",
  "content_scripts": [
    {
      "js": ["content.js"],
    }
  ],
  "browser_action": {
    "default_popup": "index.html",
    "default_title": "Open the popup"
  },
  "icons": {
    "16": "assets/icon-128.png",
    "48": "assets/icon-128.png",
    "128": "assets/icon-128.png"
  },
  "permissions": [],
  "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"
}

содержимое.js 

/*global chrome*/
var timer = 0;
var si = setInterval(() => {
  try {
    chrome.runtime.sendMessage(
      {
        data: 'Hello popup, how are you'
      },
      function(response) {
        console.dir(response);
      }
    );
    timer++;
    if (timer === 5) {
      clearInterval(si);
    }
  } catch (error) {
    // debugger;
    console.log(error);
  }
}, 2000);

App.js 

/*global chrome*/
import * as React from 'react';
import Form from './components/form/Form';

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
  alert('I am popup!');
  console.log('I am popup');
  sendResponse({
    data: 'I am fine, thank you. How is life in the background?'
  });
});

function App() {
  return <Form />;
}

export default App;
...