Вопрос или проблема
Я пытаюсь написать расширение для браузера (для Chrome), которое запрашивает определенную ссылку на начальной странице, открывает её, запрашивает определённую ссылку на новой странице и снова открывает её. Мне удалось открыть первую ссылку. Однако вторая ссылка не открывается. Это проблема с разрешениями или что я могу сделать? Создание расширений для браузеров очень новое для меня, поэтому, возможно, я упускаю что-то очевидное.
manifest.json
{
"manifest_version": 3,
"name": "открывалка ссылок",
"version": "1.0",
"description": "открывает ссылки. Я надеюсь?",
"permissions": [
"tabs",
"activeTab",
"scripting"
],
"action": {
"default_popup": "popup.html"
}
}
popup.html
<!DOCTYPE html>
<html>
<head>
<title>открывалка ссылок</title>
<style>
body { width: 400px; padding: 20px; }
#count { font-size: 16px; font-weight: bold; }
</style>
</head>
<body>
<div>
<span>Открытые ссылки</span>
<span id="count">-</span>
</div>
<script src="popup.js"></script>
</body>
</html>
popup.js
function openLinks(){
const linksA = document.querySelectorAll("li[id='3']");
for (const linkA of linksA){
const iconList = linkA.querySelectorAll("i.icon.NextPage");
if (iconList.length > 0){
const link = iconList[0].parentElement.href;
if (link != null){
var pageA = window.open(link, "_blank");
const linkB = pageA.document.querySelector("source").src;
window.open(linkB, "_blank");
return linkB;
}
}
}
return "_err";
};
document.addEventListener('DOMContentLoaded', () => {
chrome.tabs.query({ active: true, currentWindow: true }, tabs => {
chrome.scripting.executeScript({
target: {tabId: tabs[0].id},
func: openLinks
});
});
});
Мне также удалось перейти только со второй части кода с страницы A на страницу B. Но как только я пытаюсь связать это, это не работает.
Ответ или решение
Чтобы решить вашу проблему с открытием цепочки ссылок в браузере с помощью расширения для Chrome, необходимо учесть некоторые ограничения безопасности, которые накладываются на контекст выполнения скриптов и работу с окнами. Вот пример решения, который поможет открыть вторую ссылку после открытия первой.
Шаг 1: Измените popup.js
Ваш текущий код вызывает window.open()
для открытия второй ссылки сразу после открытия первой. Однако это не сработает, потому что pageA
представляет собой новый контекст, и вы не сможете непосредственно обращаться к его DOM через pageA.document
. Вместо этого вам нужно ждать, пока первая страница загрузится, а затем открыть вторую ссылку.
Попробуйте использовать следующий подход с передачей сообщения через chrome.runtime.sendMessage
:
function openFirstLinkAndGetSecondUrl() {
const linksA = document.querySelectorAll("li[id='3']");
for (const linkA of linksA) {
const iconList = linkA.querySelectorAll("i.icon.NextPage");
if (iconList.length > 0) {
const link = iconList[0].parentElement.href;
if (link != null) {
chrome.runtime.sendMessage({url: link});
return;
}
}
}
}
document.addEventListener('DOMContentLoaded', () => {
chrome.tabs.query({ active: true, currentWindow: true }, tabs => {
chrome.scripting.executeScript({
target: {tabId: tabs[0].id},
func: openFirstLinkAndGetSecondUrl
});
});
});
Шаг 2: Обработайте сообщение в background.js
Создайте файл background.js
, который будет обрабатывать сообщения и откроет вторую ссылку после загрузки первой:
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
if (message.url) {
chrome.tabs.create({ url: message.url }, (tab) => {
// Ждем загрузки первой страницы
chrome.tabs.onUpdated.addListener(function onUpdated(tabId, changeInfo) {
if (tabId === tab.id && changeInfo.status === 'complete') {
chrome.tabs.onUpdated.removeListener(onUpdated);
// После загрузки первой страницы, нам нужно открыть вторую ссылку
chrome.scripting.executeScript({
target: { tabId: tabId },
func: () => {
const linkB = document.querySelector("source").src;
return linkB;
}
}, (results) => {
// Открываем вторую ссылку
if (results && results[0]) {
chrome.tabs.create({ url: results[0] });
}
});
}
});
});
}
});
Шаг 3: Обновите manifest.json
Не забудьте добавить background.js
в ваш manifest.json
:
{
"manifest_version": 3,
"name": "link opener",
"version": "1.0",
"description": "opens links. I hope?",
"permissions": [
"tabs",
"activeTab",
"scripting"
],
"action": {
"default_popup": "popup.html"
},
"background": {
"service_worker": "background.js"
}
}
Заключение
Теперь ваше расширение будет открывать ссылки в нужной последовательности. Сначала оно откроет первую ссылку, дождется ее загрузки, а затем откроет вторую ссылку, используя полученный URL. Убедитесь, что у вас есть соответствующие права доступа, и протестируйте код на разных страницах, чтобы гарантировать его работоспособность.