Matt Raible
Can you try it with a Node LTS version? For example, v8.11.3.
Jone Quest
Hey Matt, thanks for you help! I actually installed them separated and it worked! As for the Otka/JWT login authentication, I think that in a real business they don’t want/allow that type of authentication. Do you know any other auth method? Thanks again.
Matt Raible
I’m not sure what your requirements are. We have lots of real businesses using Okta for authentication. It’s probably best to continue this discussion on our Developer Forums. Can you please post your questions there?
Jone Quest
Hi Matt, I mean, user’s need to have an Okta account to be able to login in the app? Normally, companies will not agree with that! Instead, they will prefer a SSO (single sign on).
Matt Raible
Hi Jone: the good news is Okta is a popular SSO provider used by thousands of organizations around the world! You can read more at https://www.okta.com/produc…. If you’re using our API Products, you can add social login too.
If that’s not enough, I wrote a post recently that shows you how to enable self-registration.
Jone Quest
Thanks a lot Matt. I’ll look at the links you shared with me.
Allyn Becar
Good info in this tutorial.
However I get the following error form any REST request. (I walked through the tutorial, then downloaded the code and in both cases get the same error.)
Failed to load http://localhost:8081/posts: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8080’ is therefore not allowed access. The response had HTTP status code 404.
Matt Raible
Hello Allyn,
The following line should allow anyone to call the server, from any origin:
app.use(cors())
Are you sure your server is running on 8081 and it’s not a different process?
Allyn Becar
Thanks for your help. Sorry it was my newbie error. 8081 was in use by a different process. Works like a champ now.
Derek
Excellent tutorial, thank you very much for this! I do have one question that I can’t seem to figure out… How does the Vue app handle an error received by the API. For example, if the API fails and returns the ‘Authorization header is required’ message, how does the error get to the ‘PostsManager.vue’ application so that it can present the error to the user? Another example would be the API returning a ‘Field X is required.’ message so that the Vue app can highlight the field as being required. Thanks again!
Andreas Christian
using catch in Axios promise.
Matt Raible
Andreas is correct! To handle errors, you should add try/catch around all the API calls and handle the error events accordingly. Or use .catch() if you are using promises.
Manny
Great stuff! Thanks, up and running with Vue and Okta in no time. Thanks for sharing!
Charles Pratt
Great tutorial, but my app isn’t saving the posts or any subsequent tasks. It just shows “Loading…” alert…
Matt Raible
Do you see any errors in your developer console? If you clone this example’s GitHub repo and change it to use your Okta account, does it work?
Charles Pratt
I got it sorted out. I had put my clentID in, but put the OktaDomain in wrong. Again, great tutorial and thanks for following up!
Italo Cesar Fernandes
Simple and awesome. Thank you guy.
Kyle Hatch
Any plans on a tutorial on publishing something like this? I’ve been trying to publish an app on heroku but can’t seem to get it to work.
Matt Raible
We did publish a tutorial on how to Deploy Your Secure Vue.js App to AWS. I’ve also shown how to deploy to Heroku in several of my Angular/React + Spring Boot posts on this site. What issues are you having with Heroku?
Kyle Hatch
I attempted to go through the AWS s3 route instead of Heroku, it’s working on the localhost and my network. But on the endpoint i’m getting: Code: NoSuchKey, Message: The specified key does not exist. And then in the aws-cli, i get The user-provided path ./dist does not exist when trying to sync the files.