Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

authentication stopgap integration w/ nuxt + client + server #806

Closed
alee opened this issue Sep 14, 2022 · 1 comment
Closed

authentication stopgap integration w/ nuxt + client + server #806

alee opened this issue Sep 14, 2022 · 1 comment
Labels
blocker enhancement New feature or request

Comments

@alee
Copy link
Member

alee commented Sep 14, 2022

Eventually the nuxt app may subsume and contain all of what used to be server and client but this is a long-range task that will require extensive refactoring of all the components etc., to use tailwindcss and nuxt abstractions and simplifications

So as a stopgap measure one direction we're exploring uses JWT tokens based on this SO question:

https://stackoverflow.com/questions/73398610/nuxt-3-jwt-authentication-using-fetch-and-pinia

and in particular this question: https://stackoverflow.com/a/73406144/93370

  1. create an api login post endpoint in nuxt (/server/api/login.post.ts) that creates a fresh JWT based on an email address, e.g.,
import jwt from 'jsonwebtoken';

export default defineEventHandler(async (event) => {
  const body = await useBody(event);
  const token: string = await jwt.sign({ email: body.email }, email_hash);
  return token;
});
  1. set the JWT into an httponly cookie

https://stackoverflow.com/questions/39810741/how-to-store-a-jwt-token-inside-an-http-only-cookie

  1. add a nuxt middleware (server/middleware/setAuth.ts) that makes accessing the authenticated user in all other api endpoints easier:
import jwt from 'jsonwebtoken';

    export default defineEventHandler(async (event) => {
      if (event.req.headers.authentication) {
        event.context.auth = { email: await jwt.verify(event.req.headers.authentication, email_hash).email };
      }
    });
  1. all requests that require authentication need to include the JWT in the headers under an authentication key
$fetch('/api/dashboard', {
            method: 'post',
            headers: {
              authentication: myJsonWebToken,
            },
          });
  1. in all nuxt server endpoints that need an auth user get it via event.context.auth.email or whatever we set it to in the server/middleware

  2. legacy server side also needs these same checks, this is probably gonna be ugly copy/paste duplication for simplicity at the moment

@alee alee added the enhancement New feature or request label Sep 14, 2022
chrstngyn pushed a commit to chrstngyn/port-of-mars that referenced this issue Sep 15, 2022
create JWT based on email address
deprecate api/ in favor of using server/api/
add jsonwebtoken package to generate JWTs

refs virtualcommons#806

Co-authored-by: Allen Lee <[email protected]>
Co-authored-by: sgfost <[email protected]>
chrstngyn pushed a commit to chrstngyn/port-of-mars that referenced this issue Sep 15, 2022
refs virtualcommons#806

Co-authored-by: Allen Lee <[email protected]>
Co-authored-by: sgfost <[email protected]>
@alee alee added the blocker label Sep 19, 2022
@alee
Copy link
Member Author

alee commented Oct 28, 2023

closing for now until we decide on #795

@alee alee closed this as completed Oct 28, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
blocker enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant