How to use popup.html from URL in Chrome Extension? - url

I want to create an extension for Google Chrome, and it will be real simple.
I will have a database on my website's server, it will check if a URL is in the "blacklist" table, and warn the user if it is.
But I don't know where to start. I tried putting all the files on my web server, and changin the manifest.json file as such:
(changed the "default_popup" line)
{
"manifest_version": 2,
"name": "My Extension",
"description": "This extension warns you if you are trying to open a blacklisted URL",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "http://www.mysite.com/my_extension/popup.html"
},
"permissions": [
"https://secure.flickr.com/"
]
}
Note : this file resides on my computer, I load it from the "Extensions" menu of Chrome.
but when I tried to install this extension, I got the error :
This web page could not be found:chrome-extension://hgfdjnsakhkijfmdnadmlacgjggggkpf/http://www.mysite.com/my_extension/popup.html

Instead of trying to hard code it in the manifest file, try putting something like this in a background page:
chrome.browserAction.setPopup({popup: "http://www.mysite.com/my_extension/popup.html"});
However, it may not be possible to specify an external popup page at all.
Nevertheless, it would be better to include the popup in the extension files and then get just the data from your server.

Related

connecting custom domain to firebase dynamic links project

I had already connected the free custom page.link subdomain and this works great and as expected. It opens my app and redirects users to the specific pages. However, I recently got a custom domain from google domains and wanted to connect it. the domain is https://gifte.app
I connected it to my projects associated domains : applinks:gifte.app and another link : applinks:gifte.app/applinks
In the firebase console I also added https://gifte.app and added https://gifte.app/applinks
when adding the first one, it told me to add some lines to the DNS settings which I did. And when adding this one https://gifte.app/applinks firebase told me to add
"appAssociation": "AUTO",
"rewrites": [ { "source": "/applink/**", "dynamicLinks": true } ]
to firebase.json which I added and is in my project directory.
when creating a dynamic link. I used
DynamicLinkComponents.init(link: linkParameter, domainURIPrefix: "https://gifte.app/applinks")
and created the link the way shown in the firebase tutorial videos. Running the project and trying to create the dynamic link. I get this error
Error Domain=com.firebase.durabledeeplink Code=0 "Your project does not own Dynamic Links domain: https://gifte.app
however when using https://gifte.page.link I do not get the error and it works fine.
When using https://gifte.app instead as the domainURIPrefix, the dynamic link is generated. however when it is clicked in the notes app. It doesnt redirect to the app. It instead redirects me to a 404 ERROR
This file does not exist and there was no index.html found in the
current directory or 404.html in the root directory.
Why am I seeing this? You may have deployed the wrong directory for
your application. Check your firebase.json and make sure the public
directory is pointing to a directory that contains an index.html file.
You can also add a 404.html in the root of your site to replace this
page with a custom error page
In summary of creating the links
https://gifte.page.link as domainURIPrefix works
https://gifte.app as domainURIPrefix creates url but doesn't redirect to app when clicked in notes. Instead to firebase error screen
https://gifte.app/applinks as domainURIPrefix does not work and gives error in app
So my question is, how can I get the custom dynamic links working the same as the free page.link subdomain? I don't get why adding the custom domain has caused so many problems and why using https://gifte.app/applinks gives an error saying that I do not own the domain.
my firebase.json file
{
"functions": {
"predeploy": [
"npm --prefix \"$RESOURCE_DIR\" run lint"
],
"source": "functions"
},
"hosting": {
"public": "public",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"appAssociation": "AUTO",
"rewrites": [ { "source": "/applink/**", "dynamicLinks": true } ]
}
}
Does anyone have a solution? Thank you.

Allow sharing a file in iOS on standalone mode in a WebApp

I have a WebApp and it works alright in both Android and iOS environments. The problem is, in one of the screens, the WebApp generates (and displays) a PDF file, which should be shareable through Email, WhatsApp, Telegram, etc.
Android does allow the share option in the standalone display mode, but iOS just doesn't. I need to know if there's any way I can actually exit the WebApp mode into plain good-old-browser mode when opening the pdf file, so that the user can actually share it with his/her contacts through the browser's native share dialog.
These are the contents of the manifest.json file
{
"name": "Test App",
"short_name": "TestApp",
"icons": [
{
"src": "/icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"start_url": "https://example.com?a2hs=1",
"scope": "/",
"display": "standalone",
"orientation": "portrait",
"background_color": "#000000",
"theme_color": "#000000"
}
So far, I've tried:
using Display PDF in the pdf link.
using javascript to force-open a new window:
test
<script>
$(function(){
$('#pdf').click(function(e){
e.preventDefault();
window.open($(this).attr('href'), '_blank');
return false;
});
});
</script>
None of those solutions worked out.
Also, I tried changing the display: property in the manifest.json file to minimal-ui - that does allow to share the file/url but that removes the WebApp look & feel, so it's not an option.
Any ideas? Thanks!
I managed to find a solution. I created this alias subdomain:
pdf.example.com
Then, I linked the pdf to the alias subdomain:
Display PDF
iOS recognizes this as another server, so it automatically forces the load of the file in a new tab in Safari, exiting the current standalone mode of the webapp.

How to set up Deep Links with phonegap.build for iOS?

Im trying to get Deep Links to work in my iOS, phonegap build app that loads a webpage from my server.
I have included the “cordova-universal-links-plugin” plugin and in my config I have this.
<plugin name="cordova-universal-links-plugin" source="npm" />
<universal-links>
<host name="manmade.se" scheme="manmade" event="ul_myExampleEvent" />
</universal-links>
I have created a apple-app-site-association file and uploaded it to my server in the root. And it it downloads the file when I go there with the browser.
{
"applinks": {
"apps": [],
"details": [
{
"appID": "7MP323UK6C.se.manmade.mobilrex",
"paths": [ "*" ]
}
]
}
}
And I have set “Associated Domains” in my AppId before I downloaded the provision.profile
And in my index.html file I have this eventlistner.
universalLinks.subscribe('ul_myExampleEvent', function (eventData) {
// do some work
// in eventData you'll see url и and parsed url with schema, host, path and arguments
console.log('Did launch application from the link: ' + JSON.stringify(eventData));
alert('Did launch application from the link 1: ' + JSON.stringify(eventData));
});
And as far as I understand this is all I have to do to make Deep links to work, så when I click on a https://manmade.se link in my iPhone it should open it in my app!??
So has anybody done this before? I don´t know what Im missing.
I get no error anywhere, but it is not firing the “ul_myExampleEvent” or anything else.
So any input really appreciated, thanks.
You've checked the Associate Domain, but you didn't add your domain there.
Add your domain with the applinks: prefix which is in your case applinks:manmade.se

Firefox webextension: Save page as html or text

With the new firefox webextensions: Is there a way to save the current page (or a part of it) as html (or text) to disk? If not, how are the chances, such an API will be implemented in the future?
I didn't find any suitable API and appreciate any help.
Regards
There are probably several ways to do this. The following will get you started. It saves the webpage in the currently focused tab in the active window to the browser's default downloads path. The file name is set to 'samplePage.html' (you can change that by modifying the filename value in the downloads.download() options; or you can remove that field entirely and leave it to the default naming).
You will need to store icon images in your webextension package for the user to be able to click on. Also, be sure to navigate to a webpage you want to save before you try to use the webextension; webextensions are not active on the Firefox about:debugging page.
manifest:
{
"name": "SavePage",
"version": "1.0",
"description": "Clicking browser icon saves page html",
"manifest_version": 2,
"icons": {
"48": "icons/clickme-48.png"
},
"permissions": [
"tabs",
"activeTab",
"downloads"
],
"browser_action": {
"default_icon": "icons/clickme-32.png"
},
"background": {
"scripts": ["background.js"]
}
}
background script:
/* BACKGROUND SCRIPT
Clicking on browser toolbar button saves the webpage in the
current tab to the browser's default downloads path with a
filename of "samplePage.html". The "tabs" and "downloads"
permissions are required.
*/
browser.browserAction.onClicked.addListener((tab) => {
var currentUrl = tab.url;
function onStartedDownload(id) {
console.log(`Started to download: ${id}`);
}
function onFailed(error) {
console.log(`Something stinks: ${error}`);
}
var startDownload = browser.downloads.download({
url : currentUrl,
filename: 'samplePage.html'
});
startDownload.then(onStartedDownload, onFailed);
});
An alternative approach might be to try to save the webpage to local storage rather than to disk. I have not explored that option.
These pages may be helpful:
downloads.download()
browserAction.onClicked
There may be security risks in giving a webextension these permissions. You will have to weigh the risks for your own usage pattern.

Forcing default l10n language in Firefox Extension

I already read answers about placing a
default.properties
file or a
package.properties
, and even that the browser already detects the unique language as default, but it is not working.
I have my browser configured in french, and my partner had it in english. We are just implementing the extension in english, but when I run the extension in the french browser, it doesn not load anything.
I also read about having some properties in the package.json like:
"locales": {
"en": {
"name": "Open Web",
"description": "Come on!"
},
"fr": {
"name": "L'Open Web",
"description": "Allez!"
}
},
"default_locale": "en"
But didn't work.
I'm using last stable version of Firefox 42.0b1. Any idea?
You need to have a default en-US.properties file. That's the default if the user language is not supported by your extension.

Resources