Get current URL in Chrome using Extension - google-chrome

I have just started developing chrome extension ( Using chrome 34).
My aim is to check for a ID attribute in a site by opening it in multiple languages.
For instance, whenever I open that website, and click on my extension link. The extension should open the website in multiple languages in background, and check if a html "ID" exists.
As a start, I want to get the current URL for that site.
manifest.json -
{
"manifest_version": 2,
"name": "Hello World!",
"description": "My extension",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"tabs",
"http://*/*",
"https://*/*"
]
}
My popup.html is
<script type="text/javascript" src="currentUrl.js"/>
and currentUrl.js is
chrome.tabs.query({'active': true, 'windowId': chrome.windows.WINDOW_ID_CURRENT},
function(tabs){
alert(tabs[0].url);
}
);
But it is not working to alert the current URL. Whenever I click extension, just a small blank window appears.

Related

Chrome Extension, can't visualize the icon in the toolbar

First of all, I'm trying to use the new manifest 3, but there are no samples out there so it's difficult to understand how develop a chrome extension.
I'm trying to build a basic Hello world app, and i want to have an icon on the toolbar so when the user clicks it, a message "hello" shows up on the page.
This second part is easy as I already know how to inject the code, but the problem is that I cannot seem to see the app icon in my tool bar...
{
"manifest_version": 2,
"name": "My App Name",
"version": "1.0.0",
"description": "do something",
"short_name": "My App Name",
"permissions": ["activeTab", "declarativeContent", "storage", "<all_urls>"],
"content_scripts": [
{
"matches": ["<all_urls>"],
"css": ["src/bg/background.css"],
"js": ["src/bg/background.js", "js/jquery/jquery.min.js"]
}],
"browser_action":
{
"default_title": "My App Name",
"default_icon":
{
"16": "icons/icon16.png",
"32": "icons/icon32.png",
"48": "icons/icon48.png"
}
}
}
not sure what I need to add to see the icon
FYI I'm testing it locally ...i'm not sure if the local version acts differently from a packeged final version...

Why does it show "Visit Website" and not Add extension?

I would like publish a website (web app) on our intranet as chrome app in the google web store.
I want to publish this app to all Computers in my domain, I've seen that I can do this with the GPO of Google and it works with every extension but not with mine.
So the problem I ran into is that if I publish my app in the chrome web store you can't download it. It only says "Visit Website". As shown in the picture here: Visit Website Button in the web store
This is how my manifest.json looks like:
{
"manifest_version": 2,
"name": "Support-Ticket",
"version": "1.0",
"icons": {
"128": "128.png"
},
"app": {
"urls": [
"https://intranet.*.com/example"
],
"launch": {
"web_url": "https://intranet.*.com/example"
}
},
"permissions": [
"notifications"
]
}
I've tested it with another little app where the manifest looks like this:
{
"name": "Support Test",
"version": "1.0",
"icons": {
"128":"128.png"
},
"manifest_version": 2,
"browser_action": {},
"permissions":[
"tabs"
],
"background":{
"scripts": ["background.js"],
"persistent": false
}
}
And the .js like this:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.create({'url': chrome.extension.getURL('index.html')}, function(tab) {
// Tab opened.
});
});
I would like to have this website as chrome app and than install it on all computers in my domain with a shortcut in the Start Menu or Desktop.
Update:
I managed to create the app and display the intranet on the app with the html tag "webview".
Now it looks like this:
Window Frame
Does anyone know how I can change the color of the window frame to a darker grey?

Can I have a splash page show when I search a URL in a chrome extension?

I want to show a splash page once I enter a URL and search. For example, if I go to https://youtube.com, then my Chrome extension will first show my splashpage.html. I was researching the override pages in the documentation, but it seems that I can only use "chrome_url_overrides" for new tabs, bookmark manager, and history.
My manifest.json has a newtab that opens up my "splashpage.html" when a new tab is entered. I would like to do this same action, but before the initial URL is loaded.
manifest.json
{
"manifest_version": 2,
"name": "Splash",
"version": "1",
"author": "LC",
"browser_action": { "default_title": "Have a good day", "default_popup": "popup.html" },
"chrome_url_overrides" : { "newtab": "splashpage.html"},
"permissions": ["activeTab"]
}

How to make Google extension options page in the toolbar

Recently, I've started learning how to make Google Chrome extensions. My problem is that I don't know how to make a button in the toolbar so that when I click on it, it show me options for my extension like this example:
I can get the icon of my extension to appear in the toolbar, but nothing happens when I click on it. Here is my manifest.json:
{
"name": "Extension Name",
"version": "0.1.1.2",
"description": "Extension's description",
"manifest_version": 2,
"options_page": "options.html",
"background": {
"page": "index.html"
},
"browser_action": {
"name": "Manipulate DOM",
"icons": {
"128":"icon.png"
},
"default_icon": "icon.png"
},
"content_scripts": [ {
"js": [ "js-resource.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
}
That's a popup, not an options page. Currently you have two ways to do an options page as such:
Old way: In a separated tab.
New way (Chrome 40 onwards): In a popup in the extensions page.
However, those page are not too special and the only thing you should do to persist the user's preferences is to store them in chrome.storage.sync, as you can read in both links, respectively:
Use the storage.sync API to persist these preferences. These values will then become accessible in any script within your extension, on all your user's devices.
Always use the storage.sync API to persist your options. This will make them accessible from script within your extension, on all of your user's devices.
So as long as you store the preferences in there, you can make an options page in the browser action (or page action) popup. You just need to add the following to your manifest.json and to create the popup.html page:
"browser_action": {
"default_title": "Manipulate DOM",
"default_icon": "icon.png",
"default_popup": "popup.html",
...
}

Fire extension on very page Google Chrome Extension

I'm building a Google Chrome extension and want to autoload my extension on every new page, so that I can get the current url and check in a Database some data for it. I want to do it a bit like the adblockers and show how many ads where blocked with the badgetext. Anyway I don't get it workig to autoload on every new page I open. It loades once and then stays there. It only reloads when I click on the Icon to get the popup.html.
Here my Manifest:
{
"manifest_version": 2,
"name": "Some name",
"description": "Some desc.",
"version": "1.0",
"permissions": [
"tabs",
"background"
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"background": {
"scripts": ["background.js"],
"persistent": false
}
}
My background.js looks like this
chrome.windows.onFocusChanged.addListener(function(){
chrome.tabs.query({'active': true, 'lastFocusedWindow': true}, function (tabs) {
// do some stuff with the new url
});
});
Someone have a hint?
I would use chrome.tabs API instead of chrome.windows API.
http://developer.chrome.com/extensions/tabs.html
onCreated event and onUpdated event should work.
chrome.tabs.onCreated.addListener(function callback)
chrome.tabs.onUpdated.addListener(function callback)