My Vue app is built using vue-cli and is authorized through Okta. I have deployed it to Heroku as a production setup, but I am starting to question if Okta supports production on the freemium level?
I have been going through the documentation, but I feel like I might be missing something...
Here's how the app is set up:
In the src
directory, there are common files like router/index.js
where the Okta library is connected:
Vue.use(Auth, {
issuer: 'dev_url',
client_id: 'some_string',
redirect_uri: window.location.origin + '/implicit/callback',
scope: 'openid profile email'
})
Also, in the routes array:
{
path: '/implicit/callback',
component: Auth.handleCallback()
},
There is a server.js
file in src/
which handles jwt verification and serves the build folder:
app.use(express.static(path.join(__dirname, "../dist")))
...
const oktaJwtVerifier = new OktaJwtVerifier({
clientId: '<some_id>',
issuer: '<some_url>'
})
...
app.get('/', authRequired(), (req, res, next) => {
return res.sendFile(path.join(__dirname, '../dist/index.html'))
})
Everything works perfectly on localhost with webpack-dev-server. However, after deploying to Heroku, I encounter a 404 error on the implicit/callback
route...
Below are the scripts used:
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
"test": "npm run unit",
"lint": "eslint --ext .js,.vue src test/unit",
"build": "node build/build.js",
"server": "node ./src/server",
"start": "node ./src/server",
"heroku-prebuild": "npm install && npm run build"
},
During the login process post-build, an odd call is made from the browser:
https://<base_url>.herokuapp.com/implicit/callback#id_token=<huge_hashed_string>&token_type=Bearer&expires_in=3600&scope=openid+email+profile&state=<huge_hashed_string>
Despite this, we encounter a 404 error and authentication does not proceed.
If you clone the app and run npm install
, you can use npm run dev
followed by npm start
.
Attempts so far:
I have tried adjusting routes extensively, but I am running out of ideas. Since it works locally, I suspect there may be an issue with setting up the Okta app or a limitation mentioned in the documentation that prevents me from running things smoothly.
I've added the production URL to the Login redirect URIs in the dashboard configuration, and included base URLs. Any insights on this issue would be greatly appreciated.