The Lazy Developer's Guide to Authentication with Vue.js

Matt Raible

Cool - I’m glad you figured it out. I used a similar technique when I was trying to get our Vue SDK to work with TypeScript.

BTW, you can wrap your code with <pre><code> tags and the formatting will be better. I’ll see if I can turn on Markdown support.

Paul Simon

Hi Matt, I did wrap my code in and but it didn’t seem to make any difference to the formatting. It still lost all the indentation. I did try editing the post and putting in

 but it did not seem to recognise that. Maybe the markdown just isn’t working. Regards Paul

Matt Raible

Yeah, I was unable to add Markdown support. I found this from three years ago, but not much else. I found this useful: What HTML tags are allowed within comments?

Deepak Nathani

Hi Matt, Thanks for writing such a great article. I am using Vue.js with Typescript and trying to implement the authentication using okta auth sdk. I have been facing this particular issue with this: When I create a new instance of OktaAuth and provide it with correct parameters, my app just stops rendering everything. Could someone please help me with this?

Matt Raible

If you want to use TypeScript with Vue, I wrote a tutorial for that! See Bootiful Development with Spring Boot and Vue.

You could also use OktaDev Schematics to create a Vue app and install Okta quickly. See its Vue instructions. It’ll detect if you’re using TypeScript and make adjustments accordingly.

Deepak Nathani

Thanks for the reply. But as far as I understand, both of these approaches redirects the user to okta login page. For my use case, I want to have a custom login page. I know this can be achieved by using okta sign in widget, but I just wanted to understand why the approach explained in this blog doesn’t work with my app.

Matt Raible

This post was written in 2017, before we had a Vue SDK. To be perfectly honest, I was just trying to make Vue work with Okta at the time.

If you’d like to use the Sign-In Widget with Vue, I’d suggest looking at our Vue Custom Login sample.