Question

到目前为止我所拥有的：

的manifest.json

{
  "name": "Testing",
  "version": "0.1",
  "manifest_version": 2,
  "description": "Hi there.",
  "background": {
	"scripts": ["background.js"]
  },

  "icons": {
    "128" : "images/test.png"
  },
  "browser_action": {
    "default_icon": "images/test2.png",
    "default_title": "test"
  },
  "permissions": [
	"webRequest",
	"webRequestBlocking",
	"https://www.google.com/*",
	"http://www.dictionary.com/*"
  ]
}

background.js

chrome.webRequest.onBeforeRequest.addListener(function(details) { 
		return {cancel: true}; 
	},
	{urls: ["https://www.google.com", "http://www.dictionary.com/*"]},
	["blocking"]);

我希望通过加载这个解压缩的扩展程序，它会“阻止”列出的网站（使用Google.com和dictionary.com进行测试）。我不确定阻塞功能实际上是如何工作的，但我认为网站不会加载或者它会显示某种一般错误。

然而，似乎没有任何事情发生，所以我猜测我对“阻塞”的理解是有缺陷的和/或我的代码编写不正确。我的代码基于这些引用：

https://developer.chrome.com/extensions/examples/extensions/catblock/manifest.json https://developer.chrome.com/extensions/examples/extensions/catblock/background.js https://developer.chrome.com/extensions/webRequest

“以下示例以更有效的方式实现了相同的目标，因为不针对www.evil.com的请求不需要传递到扩展名：

  chrome.webRequest.onBeforeRequest.addListener(
    function(details) { return {cancel: true}; },
    {urls: ["*://www.evil.com/*"]},
    ["blocking"]); "

这是我第一次尝试进行Chrome扩展，而且我对html或javascript并不熟悉，所以如果我的实现方式不合适，请道歉。

Answer 1

这是我制作的site-blocking extension的代码。

以下是 manifest.json 文件：

{
  "manifest_version": 2,

  "name": "SiteBlocker",
  "version": "1.0.0",
  "description": "Block non-important info from your browsers",

  "content_scripts": [{
    "js": ["content.js"],
    "matches": ["http://*/*", "https://*/*"]
  }],
  "browser_action": {
      "default_icon": "icons8-fire-96.png", //change this icon to your icon file
      "default_popup": "small_win.html"
    }
}

这是 content.js 文件，其中包含主要代码：

//BLOCK WORDS
findString = function findText(text) {
  if(window.find(text)){
    document.documentElement.innerHTML = '';
    document.documentElement.innerHTML = 'This site is blocked';
    document.documentElement.scrollTop = 0;
  };
}

findString("WordToBlock");

//BLOCK THE PARTIAL DOMAINS
findURL = function changeURL(text){
  var current = window.location.href;
  if(current === text){
    window.location.replace("https://www.google.co.in");
  }
}

//BLOCK THE ENTIRE DOMAIN WITH THE FOLLOWING FUNCTION
findAllURL = function changeAllURL(text){
  var current = window.location.href;
  if(current.startsWith(text)){
    document.documentElement.innerHTML = '';
    document.documentElement.innerHTML = 'Domain is blocked';
    document.documentElement.scrollTop = 0;
  }
}


findURL("https://www.quora.com/");
findAllURL("https://www.facebook.com/");

这是 small_win.html 文件，当您点击扩展程序的图标时，它将打开一个弹出窗口：

<!DOCTYPE html>
<html>
<head>
  <style media="screen">
      body {
          min-width:500px;
      }
  </style>
</head>
<body>
  Add the content of the popup window
</h3>
</body>
</html>

这是我的github存储库的链接：https://github.com/sak1sham/LaserFocus，其中包含扩展的代码。

谢谢

如何制作基本的Chrome扩展程序以阻止某些网站？

1 个答案:

这是我制作的site-blocking extension的代码。