Angular ng build. http://localhost:4200/implicit/callback error 404

[TermenVox]

Hi all! I created my Angular app using Okta Sign-In Widget. Everything works fine in development mode, when I use ng serve command.
Then I created a build using ng build command and ran it locally using simple Express NodeJS server. Application works fine but when I try to login, after I enter login and password and push login button - I get an error like
GET http://localhost:4200/implicit/callback?code=SxQzTxWeFZqmKmd3ENgE&state=jnQivLfhxBZ9253DgPbqYSrn4Bi2KRMyXeHeBfsiNc93s2eBX3qg1sTHsEsWENo9 404 (Not Found).
All okta config is hardcoded in ts file in src folder. I do not use any external files (like testenv).
Origin URL is the same in development mode and on my server (http://localhost:4200/)
What can be wrong?

[mraible]

You have to configure your web server so it’s SPA-aware. That is, all routes should go to index.html. There’s lots of tutorials on how to do this, just google for “$webserver spa”. For example express.js spa.

[TermenVox]

Thank you very much! This is the key moment: app.get('/',... should be changed to app.get('*',

// handle every other route with index.html, which will contain
// a script tag to your application's JavaScript file(s).
app.get('*', function (request, response) {
    response.sendFile(path.resolve(__dirname, 'index.html'));
});

[TermenVox]

Login worked fine from localhost. But I get ERR_CONNECTION_TIMED_OUT when I deployed my app on a real Internet server.
In Network requests I see warning “Provisional headers are shown”.
I deployed my app here https://your-favorite-places.ew.r.appspot.com
Here are my app settings

Here my CORS settings

In oidc I changed redirectUri from ‘http://localhost:4200/implicit/callback’ to ‘https://your-favorite-places.ew.r.appspot.com:8081/implicit/callback’.
Here is a test account for your help:
login: stipe_miocic@test.com
pass: 123456789Nn
Could anybody help me?

[vijet]

Hi @TermenVox,

Why is your redirect_uri https://your-favorite-places.ew.r.appspot.com:8081/implicit/callback? i.e. why is the port 8081 in the redirect URI? Shouldn’t it be https://your-favorite-places.ew.r.appspot.com/implicit/callback?

Looking at the network requests made by your app, the /authorize call is successfully redirecting back with the authorization code (which will then be exchanged for an access token)
But the page https://your-favorite-places.ew.r.appspot.com:8081/implicit/callback is timing out which could mean that this route is not valid in your deployed application.

Change your redirect uri to https://your-favorite-places.ew.r.appspot.com/implicit/callback and it should work, most likely.
You should do this both in your app code, and okta app configuration.

[TermenVox]

Thank you very much! It works!