if语句中的几个sendReponse由于indexOf中的错误而不能正常工作
在我的chrome扩展中，我有下面的background.js作为我的后台脚本，它调用选项卡url，然后确定它是否安全。
background.js
chrome.runtime.onInstalled.addListener(function () {
console.log('loaded');
});
chrome.tabs.onUpdated.addListener(function () {
chrome.tabs.query({ 'active': true, 'lastFocusedWindow': true }, function (tabs) {
var url = tabs[0].url;
console.log(url);
chrome.runtime.onMessage.addListener(
function (request, sender, sendResponse) {
if (url.indexOf('https') >= 0) {
console.log('secure site');
console.log(url.indexOf('https'));
sendResponse({ security: "YES" });
}
else if (url.indexOf('https') < 0) {
console.log('insecure site');
sendResponse({ security: "NO" });
console.log(url.indexOf('https'));
}
else {
console.log('unable');
sendResponse({ security: "?" });
}
}
)
})
});我有一个来自我的popup.js (下面)的消息请求，它向background.js发送一条消息。消息有一个侦听器，并根据https是否存在，发送一个是否的响应。
popup.js
chrome.runtime.sendMessage({ greeting: "hello" }, function (response) {
if (response.security == "YES") {
document.getElementById('webSecure').innerHTML = "YES";
}
else {
document.getElementById('webSecure').innerHTML = "NO";
}
//document.getElementById('webSecure').innerHTML = response.security;
});然后，popup.js将在我的popup.html中获得元素(如下所示)并显示结果。
popup.html
<!DOCTYPE html>
<html lang="en">
<head>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="material.css">
<script defer src="material.min.js"></script>
<link rel="stylesheet" href="styles.css">
<style>
body {
width: 300px;
}
</style>
</head>
<body>
<header>
<img src="logo_default256.png" id="logo" alt="logo-default">
<div class="options">
<label class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="switch-2">
<input type="checkbox" id="switch-2" class="mdl-switch__input">
<span class="mdl-switch__label"></span>
</label>
<a href="settings.html">SETTINGS</a>
</div>
</header>
<hr>
<section>
<div class="content">
<h4>Is this website secure?</h4>
<p id="webSecure" class="result">0</p>
</div>
<div class="content">
<h4>Trusted Site</h4>
<!-- Accent-colored flat button -->
<p class="result">NO</p>
</div>
<div class="content">
<h4>Harmful Language</h4>
<p class="result">0</p>
</div>
</section>
<script src="popup.js"></script>
</body>
</html>然而，这并不能正常运作。在安装时，它正常工作，并为https网站显示YES。然而，在第二次尝试中，我导航到了一个http站点，仍然得到了YES的输出。似乎这种反应与第一次尝试没有任何变化。
在检查控制台时，第一次尝试时会出现正确的site secure响应。在第二次尝试中，site secure和insecure site都出现了，而前者出现在第一个。这很可能是为什么出现是而不是否。在第一次尝试中导航到http网站时，当第二次尝试导航到https网站时，同样的情况会发生在它给出正确的响应而错误的响应。
此控制台图片显示所给出的url和所提供的响应。注意第一个响应是如何正确的，但是第二次，这两个响应都存在，这是没有意义的。控制台
background.js中的if语句似乎是在记住先前的结果或类似的内容。我不太熟悉整个情况，我很想听听我如何解决这个问题。
回答 1
Stack Overflow用户
发布于 2018-05-03 15:33:06
每次更新选项卡时，您都要添加一个消息侦听器，这就是为什么有几个响应。试试这个：
background.js
var url;
chrome.runtime.onInstalled.addListener(function () {
console.log('loaded');
});
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
chrome.tabs.query({ 'active': true, 'lastFocusedWindow': true }, function (tabs) {
url = tabs[0].url;
console.log(url);
if (url.indexOf('https') >= 0) {
console.log('secure site');
console.log(url.indexOf('https'));
sendResponse({ security: "YES" });
}
else if (url.indexOf('https') < 0) {
console.log('insecure site');
sendResponse({ security: "NO" });
console.log(url.indexOf('https'));
}
else {
console.log('unable');
sendResponse({ security: "?" });
}
});
return true;
});https://stackoverflow.com/questions/50154803
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号