Я создаю расширение chrome для хранения выделенных пользователем текстов и включения его во всплывающем окне расширения. Я пытаюсь сохранить выделенные тексты (строки) в chrome хранилище с syn c или локально, а затем получить его во всплывающем окне. Кроме того, я создал массив для хранения строк.
Любое предложение или лучший способ сделать это, используя chrome хранилище? Или лучше сделать это через обмен сообщениями? (отправка массива строк во всплывающее окно)
Манифест. json
{
"manifest_version": 2,
"name": "Information Hoover",
"version": "0.1",
"description": "Grab and store knowledge around the web",
"permissions": ["activeTab", "tabs", "declarativeContent", "storage", "contextMenus"],
"background": {
"scripts": ["background.js"]
},
"browser_action": {
"default_popup": "popup.html",
"default_title": "get highlighted text"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["content.js"]
}
]
}
Содержимое. js
let texts = [];
window.addEventListener('mouseup', getSelectionText);
function getSelectionText(){
let selectedText = window.getSelection().toString();
if (selectedText.length > 0){ // check there's some text selected
let message = {
text: selectedText
};
//chrome.runtime.sendMessage(message);
texts.push(selectedText);
console.log(message);
}
}
Фон. js
chrome.runtime.onMessage.addListener(receiver);
let highlightedTexts = [];
function receiver(request, sender, sendResponse) {
sentence = request.text;
highlightedTexts.push(sentence);
console.log(highlightedTexts);
}
всплывающее окно. js
function setup() {
let bgpage = chrome.extension.getBackgroundPage();
let texts = [];
let word = bgpage.sentence;
texts.push(word);
document.querySelector('.selectedtext').innerHTML = word;
console.log(texts);
}
setup();
всплывающее окно. html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div class="selected-text-area">
<p class="selectedtext"> </p>
</div>
<script src="popup.js"></script>
</body>
</html>