v4, cannot get oauth2 method to pass code to backend, pretty sure docs are wrong

[vesper8]

I just upgraded from v2 to v4. Now using the latest 4.1.4

I'm using this driver as per your v4 guide: import driverOAuth2Facebook from '@websanova/vue-auth/dist/drivers/oauth2/facebook.esm.js';

Normal JWT auth works. Can't get Facebook auth to work (I can now, see workaround at the end)

Can't for the life of me get the oauth2 method to pass the code to the backend.

I followed the guide here https://websanova.com/docs/vue-auth/methods/core#oauth2

And looked at the demo here: https://github.com/websanova/vue-auth/blob/master/demos/2.x/src/pages/auth/Social.vue

In both cases you recommend using body to pass the code returned in Step 1

I have already confirmed that I am getting a code back.

I have tried

      this.$auth.oauth2(type, {
        url: `/api/v1/auth/${type}/web-login`,
        code: true,
        redirect: false,
        state: this.$route.query.code,
        body: {
          token: this.$route.query.code,
        },
      })

As per your docs https://websanova.com/docs/vue-auth/methods/core#oauth2

Weird how here it uses token instead of code inside the body

I also tried

        body: {
          code: this.$route.query.code,
        },

and I also tried using a params instead as this is shown in a few code snippets in the issues and on StackOverflow.. same problem, no code is passed.

        params: {
          code: this.$route.query.code,
        },

Looking at the network inspector, and debugging the request on the backend, nothing is passed. Also I think the docs are just plain wrong above because you're setting the code to both the state and the body.

Finally I have it working by adding the code directly in the url:

      this.$auth.oauth2(type, {
        url: `/api/v1/auth/${type}/web-login?code=${this.$route.query.code}`,
        code: true,
        redirect: false,
      })

What is the actual issue here? Wrong docs? Wrong driver? Something mysterious on my end?

Many thanks

[websanova]

Well what parameter does your api accept?

At that point vue-auth has no idea, it could be code, token, moo, foo or whatever.

Regardless do you actually see something being passed in the request at all?

Also, it seems you are using body for the request, which may depend on the http driver you are using. Since those params just map directly to the plugin, if you are using vue-resource that may be body and for axios it would be data.

[vesper8]

As I mentioned above Looking at the network inspector, and debugging the request on the backend, nothing is passed.

No parameters are sent, none are received.

But I was just pointing that the instructions as they are, do not seem to work. If the instructions only work for vue-resource and not for axios then it would be useful if that were mentioned in the documentation next to the various code snippets

I am using axios, so I will try data instead of body and report back shortly

[GMolini]

I was having this problem, I tried setting data instead of body and it does indeed work