由于indexOf错误，if语句中的几个sendReponse无效
[英]Several sendReponse in if statements not functioning due to error in indexOf
问题描述
In my chrome extension, I have the following background.js as my background script which calls for the tab url and then determine if its secure. 
在我的chrome扩展程序中，我将以下background.js作为我的背景脚本，该脚本要求使用标签页网址，然后确定其是否安全。
background.js 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: "?" });
}
}
)
})
});
I have a message request from my popup.js (below) which sends a message to the background.js. 我有来自popup.js的消息请求（如下），该消息将消息发送到background.js。 There is a listener for the message and sends a response of YES of NO depending on if https is present. 有一个消息侦听器，并根据是否存在https发送“是”或“否”的响应。
popup.js 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;
});
Then, the popup.js would get the element in my popup.html (below) and display the result. 然后，popup.js将在我的popup.html中获得该元素（如下所示）并显示结果。
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>
However, this does not function properly. 但是，这不能正常工作。 On install, it functions properly and displays YES for the https website. 安装后，它可以正常运行，并且对https网站显示是。 However, on the second attempt, I navigated to a http site and still got the output of YES. 但是，在第二次尝试时，我导航到一个http站点，但仍然得到YES的输出。 It seems that the response does not change from the first attempt. 似乎响应与第一次尝试并没有改变。
When checking the console, the correct site secure response appears on the first attempt. 检查控制台时，第一次尝试时会出现正确的site secure响应。 On the second attempt, both site secure and insecure site appear but the former appearing first. 在第二次尝试中，同时出现site secure和insecure site但前者首先出现。 This most likely is why YES appeared instead of No. When navigating to a http website on the first attempt, same thing occurs with it giving the right response but wrong response when navigating to https website on the second attempt. 这最有可能是为什么出现“是”而不是“否”的原因。第一次尝试导航到http网站时，会发生同样的事情，它给出正确的响应，而第二次导航到https网站时给出错误的响应。
This console picture shows the url being given and the response provided. 此控制台图片显示了给出的URL和提供的响应。 Notice how the first response was correct but the second time, both responses were present which does not make sense. 请注意，第一个答案是正确的，但是第二次，两个答案都没有意义。 Console 安慰
It seems that the if statements in background.js is remembering the previous result or something similar. 似乎background.js中的if语句正在记住先前的结果或类似的结果。 I'm not familiar with the complete situation and would love to hear how I can resolve this. 我不了解完整的情况，很想听听我如何解决这个问题。
1 个解决方案
解决方案1
0 已采纳 2018-05-03 15:33:06
You are adding a message listener everytime a tab is updated, that's why there are several responses. 每次更新选项卡时，您都将添加一个消息侦听器，这就是为什么会有多个响应的原因。 Try this: 尝试这个：
background.js 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;
});
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.