I am trying to make a Chrome extension to workaround Steam's annoying URL warning page. See this for example: https://steamcommunity.com/linkfilter/?url=http://67.69.104.76:84/marville/photos/planes/comet-162a.jpg
What I have so far works except when clicking a link would launch Chrome, in which case the Steam notice page is displayed.
Here is the page on webrequest: https://developer.chrome.com/extensions/webRequest
Any idea how I might get this to work at launch too?
background.js
chrome.webRequest.onBeforeRequest.addListener(
function (details) {
var url = details.url;
var host = url.substring(43);
return { redirectUrl: host };
},
{
urls: ["*://steamcommunity.com/linkfilter/*"],
types: ["main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"]
},
["blocking"]
);
manifest.json
{
"manifest_version": 2,
"name": "Steam Link Filter Redirect",
"description": "Bypasses Steam link filtering.",
"version": "1.1",
"background": {"scripts":["background.js"]},
"permissions": [
"webRequest",
"*://steamcommunity.com/linkfilter/*",
"webRequestBlocking"
],
"icons": {
"16": "icon16.png",
"19": "icon19.png",
"48": "icon48.png",
"128": "icon128.png"
}
}
The problem is, of course, that your code executes too late, after onBeforeRequest stage is done for the opening page. I don't think you can work around that.
You probably need to add a fallback mechanism. I suggest adding a content script that is injected in the linkfilter page and changes the page URL to the required one, for example:
"content_scripts": [ {
"matches": ["*://steamcommunity.com/linkfilter/*"],
"js": ["redirect.js"]
} ],
redirect.js:
location.replace(
decodeURIComponent( location.href.replace(/^.*?\?url=/, "") )
);
(I've made it more robust than .substring(43))
Related
I'm trying to set a keyboard shortcut to active/deactivate my Chrome extension that I'm developing. The Chrome extension just consists of a "content_script" that runs on certain sites. I want it to fully activate/deactivate the extension, like if I were to disable it via Chrome://extensions.
In my search for answers, I saw a lot of suggestions to add "_execute_browser_action" to my manifest.json, but I think this command requires a listener that needs to be set up in background.js (correct me if I'm wrong). I want to avoid a background.js if possible, as I want to keep this extension short and sweet.
Here is my manifest.json:
{
"manifest_version": 2,
"name": "foo",
"description": "foo",
"version": "0.1.0",
"commands": {
"_execute_browser_action": {
"suggested_key": {
"default": "Ctrl+Shift+8"
}
}
},
"content_scripts": [{
"js": ["./dist/bundle.js"],
"matches": [ ...certain sites... ]
}],
"icons": {
"16": "/icons/logo16.png",
"32": "/icons/logo32.png",
"48": "/icons/logo48.png",
"128": "/icons/logo128.png"
}
}
With this manifest.json, the shortcut shows up in Chrome://extensions/shortcuts, but the shortcut does nothing. When I press the combination, nothing happens. Even when I refresh the page, reload extension, re-bundle, restart Chrome, etc.
How should I go about adding this keyboard shortcut?
Also, I'm using Babel/Webpack, if that helps.
I ended up solving my own issue. Updating here in case it helps anyone else.
It turns out a background.js was exactly what I was looking for. My background script sets a chrome.storage API field, triggered by browserAction, which my content_script then ingests to toggle it on/off. Then the page is refreshed to update the page html. (Inspiration taken from here)
background.js:
var x = true
enableBrowserAction()
function disableBrowserAction() {
chrome.storage.local.set({enabled: false})
}
function enableBrowserAction() {
chrome.storage.local.set({enabled: true})
}
function updateState() {
if (x == false) {
x = true
enableBrowserAction()
} else {
x = false
disableBrowserAction()
}
chrome.tabs.reload()
}
chrome.browserAction.onClicked.addListener(updateState)
manifest.json (with only the necessary fields):
{
"manifest_version": 2,
"browser_action": {},
"commands": {
"_execute_browser_action": {
"suggested_key": {
"default": "Ctrl+Shift+8"
}
}
},
"permissions": [
"storage"
],
"background": {
"scripts": ["background.js"]
},
"content_scripts": [{
"js": ["./dist/bundle.js"],
"matches": [ ...certain sites... ]
}]
}
content_script (entry for bundle.js):
import ServiceHandler from './ServiceHandler.js'
chrome.storage.local.get('enabled', data => {
if (data.enabled) {
const sh = new ServiceHandler()
sh.execute()
}
})
I have a website that updates automatically when I get a message and sends me a push notification. I am trying to create a chrome extension that can detect when I get that push notification and do something when it happens.
This is what I have so far but it doesn't seem to be outputting to console. Is something wrong or do I need to change something about my manifest?
inject.js
self.addEventListener('push', function(event) {
//I want to do a thing here
if (event.data) {
console.log('This push event has data: ', event.data.text());
} else {
console.log('This push event has no data.');
}
});
manifest.json
{
"name": "Push notifcation detector",
"version": "1.0",
"description": "Do a thing!",
"manifest_version": 2,
"permissions": [
],
"content_scripts": [
{
"matches": [
"https://mywebsite.com/*"
],
"js": [
"./js/inject.js"
],
"all_frames": false,
"run_at": "document_end"
}
],
"web_accessible_resources": [
"images/**/*.png"
],
"browser_action": {
"default_icon": {
"16": "./images/icons/icon.png",
"48": "./images/icons/icon.png"
}
},
"icons": {
"16": "./images/icons/icon.png",
"48": "./images/icons/icon.png",
"128": "./images/icons/icon.png"
}
}
Thanks for any help you can give me!
It looks like you need to run some sort of background page to receive the message. For the dropdowns, as far as I know, Chrome creates and drops the pages when you select and de-select, or when the browser is on the configured page. By default, it's not going to work because the page isn't running constantly.
This may help: https://developer.chrome.com/extensions/background_pages
I have a very simple chrome extension, where I'm trying to pass a message from the background script to the content script. But chrome.runtime is undefined.
Here's literally all the code, as you can see there's almost nothing to it. In the content script, runtime is undefined.
Background Script:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.runtime.sendMessage({action: 'someAction'},
function(response) {
console.log('Response: ', response);
});
});
Content Script:
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
sendResponse({
user: 'user'
});
});
manifest.json
{
"manifest_version": 2,
"name": "My Extension",
"version": "1.0",
"description": "Some stupid extension",
"browser_action": {
"default_icon": "icons/MyExtensionIcon.png"
},
"icons": {
"48": "icons/MyExtensionIcon.png"
},
"permissions": [
"tabs",
"storage",
"https://*/",
"http://*/"
],
"content_scripts": [
{
"matches": ["*://*.twitter.com/*", "https://twitter.com/*"],
"js": ["js/content.js"]
}
],
"background": {
"scripts": ["js/background.js"],
"persistent": true
},
"web_accessible_resources": [
"js/*",
"css/*"
]
}
Other Info:
Chrome Version 58.0.3029.110 (64-bit)
Installing my extension as an
"Unpacked extension" with developer mode
Ok I figured it out. It's absolutely stupid, but it appears this is simply a Heisenbug. By adding a breakpoint, or debugger statement, it causes that value to be undefined. Maybe a chrome bug?
I swear, every day Chrome feels more, and more like Internet Explorer.
I've an extension which need to keenly keep an eye on the URL of the very active tab in the browser [chrome]. Currently, I've been able to track those URL's which user load/reload from start. But if there is a tab change, the content script doesn't send message to background script and get back anything.
In fact I want to reload content.js script on tab change of user as well.
Here's what I've done till now:
CONTENT.JS:
// Code here....
chrome.extension.sendMessage({ wants: 'URL' }, function(res) {
var urlResponse = res.url;
});
// Code here....
Works pretty well, but this content.js doesn't fire on tab change. Instead it fires when a document is changed in same tab (like visiting new link, etc)
BACKGROUND.JS:
chrome.extension.onMessage.addListener(
function(script, sender, sendResponse) {
if (script.wants == 'URL') {
sendResponse({ maskedURL: sender.tab.url });
}
}
);
MANIFEST.JSON:
{
"manifest_version": 2,
"name": "NAME HERE",
"description": "DESC HERE",
"version": "1.1",
"options_page": "options.html",
"browser_action": {
"default_title": "NAME",
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"icons": { "16": "icon.png",
"48": "icon.png",
"128": "icon.png" },
"permissions": [
"storage",
"<all_urls>",
"tabs"
],
"content_scripts": [
{
"matches": ["http://*/*","https://*/*"],
"js": ["content.js"]
}
],
"web_accessible_resources": [
"bg.png",
"*.woff",
"*.woff2"
],
"background": {
"scripts": ["background.js"]
}
}
Thank you!
EDIT: Xan please have a look:
Could not understand your question properly but I will try to clarify to the best of my knowledge.
content.js is run once when a new page is opened or an existing page is refreshed.It cant access the details of the currently active tab.
If you want to know about any details of the tabs,use chrome.tabs API in background.js
chrome.tabs.onActivated.addListener(activeInfo){ //Fired when an active tab is changed
chrome.tabs.query({'active':true,'currentWindow':true},function(array_of_tabs){//Gives details of the active tab in the current window.
alert(array_of_tabs[0].url);
});
I'm essentially just trying to get the current tab url if they're on youtube.com. I keep getting an error from the script.
Error:
Uncaught TypeError: Cannot call method 'getSelected' of undefined
Manifest
{
"name": "YouTube Fix",
"version": "0.0.1",
"manifest_version": 2,
"description": "Fix some of the annoying little things in YouTube.",
"icons": {
"16": "icon.png",
"48": "icon.png",
"128": "icon.png"
},
"content_scripts": [{
"matches": ["http://www.youtube.com/*"],
"js": ["background.js"],
"run_at": "document_start"
}],
"permissions": ["tabs"]
}
Background.js
//this is what is giving me the error:
chrome.tabs.getSelected(null, function (tab) {
myFunction(tab.url);
});
function myFunction(tablink) {
if (tablink == "http://www.youtube.com") {
window.location = "http://www.youtube.com/feed/subscriptions/u";
}
document.getElementById("comments-textarea").disabled = false;
}
The following forks fine, no need for chrome.tabs.getSelected(null, function (tab) {}),because your page always runs for "matches": ["http://www.youtube.com/*"],;
More over add this condition to your code if(document.getElementById("comments-textarea") != null){
Working background.js
if (window.location == "http://www.youtube.com") {
window.location = "http://www.youtube.com/feed/subscriptions/u";
}
if (document.getElementById("comments-textarea") != null) {
document.getElementById("comments-textarea").disabled = false;
}
manifest.json
{
"name": "YouTube Fix",
"version": "0.0.1",
"manifest_version": 2,
"description": "Fix some of the annoying little things in YouTube.",
"content_scripts": [{
"matches": ["http://www.youtube.com/*"],
"js": ["background.js"],
"run_at": "document_start"
}],
"permissions": ["tabs"]
}
Let me know if you need more information.
You're running background.js as a content script rather than a background or event page, and https://developer.chrome.com/extensions/content_scripts.html says that "content scripts have some limitations. They cannot … Use chrome.* APIs (except for parts of chrome.extension)"
Instead, you should put something like
"background": {
"scripts": ["background.js"],
"persistent": false
},
into your manifest. See https://developer.chrome.com/extensions/event_pages.html for more details.
Quoted from here: https://groups.google.com/a/chromium.org/forum/?fromgroups=#!topic/chromium-extensions/A5bMuwCfBkQ
chrome.tabs.getSelected() is deprecated. The following page explains
how to use chrome.tabs.query instead:
http://code.google.com/chrome/extensions/whats_new.html#16 The relevant bit of text is:
"""
The methods getAllInWindow() and getSelected() have been deprecated.
To get details about all tabs in the specified window, use
chrome.tabs.query() with the argument {'windowId': windowID}. To get
the tab that is selected in the specified window, use
chrome.tabs.query() with the argument {'active': true}.
"""
chrome.tabs.getSelected is deprecated. Use chrome.tabs.query instead:
chrome.tabs.query({
"active": true
}, function(tab){
console.log(tab[0]); //selected tab
});
Also, content scripts can not access chrome.tabs APIs. Do this:
chrome.extension.getBackgroundPage().chrome.tabs.query(...
(This might not work. Not tested.)