Page 404 on reloading Vue.js app running in Tomcat - vue.js

Our webapp has its backend running on Java Spring and front end on Vue.js. Both are hosted in Tomcat (webapps folder). The backend is inside 'ROOT' folder, and front end is inside 'front' folder inside Webapps dir.
As vue front end is SPA, when we reload the app, we get a 404 as the server isn't able to find appropriate location from the reload URL. What settings should I change in Tomcat so that the reload works? Thanks in advance.

Related

Vue : 404 page not found after refresh page

I have Vue website works correctlly on localhost ,after I build it and uploaded it on server ,the routes works fine but have two problems :
1- when I click on route and the page open ,then if i refresh the page it gives me an error 404 page not found.
2- the connect to api by axios don't work?
How can I solve them?
The problem is your web server. Make sure that your web server (Apache, Nginx, Express etc.) always points to the Index.html.
Your web server is not aware that the SPA should do the routing.

Steps to redirect Application URL to Custom URL

i have IHS 7 installed on an AIX system and its pointing to Application Server . now my requirement is if Application is not accessible or if we are working on the Application it self then whoever access the URL, it redirects to a custom page on the webserver that Application is under construction .
for example url is https://my.Application.com:8089/application if anyone hits this URL then this URL is redirected to custom URL on same webserver https://my.webserver
i have configured a proxy on IHS httpd.conf but it is not working
The good practice in such case is to create two config files and one maintenance page. When your app server do not work you should restart http server with config file which point to the maintenance page.

Always serve index.html when page not found

I am about to deploy a React app using react-router in our intranet. I am using Kestrel without a reverse proxy.
When I start browsing the site by typing https://myserver/, the page gets served and I can click links which take me to https://myserver/subpage, but subpage does not exist inside wwwroot, only react-router uses this to determine the contents to display. Now if the user presses the browser's reload button, a 404 is returned.
Should I configure Kestrel to serve index.html in case the requested resource is not found? If so, yes? Or is there a more elegant solution?

How to add apple-app-site-association file to my Ember app?

Ember newbie here. I am trying to host the apple-app-site-association file in our s3 instance and am not sure how to do it.
We have a website and a web application written in Ember. Like mysite.com leads to the site and mysite.com/app leads to the app.
The apple-app-site-association file needs to be in the root of the domain so when I invoke mysite.com/apple-app-site-association, I should be able to download the file. When I try adding the file to the public folder of the website and try to access it, the web app's 404 route is triggered.
So when I try to reach mysite.com/apple-app-site-association the url changes to mysite.com/app/apple-app-site-association and it says page not found.
The website itself doesn't have a redirect. Only the web app has the redirect so am not sure why it is triggered. Am new to Ember so am sorry if it is something obvious.

How to deploy two Angular5 project on amazon S3

We need to deploy two different Angular5 project on Amazon S3, like
/assets (folder)
/index.html
/clients (another Angular5 folder)
/clients/assets (folder)
/clients/index.html
For example my domain is https://example.com
Now, When we try to access root index.html files with https://example.com, it is working fine. but, When we trying to access https://example.com/clients, it returns an error "Error: Cannot match any routes. URL Segment: 'clients'"
One more thing, We have setup 403 redirection on rootpath index.html, because we need to access login page when customer directly hit URL : https://example.com/login
So, When I am trying to access https://example.com/clients, it is automatically redirected on https://example.com
Could anyone please help me on this?
The project should be built with this command:
ng build --base-href /clients/
Option base-href indicates that, you what is before the Angular routes.
On the other hand, it's posible you need something like nginx in your server that redirect the request to different projects.