gpt4 book ai didi

javascript - 如何将网页 DOM 中的元素放入我的 background.js 中?

转载 作者:行者123 更新时间:2023-12-02 18:18:27 25 4
gpt4 key购买 nike

我正在尝试为 Chrome 制作一个自动登录 this 的扩展程序网页。它通过检测我何时进入页面来实现此目的,然后将浏览器重定向到登录页面,在其中填写用户名和密码并单击登录按钮。

manifest.json:

{
"manifest_version": 2,

"name": "Login",
"description": "Automaticly logs in to a page",
"version": "1.0",
"background": {
"scripts": ["background.js"],
"persistent": false
},

"permissions": [
"tabs",
"http://*/"
]
}

背景.js:

window.onload = function() {
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab){
if (tab.url == "https://www.itslearning.com/Index.aspx?customerid=&username=&redirectlogin=itslearning.com&MustUseSsl=true&") {
chrome.tabs.update(tabId, {"url": "https://vaf.itslearning.com/elogin/"}, function(){});
} else if(tab.url == "https://vaf.itslearning.com/elogin/") {
var username = document.getElementById("ctl00_Username"); //doesn't work
var password = document.getElementById("ctl00_Password"); //doesn't work
var button = document.getElementById("ctl00_ButtonLogin"); //doesn't work
if (username && password && button) {
username.value = "####";
password.value = "######";
button.click();
}
}
});
};

我通过右键单击 -> 在 chrome 中检查元素获得了字段的 ID。当我第一次运行它时,它将浏览器重定向到正确的页面,但它没有填写密码和用户名,所以我做了一些快速调试,似乎它永远无法找到任何字段。我在论坛上搜索了一下,发现页面必须先完全加载,所以我添加了 window.onload=function(){} 但仍然不起作用。为什么?

我以前用过一些 JavaScript 编程,但我是 Chrome 扩展开发的新手,所以如果有人有一些额外的提示或建议,请与我分享。

最佳答案

后台脚本无法直接与常规页面的 DOM 交互。当您在后台脚本中使用 document 时,您指的是 Google Chrome 为您的扩展程序创建的后台页面的 DOM。

要访问网页的 DOM,您需要 content script 。您可以在 list 中指定它或使用chrome.tabs.executeScript以编程方式注入(inject)它。就像您的情况一样,您希望始终在特定的 URL 中运行它,最简单的方法是通过 list :

"content_scripts": [
{
"matches": ["https://vaf.itslearning.com/elogin/"],
"js": ["content.js"]
}
],

在你的 content.js 中你可以输入:

var username = document.getElementById("ctl00_Username");
var password = document.getElementById("ctl00_Password");
var button = document.getElementById("ctl00_ButtonLogin");
if (username && password && button) {
username.value = "####";
password.value = "######";
button.click();
}

所以在你的background.js中你只需要保留重定向代码:

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
if (tab.url == "https://www.itslearning.com/Index.aspx?customerid=&username=&redirectlogin=itslearning.com&MustUseSsl=true&")
chrome.tabs.update(tabId, {"url": "https://vaf.itslearning.com/elogin/"});
}

(顺便说一句,有更有效的方法可以使用 chrome.webRequest 进行重定向)

关于javascript - 如何将网页 DOM 中的元素放入我的 background.js 中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19054299/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com