Setting up content scripts for different sites in google-chrome - google-chrome

I looked at the google-chrome-extension labs page and I don't see any example where you can use different content scripts for different sites. They have a page showing how to have multiple content scripts on one site, but not the reverse. Is there any way to have different content scripts for different sites?

{
"name": "My extension",
...
"content_scripts": [
{
"matches": ["http://www.google.com/*"],
"js": ["script1.js"]
},{
"matches": ["http://www.yahoo.com/*"],
"js": ["script2.js"]
}
],
...
}

Related

Chrome Extension: content_scripts matches for custom new tab page

I'm trying to create a custom new tab page for Chrome. I have it in my manifest.json so that: "chrome_url_overrides": {
"newtab": "home.html"
}
It won't, however, load the scripts that I load in my home.html. I found out that you need to use content_scripts, so now I also have
"content_scripts": [
{
"matches": [""],
"css": ["style.css"],
"js": ["logic.js", "macros.js"]
}
]
What do I put in the "matches"? It doesn't allow "home.html" or "chrome://newtab".

Chrome extension to work on all the sites and perform different action just for few sites

I'm trying to make an extension to work on all the site.And also for some site specific sites(Google and LinkedIn) I want some others action to be performed. I have managed to work it on Google search google.com/search and LinkedIn search pages linkedin.com/vsearch/ and perform action A and B respectively. But i'm stuggling to make it work on all others sites to perform action C.
{
"manifest_version": 2,
"name": "extname",
"description": "Welcome to my ext",
"icons": {
"48": "images/ext.png"
},
"version": "2.6",
"background": {
"scripts": [ "js/jquery-2.1.4.min.js", "js/background.js","js/select2.min.js","js/lodash.js","js/bootstrap.min.js","js/bootstrap-select.min.js" ]
},
"content_scripts": [{
"css": [ "css/select2.css" ,"css/bootstrap.min.css","css/bootstrap-select.min.css" ],
"js": [ "js/jquery-2.1.4.min.js", "js/extension_google_result.js" ,"js/select2.min.js" ,"js/bootstrap.min.js","js/bootstrap-select.min.js"],
"matches": [ "*://*.google.com/search*" ] //for Google Search page
},
{
"css": [ "css/extension_linkedin_search_page.css", "css/bootstrap.min.css","css/bootstrap-select.min.css" ],
"js": [ "js/jquery-2.1.4.min.js","js/select2.min.js" ,"js/bootstrap.min.js","js/bootstrap-select.min.js"],
"matches": [ "*://*.linkedin.com/vsearch/*"] //for Linkedin Search page
},
{
"css": [ "css/extension_linkedin_search_page.css" ,"css/bootstrap.min.css","css/bootstrap-select.min.css","css/select2.css" ],
"js": ["js/lodash.js", "js/jquery-2.1.4.min.js", "js/extension_linkedin_sales_navigator_search_page.js" ,"js/select2.min.js" ,"js/bootstrap.min.js","js/bootstrap-select.min.js", "js/akash.js"],
"matches": [ "<all_urls>"] //for all other sites
}
],
"content_security_policy": "script-src 'self' 'unsafe-eval' https://d37gvrvc0wt4s1.cloudfront.net https://*.pusher.com; object-src 'self'",
"browser_action": {
"default_icon": "images/found128.png",
"default_popup": "html/extension-login-popup.html",
"default_title": "Search with Found"
},
"permissions": ["cookies","tabs", "http://*/*", "https://*/*","contextMenus", "tabs", "storage", "\u003Call_urls>", "notifications", "webRequest" ]
}
But here the first two cases for google and linked in search works perfectly and i'm getting callbacks(Action A and B) on only those pages as expected.I'm also able to call action c on other sites.But actin c is also been calling on google and linkedIn search pages also on every new tab action which i don't want.How can i fix that? Any idea?
Take a look at Content Scripts, you will find you can use exclude_matches in your manifest.json to exclude pages that your content script would not be injected into.

Google Chrome - uploading apps to chrome web store but how to allow all domain with manifest.json?

I have Chrome web store package with zip file ready. But the problem is that manifest.json i need to allow two domain + all subdomains.
This is the reference:
https://developer.chrome.com/extensions/manifest
https://developer.chrome.com/extensions/content_scripts
Where its saying: "matches": ["http://www.google.com/*"]
But how do i say in matches to allow two domain with all there subdomains? example:
*.stackoverflow.com and *.centos.org?
{
"name": "My extension",
...
"content_scripts": [
{
"matches": ["http://www.google.com/*"],
"css": ["mystyles.css"],
"js": ["jquery.js", "myscript.js"]
}
],
...
}
You're looking at wrong parts of the documentation.
Match Patterns
Match patterns and globs
Note that "matches" property is an array.
"content_scripts": [
{
"matches": ["*://*.stackoverflow.com/*", "*://*.centos.org/*"],
"css": ["mystyles.css"],
"js": ["jquery.js", "myscript.js"]
}
],
The above will match all pages on stackoverflow.com, centos.org and all of their subdomains. Important to note that just stackoverflow.com will be matched.
* in place of http will match exactly either http or https.

Content script matching top-level domains like all google.*

I want my content script to match all google domains, and a specific page. I know this is not possible.
Manifest.json
"content_scripts": [{
"matches": [
,"*://www.google.*"
,"*://www.youtube.com/*"
,"*://readthedocs.org/*"]
,
....
Is there another way to do this? Just wanted to make sure before I list all domains Google has :)
Listing all Google domains is not that difficult, because Google has published a list of all public Google domains at http://www.google.com/supported_domains. Prefix every item in this list with "*://* and add the ", suffix to every item. Then copy-paste the result to your manifest file.
An alternative option is to use the "include_globs" field (this is applied after "matches"):
{
....
"content_scripts": [{
"matches": [ "*://*/*" ],
"include_globs": [
"*://*.google.*/*",
"*://*.youtube.com/*",
"*://readthedocs.org/*"
],
"js": [ "contentscript.js" ]
}]
}
(I've replaced "*://www.google.com/*" with "*://*.google.com/*, because of subdomains like https://encrypted.google.com/)

Accessing the Cast API from within an extension page

I was working on a chromecast app, and I wanted to incorporate it into a chrome extension. I'm also using knockout.js in order to help with some of the UI. I have two pages, one is unsandboxed (http://jsfiddle.net/AuJaX/3/), and the other is sandboxed (http://jsfiddle.net/V2dJc/1/). None of the console.log's ever get called. My manifest is below:
{
"manifest_version": 2,
"name": "__MSG_app_title__",
"description": "__MSG_app_description__",
"version": "0.1",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["js/content/content.js"]
}
],
"background": {
"scripts": ["js/back/background.js"],
"persistent": false
},
"permissions": [
"tabs",
"contextMenus"
],
"page_action": {
"default_title": "__MSG_app_title__",
"default_icon": {
"19": "images/icon-19.png"
}
},
"sandbox": {
"pages": ["sandboxed.html"]
},
"icons": { "48": "images/icon.png" },
"default_locale": "en"
}
Is there anything that I'm doing wrong, or is this something that's not supported (yet??)?
Did you whitelist the domain you are trying to use the extension on? Currently to have the Cast API injected into the page you need two things:
<html data-cast-api-enabled="true">
and you need to follow the steps at the bottom of this page (whitelisting in the extension, not the same as the Google Cast device whitelisting):
https://developers.google.com/cast/whitelisting#whitelist-chrome
That said, I doubt this is going to work. The instructions are for getting the Cast API injected into a regular web page. However, if I'm not mistaken you want the API injected into your Chrome extension page. I don't know if it will be made available there, since I don't think two different extensions are allowed to interact.