mirror of
https://github.com/mdn/webextensions-examples.git
synced 2026-04-16 06:18:35 +02:00
an example using permissions (#204)
* an example using permissions * fix up after suggestions from wbamberg
This commit is contained in:
9
permissions/README.md
Normal file
9
permissions/README.md
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
# Permissions Example
|
||||||
|
|
||||||
|
## What it does
|
||||||
|
|
||||||
|
An example using the permissions API to grant and revoke an optional permission.
|
||||||
|
|
||||||
|
## What it shows
|
||||||
|
|
||||||
|
How to request a permission, catching error conditions from the request and querying the permissions API.
|
||||||
5
permissions/background.js
Normal file
5
permissions/background.js
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
browser.browserAction.onClicked.addListener(() => {
|
||||||
|
browser.tabs.create({
|
||||||
|
url: browser.runtime.getURL("page.html")
|
||||||
|
});
|
||||||
|
});
|
||||||
6
permissions/bootstrap.min.css
vendored
Normal file
6
permissions/bootstrap.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
permissions/icon.svg
Normal file
1
permissions/icon.svg
Normal file
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 500 500" height="500px" id="Layer_1" version="1.1" viewBox="0 0 500 500" width="500px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path clip-rule="evenodd" d="M131.889,150.061v63.597h-27.256 c-20.079,0-36.343,16.263-36.343,36.342v181.711c0,20.078,16.264,36.34,36.343,36.34h290.734c20.078,0,36.345-16.262,36.345-36.34 V250c0-20.079-16.267-36.342-36.345-36.342h-27.254v-63.597c0-65.232-52.882-118.111-118.112-118.111 S131.889,84.828,131.889,150.061z M177.317,213.658v-63.597c0-40.157,32.525-72.685,72.683-72.685 c40.158,0,72.685,32.528,72.685,72.685v63.597H177.317z M213.658,313.599c0-20.078,16.263-36.341,36.342-36.341 s36.341,16.263,36.341,36.341c0,12.812-6.634,24.079-16.625,30.529c0,0,3.55,21.446,7.542,46.699 c0,7.538-6.087,13.625-13.629,13.625h-27.258c-7.541,0-13.627-6.087-13.627-13.625l7.542-46.699 C220.294,337.678,213.658,326.41,213.658,313.599z" fill="#010101" fill-rule="evenodd"/></svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
29
permissions/manifest.json
Normal file
29
permissions/manifest.json
Normal file
@@ -0,0 +1,29 @@
|
|||||||
|
{
|
||||||
|
"manifest_version": 2,
|
||||||
|
"name": "Permissions Example",
|
||||||
|
"description": "Permissions Example",
|
||||||
|
"version": "1.0",
|
||||||
|
|
||||||
|
"background": {
|
||||||
|
"scripts": ["background.js"]
|
||||||
|
},
|
||||||
|
"icons": {
|
||||||
|
"48": "icon.svg"
|
||||||
|
},
|
||||||
|
"browser_action": {
|
||||||
|
"default_title": "Permissions Example",
|
||||||
|
"default_icon": "icon.svg"
|
||||||
|
},
|
||||||
|
|
||||||
|
"permissions": [
|
||||||
|
"tabs"
|
||||||
|
],
|
||||||
|
"optional_permissions": [
|
||||||
|
"history"
|
||||||
|
],
|
||||||
|
"applications": {
|
||||||
|
"gecko": {
|
||||||
|
"strict_min_version": "55.0a2"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
3
permissions/page.css
Normal file
3
permissions/page.css
Normal file
@@ -0,0 +1,3 @@
|
|||||||
|
p.bg-danger, p.bg-success, p.bg-warning {
|
||||||
|
padding: 1em;
|
||||||
|
}
|
||||||
31
permissions/page.html
Normal file
31
permissions/page.html
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Permissions Example</title>
|
||||||
|
<link rel="stylesheet" href="page.css"/>
|
||||||
|
<link rel="stylesheet" href="bootstrap.min.css"/>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="container">
|
||||||
|
<h3>Permissions Example</h3>
|
||||||
|
<p style="display: none" id="result"></p>
|
||||||
|
<p>
|
||||||
|
<b>Current permissions returned by the API:</b>
|
||||||
|
<span id="permissions"></span>
|
||||||
|
</p>
|
||||||
|
<hr>
|
||||||
|
<ul>
|
||||||
|
<li>The <code>tabs</code> permission has been <b>granted</b> on install.</li>
|
||||||
|
<li>The <code>history</code> permission is an optional permission that can be
|
||||||
|
<a href="#" class="permission" data-permission="history" data-action="grant">granted</a> or
|
||||||
|
<a href="#" class="permission" data-permission="history" data-action="revoke">revoked</a>.
|
||||||
|
</li>
|
||||||
|
<li>The <code>cookies</code> permission cannot be <a href="#" class="permission" data-permission="cookies" data-action="grant">granted</a>, because it was not included in the <code>optional_permissions</code> manifest key.</li>
|
||||||
|
<li>The <code>foo</code> permission cannot be <a href="#" class="permission" data-permission="foo" data-action="grant">granted</a>, because it is not a valid permission name.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<script src="page.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
46
permissions/page.js
Normal file
46
permissions/page.js
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
function updatePermissions() {
|
||||||
|
browser.permissions.getAll()
|
||||||
|
.then((permissions) => {
|
||||||
|
document.getElementById('permissions').innerText = permissions.permissions.join(', ');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async function processChange(event) {
|
||||||
|
let permission = event.target.dataset.permission;
|
||||||
|
let result = document.getElementById('result');
|
||||||
|
|
||||||
|
try {
|
||||||
|
if (event.target.dataset.action === 'grant') {
|
||||||
|
browser.permissions.request({permissions: [permission]})
|
||||||
|
.then((response) => {
|
||||||
|
result.className = 'bg-success';
|
||||||
|
result.textContent = 'Call successful.';
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
// Catch the case where the permission cannot be granted.
|
||||||
|
result.className = 'bg-warning';
|
||||||
|
result.textContent = err.message;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
browser.permissions.remove({permissions: [permission]})
|
||||||
|
.then((response) => {
|
||||||
|
result.className = 'bg-success';
|
||||||
|
result.textContent = 'Call successful.';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch(err) {
|
||||||
|
// Catch the case where the permission is completely wrong.
|
||||||
|
result.className = 'bg-danger';
|
||||||
|
result.textContent = err.message;
|
||||||
|
}
|
||||||
|
result.style.display = 'block';
|
||||||
|
updatePermissions();
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
|
||||||
|
for (let element of document.getElementsByClassName('permission')) {
|
||||||
|
element.addEventListener('click', processChange);
|
||||||
|
}
|
||||||
|
|
||||||
|
updatePermissions();
|
||||||
Reference in New Issue
Block a user