Built a fresh ionic v5 app from blank template. Added minimal logic to the home page for a simple toy project and deployed to a static blob on Azure.
Copied www folder to a blob and then made it public. Surf to the URL of index.html but this produced many errors of runtime.js:1 Failed to load resource: the server responded with a status of 400 (One of the request inputs is out of range.)
So then I tried a fresh storage module and used the 'static website` option and that does work except...
when it runs, it adds /home to the address and if the user tries to refresh the page then it fails with The requested content does not exist. because of course it thinks that's a resource inside the site.
You can simulate this by running a server (eg. http-server) inside the www folder, run the app then refresh with F5. I notice there is no problem when running using the dev command ng serve
Older ionic projects didn't have this problem. Have I done something peculiar?
This prevents any mobile phone from viewing the app and then adding to home screen because it includes the /home in the address.
Have found a partial solution here
https://stackoverflow.com/a/56584151/769427
which describes using the 404 page setting of a static website to point at index.html.
It does make it work (and with deep linking too) but the disadvantage is that a 404 error is registered each time in the dev tools.
Related
I have a PWA that I am trying to use to create an Android app (apk) with a trusted web activity using bubblewrap tool (https://github.com/GoogleChromeLabs/bubblewrap). To check the PWA criteria, it uses Lighthouse which fails the following audit step (red):
start_url does not respond with a 200 when offline
Timed out waiting for start_url to respond.
But actually the step regarding to current page being offline is ok (green):
Current page responds with a 200 when offline
My PWA is hosted at an url: https://example.com/myapp/. So the service worker (manifest) has the startup url and Scope at "/myapp/". So if I access this page in Offline mode (Check the box "Offline" in the dev tools "Application" tab) it serves an offline page that is cached at the beginning when the service worker is installed (I followed this example: https://developer.mozilla.org/en-US/docs/Web/API/Cache/match and everything seems to work fine, I tested even on my mobile in airplane mode).
Also, the startup page redirects to ?locale=en but it is the same webpage (so in Offline mode every url seems to show my offline html page). What is even stranger is that in about 20-30 audit reports, one time this step passed, randomly)
I am doing the Lighthouse tests on Mac, Chrome 84.
EDIT:
So I made some tests and I saw that if I access http://example.com/myapp (instead of http://example.com/myapp/ - there is a / at the end), the offline html page is not shown anymore. But in the manifest the scope and start_url are set to "/myapp/" exactly so I don't know if this is an issue (if I set them to "/myapp" the PWA won't work anymore saying that there is no service worker at that path, which sounds strange because my jetty server redirects /myapp to /myapp/ which both should be the same resource)
The Bubblewrap lighthouse check is a wrapper around the [Pagespeed Insights API]. The PSI API can be a bit flaky and fail to run at times. If the failure is constant, I'd recommend running the URL against PSI, as you should get the same report, but with more detailed information.
I have a project in Ionic 4, when I do ionic serve it runs at localhost:8100/
Now when it loads home page, the URL is localhost:8100/home, if I open contact page the URL becomes localhost:8100/contact.
When I try to copy the above URL and hit, then it says -
Sorry, this page doesn't exist. Please check the URL or go back a page.
What do I need to do to get this working?
Based on your comments this is happening because your server does not support fallback. So when you enter a url manually, the server is trying to find that page, but you only have index.html in your app because of Client side routing.
If the app uses the Angular router, you must configure the server to
return the application's host page (index.html) when asked for a file
that it does not have.
The configuration is specific to your server or cloud platform. You can check Angular deployment for more info.
This regularly should not happen and you can't do anything for this. Try to upgrade your ionic to the latest with nodejs since the error my be from currupted project creation. Then after update create a new project and it should go good.
I'm trying to deploy a basic ionic 4 application to spaces CDN provided by digitalocean.
I uploaded the static website on gitlabpages and the website is working.
I've tried to replicate the results on spaces CDN but the file instead of being opened by the browser get downloaded once opened.
I figured out it could be the --base-href, and I tried to modify it, but without success, the index file provided by the build still get downloaded
At first I build the ionic app
ionic build --prod --base-href="xxx.gitlab.io/xxx" //code used to deploy for gitlab pages
Then for gitlab pages I deployed it using gitlab-ci.yml file, as explained here, while for deploying on spaces I used a python script
I would expect to be able to upload an ionic build into spaces CDN and being able using the link provided to see the website.
I'm not sure if I'm doing something wrong at conceptual level using a CDN, it is actually my first time trying to serve a website using this tech.
UPDATE
I've uploaded to the CDN again, and I realized that if I use the origin link, it actually load the html (even tho it gives me a lot of errors).
While is I use the CDN link, it try to download the file.
I have purged the cache of the CDN so in my opinion the CDN and the origin should behave exactly the same, Am I wrong?
I deployed MVC 4 application to Arvixe.com hosting. In local everything is okay, site opens full, but after deploying, site opens, but, not full. css, jquery, javascript is not working. Only html tags seem.
Arvixe support send this to me: How to Bin Deploy ASP.NET Assemblies on Shared Servers. But I can not understand it well. Can anybody help me to find that why site does not open full? What shloud I check to solve this?
When linking your views and resources you should use relative paths
instead of
"Views/MyView.aspx"
use
"~/Views/MyView.aspx"
This is valid for all resources in your application and it is know to cause these problems.
When working locally the paths are correct since it's all resolved to your computer.
In a web environment you will have to use the relative path so the url is resolved in front of all your resources.
I know this has some crossover to Serverfault.com but the advice on meta.stackoverflow was to ask it here (first) as it requires a .NET dev to answer more than likely.
I am having some problems publishing to my website a Click Once App, I am getting an error message saying (something like) IIS not running, I'm not currently at home to give an exact error message, i'll edit later if it is required to answer this question.
My ISP is lunarpages the plan I am on is this one IIS is definitely running as I have BlogEngine.NET running just fine. Anyone know what is required configuration wise (both server and client) to make this work?
The files that the ClickOnce publish create can be run on just about any web environment (include Apache/Linux.) It simply generates an html page along with the application manifest and your application files. Maybe you can deploy to a local folder and upload the files to the server?