Vue.js with Okta Auth. 404 on login redirect in Heroku

So I’ve got what appears to be the same problem as described here: https://stackoverflow.com/questions/51717511/vue-js-express-server-okta-deploy-to-heroku-404-on-implicit-callback

When running my Vue.js App locally I can sign in and the callback is working fine. However, when deployed to Heroku I get a 404 on the redirect.

My setup looks as follows (with client ID filled in):

  Vue.use(Auth, {
    issuer: 'https://dev-130356.okta.com/oauth2/default',
    client_id: 'client_id_here',
    redirect_uri: window.location.origin + '/implicit/callback',
    scope: 'openid profile email'
  })

And the configuration in Okta:

Is there anything obvious I’m missing here?

Thanks!

Hi @LawMaestro

When deploying the Vue application, the server tries to resolve physically /implicit/callback path and, because it doesn’t exist, it gives 404. In order to resolve this, please define a routing as mentioned here to point the virtual path to index.html.

Hi @dragos

Thanks for the help on this! I also found this: https://medium.com/binarcode/deploying-vue-apps-to-heroku-the-right-way-26b11c1ae5cd super useful for a quick summary of essentially what you were saying.

It’s now working as expected :tada:

1 Like