我正在尝试定义一个后台函数,并在popup.js中使用它。因为,我想发送POST请求,但不知道在popup.js中执行该请求的方法。我已经搜索过了,所以很多人只是说,最好在background.js中发送POST请求。 chrome阻止了来自popup.js的请求。
这是我的manifest.json:
{
"name": "Getting Started Example",
"version": "1.0",
"description": "Build an Extension!",
"permissions": [
"declarativeContent",
"activeTab",
"tabs",
"storage",
"webNavigation",
"<all_urls>"
],
"background_page": "background.html",
"background": {
"scripts": ["background.js"],
"persistent": false
},
"page_action": {
"default_popup": "popup.html",
"default_icon": {
"16": "icon-16.png",
"48": "icon-48.png",
"128": "icon-128.png"
}
},
"icons": {
"16": "icon-16.png",
"48": "icon-48.png",
"128": "icon-128.png"
},
"manifest_version": 2
}
我该怎么办?
答案 0 :(得分:0)
看一下我的代码,我构建了一个密码管理器扩展,它与服务器交互并获取密码以填写表格,它的工作原理很吸引人。以下是此应用的清单。
{
"name": "Password Manager",
"version": "0.3",
"description": "Manage all Passwords",
"options_page": "options.html",
"permissions": [
"contentSettings",
"tabs",
"activeTab",
"http://*/",
"storage",
"webRequest",
"webRequestBlocking",
"debugger",
"<all_urls>",
{"fileSystem": ["write", "retainEntries", "directory"]}
],
"browser_action": {
"default_icon": "images/icon.png",
"default_popup": "app.html"
},
"manifest_version": 2,
"content_scripts": [
{
"matches": [
"*://*/*"
],
"js": [
"scripts/jquery.js"
]
}],
"background": {
"scripts": [
"scripts/jquery.js",
"scripts/custom.js"
],
"persistent": true
}
}
如果您在下面查看app.html代码,我可以在popup.js中执行代码
<!DOCTYPE html>
<html>
<head>
<title>Popup</title>
<link href="css/bootstrap.css" rel="stylesheet" />
<link href="css/style.min.css" rel="stylesheet" />
<style>
body {
margin: 20p;
padding: 20px;
width: 300px;
min-height: 150px;
}
.header{
width: 100%;
position: absolute;
top: 20px;
}
</style>
</head>
<body>
<br/>
<div class='header'>
User: <label id="username" ></label>
<br/><button class='btn btn-xs btn-warning options_helper' >Settings</button>
</div>
<br/><hr/>
<div id="jstree_demo_div">
</div>
</body>
<script src="scripts/jquery.js"></script>
<script src="scripts/bootstrap.js"></script>
<script src="scripts/jstree.min.js"></script>
<script src="scripts/popup.js"></script>
<script src="scripts/components/core.js"></script>
<script src="scripts/components/lib-typedarrays.js"></script>
<script src="scripts/components/x64-core.js"></script>
<script src="scripts/components/enc-utf16.js"></script>
<script src="scripts/components/enc-base64.js"></script>
<script src="scripts/components/md5.js"></script>
<script src="scripts/components/sha1.js"></script>
<script src="scripts/components/sha256.js"></script>
<script src="scripts/components/sha224.js"></script>
<script src="scripts/components/sha512.js"></script>
<script src="scripts/components/sha384.js"></script>
<script src="scripts/components/ripemd160.js"></script>
<script src="scripts/components/hmac.js"></script>
<script src="scripts/components/pbkdf2.js"></script>
<script src="scripts/components/evpkdf.js"></script>
<script src="scripts/components/cipher-core.js"></script>
<script src="scripts/components/mode-cfb.js"></script>
<script src="scripts/components/mode-ctr.js"></script>
<script src="scripts/components/mode-ofb.js"></script>
<script src="scripts/components/mode-ecb.js"></script>
<script src="scripts/components/pad-ansix923.js"></script>
<script src="scripts/components/pad-iso10126.js"></script>
<script src="scripts/components/pad-zeropadding.js"></script>
<script src="scripts/components/pad-iso97971.js"></script>
<script src="scripts/components/pad-nopadding.js"></script>
<script src="scripts/components/rc4.js"></script>
<script src="scripts/components/rabbit.js"></script>
<script src="scripts/components/aes.js"></script>
<script src="scripts/components/tripledes.js"></script>
<script src="scripts/crypt.js" type="text/javascript"></script>
</html>
最后一部分,如您所见,您将看到我正在popup.js中使用ajax来检索密码文件,以将其从服务器保存到本地。
// document.addEventListener("contextmenu", function(e) {
// e.preventDefault();
// });
var key = localStorage.getItem("access_key");
$(document).ready(function(){
readTextFile("file://"+localStorage.getItem("db_path"));
var menuItems="";
var key = '';
});
$('#jstree_demo_div').on("select_node.jstree", function (e, data) {
chrome.tabs.query({ currentWindow: true, active: true },function (tabArray) {
chrome.tabs.executeScript(tabArray[0].id, {
file: 'scripts/pop.js'
}, function() {
chrome.tabs.sendMessage(tabArray[0].id,{type: data.node.data.jstree.type, options: {
user: data.node.data.jstree.user,
pass: data.node.data.jstree.pass
}
})
})
}
);
});
$(".options_helper").click(function(){
chrome.tabs.create({ url: "options.html" });
})
function readTextFile(file)
{
var rawFile = new XMLHttpRequest();
rawFile.open("GET", file, false);
rawFile.onreadystatechange = function ()
{
if(rawFile.readyState === 4)
{
if(rawFile.status === 200 || rawFile.status == 0)
{
var fullresponse = decrypt(rawFile.responseText,key);
var username = fullresponse.split("|")[1];
var userdata = fullresponse.split("|")[0];
$("#username").text(username);
if (decrypt(rawFile.responseText,key).length>0){
$('#jstree_demo_div').html(userdata);
$('#jstree_demo_div').jstree();
}else{
$('#jstree_demo_div').html("Password Database is not found");
}
}else{
$('#jstree_demo_div').html("Password Database is not found");
}
}else{
}
}
rawFile.send(null);
}
希望我可以帮助您编写整个程序。如果您有任何疑问。让我知道。