I am making an extension for Google Chrome which uses the Downloads API.
I want to download a .jpg file from a website.
I have used these permissions in the manifest:
"permissions": ["downloads", "*://www.thatsite.com/*"]
and the command i am using is:
chrome.downloads.download({"url":"https://www.thatsite.com/images/image1.jpg"});
This gives the following error
"Error during downloads.download: Invalid URL."
Any ideas how to solve this??
I tried with following code, and it is working as expected. I hope you are not on Stable Channel.
Put your complete code, the problem is entirely with URL.
You can refer following code as a reference
Reference
manifest.json
Registered browser action and permissions with manifest file.
{
"name": "Download Demo",
"description": "http://stackoverflow.com/questions/14560465/chrome-downloads-download-gives-error-during-downloads-download-invalid-url",
"manifest_version": 2,
"version": "1",
"browser_action": {
"default_popup": "popup.html"
},
"permissions": [
"downloads",
"*://www.google.co.in/*"
]
}
popup.html
Added <script> file to comply with CSP.
<html>
<head>
<script src="popup.js"></script>
</head>
<body>
<button id="download">Download</button>
</body>
</html>
popup.js
Simply passed URL to download API.
document.addEventListener("DOMContentLoaded", function () {
document.getElementById("download").addEventListener("click", function () {
chrome.downloads.download({
"url": "http://www.google.co.in/images/srpr/logo3w.png"
}, function () {
console.log("downloaded");
});
});
});
Related
I've been looking everywhere for an answer to what seems like a simple problem but can't find anything that works. Making a chrome extension and all I want it to do right now is display how many DOM items are listed on the current page.
masnifest.json:
{
"manifest_version": 3,
"name": "Tag Manager",
"description": "",
"version": "1.0",
"permissions": ["scripting",
"tabs",
"notifications"],
"host_permissions": ["https://*/*"],
"action": {
"default_popup": "popup.html"
}
}
popup.html:
<html>
<head>
<title></title>
</head>
<body>
<script src='popup.js'></script>
</body>
</html>
popup.js:
function hello() {
var name = document.getElementsByClassName('wd-tag-row').length;
alert("Tags " +name);
}
hello();
When I run the popup.js script from the developer console on the page I'm testing it works. An alert pops up that says "Tags: 9" but whenever I run the extension it says "Tags: 0" and I can't figure out why.
Any help would be appreciated, thank you!
Tried moving around where the script is called on, and tried making it run when the page is finished loading.
I am writing a chrome extension and am trying to bind an event listener to an HTML button via an external JS file.
The event listener works, however Chrome throws the following error:
This is manifest.json, background.js, and popup.html file in that order:
{
"name": "DRIP",
"version": "1.0",
"manifest_version": 2,
"description": "DRIP is an automation tool for purchasing limted items",
"permissions": ["storage", "tabs"],
"browser_action": {
"default_popup": "popup.html"
},
"background": {
"scripts": ["background.js"]
}
}
function myAlert(){
alert('hello world')
}
document.addEventListener('DOMContentLoaded', function () {
document.getElementById('alertButton').addEventListener('click', myAlert);
});
__
<html>
<head>
<title>Test</title>
</head>
<body>
<form name='testForm'>
<input type='button' id='alertButton' value='click me'>
</form>
<script language='javascript' src='background.js' defer></script>
</body>
I'm sorry if my formatting isn't great. Input is greatly appreciated!
Remove
"background": {
"scripts": ["background.js"]
}
That's for running tasks in the background and loads a background page. It is running on a blank page _generated_background_page.html (that it generated for you). Note that you can set the background page's html if you needed to.
Popup is a separate background page with the html set to the default_popup value. That is the page you get when you click the icon and get a popup.
Official docs for reference: https://developer.chrome.com/extensions/background_pages
Following up on a previous post, I am now trying to create a version of a Chrome extension that does not specify content_scripts: or matches: in the manifest.json file; instead the content script is to be injected programmatically by a en event triggered from the options page which prompts the user to grant optional permissions for executing the content script. The rationale is to be able to have the extension working on pages from hosts with different top-level domain names (see previous post for details). I have read the documentation on this and tried to connect the dots, but I'm not quite getting there.
Below is a demo version of what I have created so far. I manage to get the optional permissions request processed and the user prompt for granting that request shown (the alert "granted!" is displayed). However, when I try to have the message listener in background.js execute the script content.js (by removing the /* commented-out code */ there), I get the error message
Unchecked runtime.lastError: Cannot access contents of url
"chrome-extension://[blah]/options.html". Extension manifest must
request permission to access this host.
Any guidance as to what I have missed here would be most welcome.
I also have a second question: since I am using jQuery in the content.js script, do I have to execute the jQuery.js file as well in response to the granted permission, and if so, should that be done by adding another separate chrome.tabs.executeScript() command?
manifest.json:
{
"manifest_version": 2,
"name": "My Extension",
"version": "1",
"description": "Demo extension",
"options_page":"options.html",
"background": {
"scripts": ["background.js"],
"persistent": false
},
"optional_permissions":["tabs","https://*/*"],
"permissions": ["activeTab","storage"]
}
options.html:
<html>
<head>
<style>
button#permreq{font-size:2em;}
</style>
</head>
<body>
<button id="permreq">Click this button to enable My Extension</button>
<script src="jQuery.js"></script>
<script src="options.js"></script>
</body>
</html>
options.js:
jQuery(function($){
$(document).ready(function(){
$("button#permreq").click(function(){
chrome.permissions.request({
permissions: ['tabs'],
origins: ["https://*/*"]
}, function(granted) {
if (granted) {
chrome.runtime.sendMessage("granted");
} else {
alert("denied");
}
});
});
});
});
background.js:
chrome.runtime.onMessage.addListener(
function(message, callback) {
if (message == "granted"){
/*chrome.tabs.executeScript({
file: "content.js"
});*/
alert("granted!");//no errors as long as above code is commented out
} else{
alert("denied");
}
});
I am trying create a bookmarks (on this case in chrome)
API/bookmarks/create
my code is :
function onCreated(node) {
console.log(node);
}
var createBookmark = browser.bookmarks.create({
title: "bookmarks.create() on MDN",
url: "https://developer.mozilla.org/Add-ons/WebExtensions/API/bookmarks/create"
});
createBookmark.then(onCreated);
<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<p>text example</p>
</body>
</html>
I got this error when I run the code in chrome:
Uncaught ReferenceError: browser is not defined
I run other code this :
function onFulfilled(bookmarkItems) {
if (bookmarkItems.length) {
console.log("active tab is bookmarked");
} else {
console.log("active tab is not bookmarked");
}
}
function onRejected(error) {
console.log(`An error: ${error}`);
}
function checkActiveTab(tab) {
var searching = browser.bookmarks.search({url: tab.url});
searching.then(onFulfilled, onRejected);
}
browser.browserAction.onClicked.addListener(checkActiveTab);
from :here I got the same error.
Update question :
my manifest.json in this moment:
{
"name": "add site random",
"version": "1.0",
"description": "this is my first extension in production",
"manifest_version": 2
}
any idea because I have this error I am trying create a folder and add a site in my bookmarks from the code?
From your recent edit and by looking at your manifest.json it looks like you are missing few permissions field,
Hence update your manifest.json like this, (then package a new extension afresh)
{
"name": "add site random",
"version": "1.0",
"description": "this is my first extension in production",
"manifest_version": 2,
"background": {
"scripts": ["YOUR_BACKGROUND_SCRIPT_NAME.js"]
},
"permissions": [
"notifications",
"activeTab"
]
}
Hope this helps!
Aside from missing script calls within the manifest file, which after checking the commented gist link appears to have been resolved (good catch #DavidR!), however, both versions of the question's code are still missing a reference to the manifest file from within the html's <head> block, eg. something like <link rel="manifest" href="/manifest.webmanifest"> as suggested by Mozilla might just allow ya past the current issues.
For completeness sake the following is what I perpose you do to that index.html file...
<!DOCTYPE html>
<html>
<head>
<link rel="manifest" href="/manifest.webmanifest">
<title>test</title>
</head>
<body>
</body>
</html>
... and I'll also suggest renaming the manifest file to have the webmanifest extension because of reasons related to the specification.
I wanted to build a chrome extension that will update some page (from other source/page) without any popup (the question is silly as I know as I am new in extension dev)
For example, I had my manifest.json:
{......
"browser_action": {
"default_icon": "icon.png",
"default_title": "My chrome extension title"
},
"background": {
"scripts": ["background.js"],
"persistent": false
},
"permissions": [
"activeTab",
"https://ajax.googleapis.com/"
]
......
}
background.js:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.create({ url: "pageloader.html" });
});
pageloader.html:
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function () {
$("#status").append("hello chrome extension");
})
</script>
<title>Page loader</title>
</head>
<body>
<div id="status">
</div>
<p>hello</p>
</body>
</html>
When I open 'pageloader.html', javascript is just running fine and showing the output in the browser like:
hello chrome extension
hello
But when I run install the extension and clicking on the 'extension' it is opening 'pageloader.html' in the new tab but showing only
hello
I mean, the javascript part is not running. I will appreciate, if someone would show me my mistake.
CSP does not allow inline javascript and loading resources like jquery from external servers. In order to make it work.
Download jquery and save it in local directory under extension folder.
Move the inline javascript in external file and then include this file after jquery.
If you want to relax the default policy : https://developer.chrome.com/extensions/contentSecurityPolicy#relaxing