Odd login problem

Questions
1

I’m trying to set-up Okta in a new Nuxt js application.

I’ve got it most of the way there, but on redirect to http://localhost:8081/implicit/callback it goes there and then immediately redirects to http://localhost:8081/implicit/[object%20MouseEvent] (even if I never touch a mouse device during the process).

As weird as that is, in the process of trying to debug that, I switch the assignment that brings in the okta-vue auth package from:

import Auth from '@okta/okta-vue';

to

import Auth from './node_modules/@okta/okta-vue/src/Auth.js';

and it works as expected with the latter import!

Does anybody have any idea what’s going on, and more importantly, how to fix it so that the “correct” import actually works as expected?

2

I’m still troubleshooting this, but apparently left out an important bit, and have narrowed down the problem a hair bit more, but am still having problems and could use a bit more help if someone has available eyeballs.

I had added some console.log messages to my copy of node_modules/@okta/okta-vue/src/components/implicitCallback.vue, namely between lines 5-6 I added:

console.log('this.$auth.getFromUri():', this.$auth.getFromUri())

Which led to the path value on line 7 having an valid value.

I’ve now gone through every combination of await around those lines that I can think, the only way I can get the bloody thing to work is to add a call to this.$auth.getFromUri() before this.$router.replace in addition to the call already there, like so:

<script>
export default {
  name: 'ImplicitCallback',
  async beforeMount () {
    await this.$auth.handleAuthentication()
    // // DOES NO GOOD to assign to a varible and try to use that subsequently
    // // `await` also doesn't seem to have any impact (assuming not promisified :-( )
    // const path = await this.$auth.getFromUri() 
    // console.log('path:', path)

    // THIS IN CONJUNCTION WITH THE SAME CALL INSIDE
    // this.$router.replace
    // IS THE ONLY THING THAT SEEMS TO MAKE IT WORK
    this.$auth.getFromUri()                        // FIRST CALL
    
    this.$router.replace({
      path: this.$auth.getFromUri()                // SECOND CALL
    })
  },
  render () {}
}
</script>

Needless to say, this feels wrong to me on so many levels!

- Does anybody have any insight that might help me get this working in an appropriate manner?

- Is it genuinely a bug in this code, or is it symptomatic of a problem in how I’m consuming this?

3

Here’s a repo demonstrating the problem:

4

I’ve filed an actual bug report over at https://github.com/okta/okta-oidc-js/issues/439

5

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.