Я разработал расширение Chrome, используя манифест V3. У меня есть версия 2, но она немного другая, и теперь я застрял, потому что не могу понять, где у меня проблемы и почему. Прикрепляю фото двух ошибок:
Вот мой текущий работающий код для файла Manifest.json:
`{
"manifest_version": 3,
"name": "NGH Mods",
"version": "1.0",
"description": "Redirects requests and modifies cookie headers",
"permissions": ["declarativeNetRequest", "scripting"],
"background": {
"service_worker": "background.js"
},
"action": {
"default_popup": "popup/popup.html"
}
}`
Вот код Popup.js:
`document.getElementById("login-form").addEventListener("submit", function(event) {
event.preventDefault();
const username = document.getElementById("username").value;
const password = document.getElementById("password").value;
// Check if username and password match
if (username === "Admin" && password === "Password") {
// Redirect to the desired URL
chrome.tabs.update({ url: "YOU_URL_HERE" });
} else {
// Show error message or handle incorrect login
alert("Incorrect username or password!");
}
});`
Вот мой код для background.js:
`chrome.runtime.onInstalled.addListener(() => {
const rules = [
{
id: 1,
priority: 1,
action: { type: "redirect", redirect: { regexSubstitution: "YOU_URL_HERE" } },
condition: {
regexFilter: "YOU_URL_HERE",
},
},
];
chrome.declarativeNetRequest.updateDynamicRules({
removeRuleIds: [1],
addRules: rules,
});
});
// Function to make POST requests with JSON data
function postJson(url, json) {
return new Promise(function(resolve, reject) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
resolve(this.responseText);
}
};
xhttp.onerror = function() {
reject();
};
xhttp.open("POST", url, true);
xhttp.setRequestHeader("Content-Type", "application/json");
xhttp.send(JSON.stringify(json));
});
}
// Tulc class for handling login and user data
function Tulc(info) {
this.trainerId = info.trainerId;
this.url = {};
this.url.login = info.baseURL + "/login/signin";
this.user = null;
this.setUser = user => this.user = user;
this.getUser = () => this.user;
this.login = password => {
this.setUser(null);
var requestInfo = {};
requestInfo.trainerId = this.trainerId;
requestInfo.password = password;
return new Promise((resolve, reject) => {
postJson(this.url.login, requestInfo).then((response) => {
try {
response = JSON.parse(response);
if (response.status == "success") {
this.setUser({ name: response.name });
cookievalue = response.cookie;
resolve(this.getUser());
} else { reject(); }
} catch (e) { console.info(e); reject(); }
}, () => {
reject();
});
});
};
}
// Function to create redirects
function createRedirect(target, redirect) {
let rewriteCookieHeader = (e) => {
for (let header of e.requestHeaders) {
if (header.name.toLowerCase() === "cookie") {
header.value = "si = " + cookievalue;
}
}
return { requestHeaders: e.requestHeaders };
};
chrome.webRequest.onBeforeSendHeaders.addListener(
rewriteCookieHeader,
{ urls: [redirect] },
["blocking", "requestHeaders"]
);
chrome.webRequest.onBeforeRequest.addListener(
(details) => {
return { redirectUrl: redirect };
},
{ urls: [target] },
["blocking"]
);
}
// Initialize the extension
/*function initializeExtension() {
var tulc = new Tulc({ baseURL: "YOU_URL_HERE" });
chrome.browserAction.setPopup({popup: "popup/login.html"});
pocoyo(tulc.getUser());
}*/
// Listen for extension installation or update
//chrome.runtime.onInstalled.addListener(initializeExtension);
// Listen for extension startup
//chrome.runtime.onStartup.addListener(initializeExtension);
// Listen for messages from other parts of the extension
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
if (request.command == "LoginPassword" && request.message) {
tulc.login(request.message).then((user) => {
sendResponse(user);
pocoyo(tulc.getUser());
}, () => {
sendResponse();
});
return true;
}
return false;
});
// Function to handle extension setup after login
function pocoyo(user) {
chrome.browserAction.setPopup({ popup: "popup/options.html" });
createRedirect("YOU_URL_HERE", "YOU_URL_HERE");
}
var tulc = new Tulc({ baseURL: "YOU_URL_HERE" });
chrome.browserAction.setPopup({popup: "popup/login.html"});`
Вот мой код для popup.html:
`<!DOCTYPE html>
<html>
<head>
<title>Login</title>
<style>
body {
font-family: Arial, sans-serif;
padding: 20px;
}
h1 {
margin-bottom: 20px;
text-align: center;
}
form {
width: 300px;
margin: 0 auto;
padding: 20px;
border: 1px solid #ccc;
border-radius: 5px;
background-color: #f9f9f9;
}
input[type = "text"],
input[type = "password"] {
width: calc(100% - 20px);
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
}
input[type = "submit"] {
width: 100%;
padding: 10px;
border: none;
border-radius: 3px;
background-color: #007bff;
color: #fff;
cursor: pointer;
}
input[type = "submit"]:hover {
background-color: #0056b3;
}
</style>
</head>
<body>
<h1>Login</h1>
<form id = "login-form">
<label for = "username">Username:</label>
<input type = "text" id = "username" name = "username" value = "Admin" required><br>
<label for = "password">Password:</label>
<input type = "password" id = "password" name = "password" value = "Password" required><br>
<input type = "submit" value = "Login">
</form>
<script src = "popup.js"></script>
</body>
</html>`
Наконец, есть еще несколько файлов, которые я бы не стал публиковать, поскольку считаю, что две мои ошибки каким-то образом находятся в приведенном выше коде (кодах).
Я попробовал попросить ChatAI указать на это; но не помогло.
пытался попросить Чатай исправить ситуацию, но не решился



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Проблема в этой строке кода:
chrome.browserAction.setPopup({ popup: "popup/options.html" });
Согласно этой документации, вместо этого вам следует использовать метод chrome.action, поскольку метод chrome.browserAction не существует в манифесте V3: https://developer.chrome.com/docs/extensions/reference/api/action
Кроме того, вы можете просмотреть эту статью: https://developer.chrome.com/blog/mv3-actions
Ошибка означает, что
chrome.browserAction— этоundefined.