manifest.json failing to load icon files - service-worker

So my setup is the following:
A static website (mkdocs) deployed at https://sub.domain.com/folder/ in Azure Blob storage, running on Kestrel.
testing locally at localhost:port without a subdomain and folder.
<link rel="manifest" type="application/manifest+json" href="manifest.json" crossorigin="use-credentials"> and file is in /folder/ in deployed state, in root in local test.
<script type="text/javascript" src="sw.js"></script> and file is in /folder/ in deployed state, in root in local test.
start_url in manifest is /folder/.
icon path in manifest is assets/icons/icon.png, assets is in /folder/ in deployed state, in root in local test.
locally the icons work but on the deployed site I get:
Icon https://sub.domain.com/folder/assets/icons/icon.png failed to load
When I go to that URL directly, the file loads just fine.
The site is behind auth but I use crossorigin="use-credentials" when loading the manifest.
Full manifest.json:
{
"short_name": "Site Hub",
"name": "Site Hub",
"start_url": "/docs/?utm_source=web_app_manifest",
"icons": [
{
"src": "assets/icons/manifest-icon-192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "assets/icons/manifest-icon-512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"display": "standalone",
"orientation": "portrait",
"theme_color": "#20232A",
"background_color": "#20232A"
}
I have tried paths like ./assets/icons/manifest-icon-512.png" before and it did not work either.

I had a similar problem and was investigating the cause.
As a result, removing the following headers solved the problem.
add_header Cross-Origin-Resource-Policy "same-origin";
https://developer.mozilla.org/en-US/docs/Web/HTTP/Cross-Origin_Resource_Policy_(CORP)

You should probably use the homepage option in your package.json for you app to know that it's deployed at https://sub.domain.com/folder.
Like this:
...
"homepage": "https://sub.domain.com/folder",
...

Related

node-canvas in electron -- "mapped file has no cdhash, completely unsigned? Code has to be at least ad-hoc signed."

I'm cresting electron app using node-canvas.
I generated an app-installer by the following command:
$ electron-builder --mac --x64 --config ./build_mac.js
build_mac.js
const config = {
"appId": "jp.maplat.editor",
"asarUnpack": [
"assets/mac/canvas"
],
"directories": {
"output": "dist"
},
"files": [
"assets/mac",
"backend",
"css",
"frontend/dist",
"html",
"img",
"locales",
"package.json",
"package-lock.json",
"tms_list.json"
],
"afterSign": "script/notarize/notarize.js",
"mac": {
"icon": "assets/mac/icon_mac.icns",
"target": [
"dmg"
],
"hardenedRuntime": true,
"gatekeeperAssess": false,
"entitlements": "script/notarize/entitlements.mac.plist",
"entitlementsInherit": "script/notarize/entitlements.mac.plist",
},
"win": {
"icon": "assets/win/icon_win.ico",
"target": "nsis"
},
"nsis":{
"oneClick": false,
"allowToChangeInstallationDirectory": true
}
};
module.exports = config;
But after installing the electron app, the app outputs following error message on web console:
Uncaught Error: dlopen(/Applications/MaplatEditor.app/Contents/Resources/app.asar.unpacked/assets/mac/canvas/build/Release/canvas.node, 1): Library not loaded: /usr/local/opt/pixman/lib/libpixman-1.0.dylib
Referenced from: /Applications/MaplatEditor.app/Contents/Resources/app.asar.unpacked/assets/mac/canvas/build/Release/canvas.node
Reason: no suitable image found. Did find:
/usr/local/opt/pixman/lib/libpixman-1.0.dylib: code signature in (/usr/local/opt/pixman/lib/libpixman-1.0.dylib) not valid for use in process using Library Validation: mapped file has no cdhash, completely unsigned? Code has to be at least ad-hoc signed.
How to solve this?
I think there are 2 issues,
How to sign this dylib?
This dylib looks installed under "/usr/local/opt", it is out of the application folder. Is this correct expected behavior?
Does anyone have the answer for this?
The solution to fix this is put all dylibs (except under "/usr/lib" or "/System/Library/Frameworks") under the folder which is in under control of electron.
Something like this in my project:
https://github.com/code4history/MaplatEditor/tree/master/assets/mac/canvas/build/Release
But just putting dylib is not working, because each dylib has information about link to other libraries.
You can check which libraries are linked from each dylib by using "otool" command, and youcan overwrite it by using "install_name_tool" command.
https://github.com/code4history/MaplatEditor/blob/master/mac_canvas_dylib
In this URL, you can find what I did for my project.

Starting Electron with JS file as argument

When I install the electron quick start and run
node_modules/.bin/electron --help
it tells me:
A path to an Electron app may be specified. It must be one of the following:
- index.js file.
- Folder containing a package.json file.
- Folder containing an index.js file.
- .html/.htm file.
- http://, https://, or file:// URL.
Running
node_modules/.bin/electron .
(i.e. the option "Folder containing a package.json file") works alright. package.json points to main.js and looks as follows:
{
"name": "electron-quick-start",
"version": "1.0.0",
"description": "A minimal Electron application",
"main": "main.js",
"scripts": {
"start": "electron ."
},
"repository": "https://github.com/electron/electron-quick-start",
"keywords": [
"Electron",
"quick",
"start",
"tutorial",
"demo"
],
"author": "GitHub",
"license": "CC0-1.0",
"devDependencies": {
"electron": "^4.1.4"
}
}
I'd assume that running this:
node_modules/.bin/electron main.js
should work as well, but it does not – it just shows the Electron "dummy" screen.
How can I specify on the command line which JavaScript to run?
Turns out the JavaScript is executed alright – the problem is how the path to the main HTML file is resolved. Solution: Replace:
mainWindow.loadFile('index.html')
with:
const arg = process.argv[1] // better command line parsing might be needed
const dir = fs.lstatSync(arg).isDirectory() ? arg : path.resolve(arg, '..')
mainWindow.loadFile(path.resolve(dir, 'index.html'))

How to make problems tab show build warnings when building via ssh

On my linux VM I have set up a docker container to build and debug my vs code C++ project via an ssh connection. Building works inside the container as well as running and debugging with breakpoints. I am stuck on how to redirect stdout to the Output and Problems tabs so i can see warnings generated from the build and then navigate to the affected files. Instead it just outputs the build to a terminal window.
The project is located in a docker volume in the location:
/var/snap/docker/common/var-lib-docker/volumes/vol-tom-2/_data/My-Project
And inside the container it is located in:
/home/buildmaster/workspace/My-Project
For debugging i have modified the launch.json file so that when setting breakpoints it matches up the files in the project to the ones in the container, by adding this line:
"sourceFileMap": {
"/home/user/workspace": "/var/snap/docker/common/var-lib-docker/volumes/vol-tom-2/_data/"
},
I would like to find something similar in tasks.json so that it can sync up my local vs code project with the warnings and errors generated from the build inside the container.
Below is my tasks.json file, thanks in advance if any one has any idea how to solve this!
{
"version": "2.0.0",
"command": "/bin/sh",
"args": ["-c"],
"reveal": "always",
"tasks": [
{
"args": [
"user#localhost",
"-p",
"32772",
"/home/build-scripts/build-script.sh"
],
"label": "build",
"command": "ssh",
"problemMatcher": {
"owner": "cpp",
"fileLocation": ["relative", "${workspaceRoot}"],
"pattern": {
"regexp": "^\/host\/(.*):(\\d+):(\\d+):\\s+(warning|error):\\s+(.*)$",
"file": 1,
"line": 2,
"column": 3,
"severity": 4,
"message": 5
}
},
}
]
}

Set file MIME type on Firebase Hosting

I'm implementing Universal Links on iOS 9+ and am trying to add the apple-app-site-association file to my Firebase Hosting root:
https://developer.apple.com/library/ios/documentation/Security/Reference/SharedWebCredentialsRef/
If your app runs in iOS 9 and later and you use HTTPS to serve the file, you can create a plain text file that uses the application/json MIME type and you don’t need to sign it.
How can I set the MIME type to "application/json"? It looks like the documentation does not list this as a possible content type.
Google Firebase Hosting has been updated to include this content type. Just add the declaration to your app config firebase.json.
Update your firebase hosting config file "firebase.json" like this; you can provide the content-type, response code as well.
"functions": {
"predeploy": [
"npm --prefix \"$RESOURCE_DIR\" run lint",
"npm --prefix \"$RESOURCE_DIR\" run build"
]
},
"hosting": {
"public": "dist/my_app",
"ignore": [
"firebase.json",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
},
{
"source": "/.well-known/assetlinks.json",
"destination": "/.well-known/assetlinks.json",
"content-type": "application/json",
"code":200
}
]
}
}

I'm try setting Sublime Plugin ftpsync for upload sass after compile with grunt and be specify file .php and .html

How should settings ftpsync.settings
"host": "ftp.host.com",
"username": "user", // or null for anonymous login
"password": "pass",
"path": "/my/host/path/",
"upload_on_save": true, // set *false* if you do not want to upload on save!
"port": 21,
"ignore": "/scss/|/backup/|/node_modules/|/.sass-cache/|/src/|/.*?\\.json|/.*?\\.js",
on this line
"ignore": "/scss/|/backup/|/node_modules/|/.sass-cache/|/src/|/.*?\\.json|/.*?\\.js",
how to write be specify .html
and after Grunt compile sass upload to my host

Resources