Add to home screen gives 404 error in iphone - ios

My project is in reactjs progressive web app. When i do
Add to home screen for iphone app displays 404 on opening.
While in android it is working fine.
In my local project it is working fine in iphone and android.
for live it is working fine in android but not working in iphone.
Here is my manifest.json file :
{
"short_name": "My App",
"name": "My App",
"icons": [
{
"src": "MY_App_Icon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
}
],
"start_url": "login",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}

Setting start_url to "start_url": ".", should work
If you want to redirect to /login you will need to handle that in your application.

Related

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.

Make electron app smaller?

I just recently built an electron app and packaged it using electron-packager. The .exe file is 55,000kb and the rest of the folder is quite bulky as well. Is there any way to take down the size of this application at all?
Here's a github issue on it.
The comment I'm emphasizing is:
That's the expected size, there is no way to make it smaller.
The reason why it's so big is because electron is loading most of chromium inside that 50mb file.
So no unfortunately there is no way to make it smaller sorry.
A somewhat helpful post from that github thread suggests removing unnecessary node modules via electron-packager. It also offers a bit more explanation on why files are so large.
You can zip your app and if you're using electron-packager you can ignore some node modules that you don't need when the app is running, this makes it a bit smaller. For instance I have a 37MB zipped Electron app (Note Windows version is much larger as it contains a copy of Git). But Electron will always have a large part of Chrome in it so there is only so much that can be done. Electron itself right now is ~33MB.
There is a way to reduce Electron size drastically (up to 99%, depending how big is your app), by using native browser, available in each OS, instead of loading webkit. BUT as built in browsers don't have the system API's, you will also be drastically limited in what you can do. But, if you need basic web ui app, this might be the best solution out there, though, it must be mentioned, that it might have some unexpected issues, as you will need to test your app on different OS'es browsers..
The method i'm talking about is available in awesome post Put your Electron app on a diet with Electrino by Pauli Olavi Ojala
If you are using Electron Builder https://www.electron.build you should use the various methods listed to remove files and folders for specific platforms.
Example
{
"name": "Example",
"version": "1.1.2",
"description": "",
"main": "main.js",
"scripts": {},
"build": {
"appId": "com.example",
"afterSign": "notarize.js",
"fileAssociations": [{
"ext": [
"mp4"
],
"name": "Media File",
"role": "Viewer"
}],
"dmg": {
"sign": true
},
"mac": {
"hardenedRuntime": true,
"gatekeeperAssess": false,
"entitlements": "build/entitlements.mac.plist",
"entitlementsInherit": "build/entitlements.mac.plist",
"icon": "build/icon.png",
"category": "public.app-category.video",
"extraFiles": [{
"from": "resources/bin/mac",
"to": "Resources/bin/mac",
"filter": [
"**/*"
]
},
{
"from": "node_modules/platforms/darwin-x64/bin",
"to": "Resources/bin/mac",
"filter": [
"**/*"
]
}
],
"files": [
"!gruntfile.js",
"!README.md",
"!notarize.js",
"!.env",
"!minify.js",
"!src/*",
"!.git/*",
"!resources/*"
]
},
"win": {
"target": "nsis",
"signingHashAlgorithms": [
"sha1"
],
"certificateFile": "",
"certificatePassword": "",
"files": [
"!gruntfile.js",
"!README.md",
"!notarize.js",
"!.env",
"!minify.js",
"!.git/*",
"!resources/mac/*"
]
}
},
"author": "Example",
"license": "ISC",
"devDependencies": {
},
"dependencies": {
}
}

How to see or debug chrome content script in firefox nightly (webextensions)

Trying to port a working chrome extension to Firefox Nightly 46.0a1 and have a simple question! How do I get the content script to execute or see it at all?
Everything else but the content script seam to be running OK as the background script execute and the popup box is visible. I am able to debug these part of the code.
But the content script do not seam to run in any way!
As far as I understand it is supposed to be part of the normal page javascript environment and visible in the debugger - but it is not. Unable to see any error messages anywhere etc.
Might have used some unsupported API by mistake, but still strange that I get no warnings and are unable to see anything.
Any proposal about how to proceed?
Manifest file below:
{
"name": "Bla Bla",
"version": "0.0.1",
"manifest_version": 2,
"description": "A description",
"homepage_url": "https://aaa.org",
"icons":
{
"16": "icons/lock_red16.png",
"48": "icons/lock_red48.png",
"128": "icons/lock_red128.png"
},
"default_locale": "en",
"background":
{
"scripts":
[
"js/lib/jserror/jserror.js",
"js/lib/lang/languagedb.js",
"js/lib/lz77.js",
"js/lib/pcrypt.js",
"js/lib/pcryptapi.js",
"js/lib/forge.bundle.js",
"js/lib/elliptic.js",
"js/lib/srp6a/biginteger.js",
"js/lib/srp6a/isaac.js",
"js/lib/srp6a/random.js",
"js/lib/srp6a/sha256.js",
"js/lib/srp6a/thinbus-srp6client.js",
"js/lib/srp6a/thinbus-srp-config.js",
"js/lib/srp6a/thinbus-srp6a-config-sha256.js",
"js/pcrypt_shared.js",
"js/pcrypt_extension.js",
"src/bg/background.js"
],
"persistent": true
},
"browser_action":
{
"default_icon":
{
"16": "icons/lock_red16.png",
"48": "icons/lock_red48.png",
"128": "icons/lock_red128.png"
},
"default_title": "Password Crypt",
"default_popup": "src/browser_action/popup.html"
},
"permissions":
[
"clipboardWrite",
"storage"
],
"content_scripts":
[
{
"matches":
[
"http://*/*",
"https://*/*"
],
"js":
[
"js/pcrypt_extension.js",
"src/inject/inject.js"
]
}
],
"externally_connectable":
{
"matches":
[
"https://*.aaa.dk/*",
"https://*.aaa.org/*"
]
},
"web_accessible_resources":
[
"icons/*.png"
],
"applications":
{
"gecko":
{
"id": "benny#aaa.dk",
"strict_min_version": "40.0.0",
"strict_max_version": "50.*",
"update_url": "https://aaa.org/addon"
}
}
}
As far as I understand it is supposed to be part of the normal page javascript environment and visible in the debugger - but it is not.
No, they're not. They run in slightly more privileged contexts separate from the page environment so they can access the webextension APIs.
If you have e10s off you can use the browser toolbox. If it is on you need to use the browser content toolbox instead. You can also try about:debugging, although i'm not sure whether that already works for webextensions.
MDN docs have everything you need to know about debugging WebExt, including content scripts.

How will Google email markup support application deeplinking?

Reading through the Google email markup documentation (https://developers.google.com/gmail/markup/overview) I found not information on how it is possible to deeplink into a native application.
Since an email contains LD+JSON and contains the URL, why can't the schema not support a native deep-link into the Android or iOS app?
I would have thought that this is the most obvious use-case where one-click actionable content makes sense.
If you look at the JSON-LD example for EntryPoint on Schema.org you'll notice that it allows android-app:// and other types of deep links which is a very explicit way of providing deep links for each platform:
<script type="application/ld+json">
{
"#context": "http://schema.org",
"#type": "Restaurant",
"name": "Tartine Bakery",
"potentialAction": {
"#type": "ViewAction",
"target": [
"http://www.urbanspoon.com/r/6/92204",
{
"#type": "EntryPoint",
"urlTemplate": "http://api.urbanspoon.com/r/6/92204",
"contentType": "application/json+ld"
},
"android-app://com.urbanspoon/http/www.urbanspoon.com/r/6/92204",
{
"#type": "EntryPoint",
"urlTemplate": "urbanspoon://r/6/92204",
"application": {
"#type": "SoftwareApplication",
"#id": "284708449",
"name": "Urbanspoon iPhone & iPad App",
"operatingSystem": "iOS"
}
},
{
"#type": "EntryPoint",
"urlTemplate": "urbanspoon://r/6/92204",
"application": {
"#type": "SoftwareApplication",
"#id": "5b23b738-bb64-4829-9296-5bcb59bb0d2d",
"name": "Windows Phone App",
"operatingSystem": "Windows Phone 8"
}
}
]
}
}
</script>
Eventually, once deep linking is baked into all of Google's products, these mappings could be crawled from your webpage and the correct links automatically applied regardless of whether you're view a Highlight in Gmail on Chrome or one of the native mobile apps.

Firefox addon shows name but no icon in Customize window

I have recently developed a Firefox addon using the SDK.
However, once installed the icon does not show, but only the name of the addon in the Customize window for the addon bar (or the menu in Australis).
I haven't seen this behavior in other addons, so I'm guessing it is probably something I did wrong.
Maybe I didn't include the right sized icon? My package.json contains the lines:
...
"icon": "data/icons/icon32.png",
"icon64": "data/icons/icon64.png",
...
The icons display well in the widget and in the addon page.
Shouldn't that be enough?
Your code snippet looks correct but it's hard to tell without more context. Here is the full package.json file for an add-on I wrote that works fine for me on Firefox 29+:
{
"name": "transmission-web-helper",
"license": "MPL 2.0",
"author": "Jeff Griffiths",
"version": "0.4",
"fullName": "transmission-web-helper",
"id": "transmission-web-helper#canuckistani.ca",
"description": "a basic add-on",
"icon": "data/icon48.png",
"icon64": "data/icon64.png",
"preferences": [{
"name": "transmissionUrl",
"title": "URL for Transmission RPC",
"type": "string",
"value": "http://localhost:9091/transmission/rpc"
},
{
"description": "If selected, torrents will start automatically.",
"type": "bool",
"name": "transmissionAutostart",
"value": true,
"title": "Auto-start?"
},
{
"description": "If selected, this add-on will print debug .",
"type": "bool",
"name": "transmissionDebug",
"value": false,
"title": "Debug"
}
]
}
Full source for the add-on is on github

Resources