Sample project? tutorial?

[RonAlmog]

Does anybody have a full working sample project that uses @nuxtjs/auth-next, with both local and social (fb, google), that shows how to integrate with backend? how to consolidate users from various sources to one place on both backend and frontend?
I need all users to be on the same database. the documentation does not even mention this. any clue, example, tutorial? thanks.

[JoaquimLey]

Hello @RonAlmog,
First of all a little disclaimer, I'm not part of any of the core teams (nuxt or this module). I'll only be speaking from exp. and I could be wrong and/or not using the best approach.

Does anybody have a full working sample project that uses @nuxtjs/auth-next, with both local and social (fb, google), that shows how to integrate with backend? how to consolidate users from various sources to one place on both backend and frontend?

The configuration for the social login can be found in the docs, but here's mine:

// nuxt.config.js

export default {
  (...)
  auth: {
    (...)
    google: {
        watchLoggedIn: true,
        scheme: 'oauth2',
        endpoints: {
          authorization: `${process.env.APP_URL_API}/v1/auth/google`,
          userInfo: `${process.env.APP_URL_API}/v1/auth/me`,
        },
        token: {
          property: 'access_token',
          type: 'Bearer',
          maxAge: 1800
        },
      },
    }
  (...)
}

In this case, I'm calling my own backend who has the client_id and other variables and return the redirect endpoint, no need to do it this way. Your frontend app could also do it directly, here's a full config example from the docs.

---

I need all users to be on the same database. the documentation does not even mention this. any clue, example, tutorial? thanks.

As for handling multiple sign-ins from the same user, depends on your implementation. But I redirect to my backend so I get the OAuth provider's callback and the one thing they all have in common is the email.

So when you get the data from FB/Google/etc. you could search your users table for that same email.

Then it's a matter of how you handle that data. Do you want to add "social providers" relation to that users entity or simply assign the token and log in the user.

---

A quick google search yield a lot of results, here's one:

• https://codesandbox.io/examples/package/@nuxtjs/auth

Good luck :)

[RonAlmog]

@JoaquimLey , thank you so much for your detailed answer, much appreciated!
btw, i found a similar approach to yours here:
#1139
he is also sending the authentication to be done on backend, but he is also using a plugin, that I don't fully understand.
looks like it is used as a meeting point for all the different strategies, and to set the token with the one coming back from backend. Do you do something similar, or you have a different approach?

[JoaquimLey]

I have an endpoint for each strategy with the client ids etc. but not for apple. Apple I have the frontend doing it but I'm thinking of migrating all my strategies to the frontend to simplify things as we can store secrets on nuxt with privateRuntimeConfig.