How do I allow even unauthenticated users to not be forced into signing up?

[solomonshalom]

Hello! Teams,

Hope you're doing great!

Small Q: how do I make it so that even unauthenticated users, can see the chat interface, w/o needing to log-in first?

I tried this:

import { NextAuthConfig } from "next-auth";

export const authConfig = {
  pages: {
    signIn: "/login",
    newUser: "/",
  },
  providers: [
    // added later in auth.ts since it requires bcrypt which is only compatible with Node.js
    // while this file is also used in non-Node.js environments
  ],
  callbacks: {
    authorized({ auth, request: { nextUrl } }) {
      let isLoggedIn = !!auth?.user;
      let isOnChat = nextUrl.pathname.startsWith("/");
      let isOnRegister = nextUrl.pathname.startsWith("/register");
      let isOnLogin = nextUrl.pathname.startsWith("/login");

      if (isLoggedIn && (isOnLogin || isOnRegister)) {
        return Response.redirect(new URL("/", nextUrl));
      }

      if (isOnRegister || isOnLogin) {
        return true; // Always allow access to register and login pages
      }

      if (isOnChat) {
        return true;
      }

      if (isLoggedIn) {
        return Response.redirect(new URL("/", nextUrl));
      }

      return true;
    },
  },
} satisfies NextAuthConfig;

Didn't quite work :(

Please do LMK how to proceed!

CC: @jeremyphilemon

[jeremyphilemon]

Hey @solomonshalom, thanks for reaching out!

If you want to allow unauthenticated users to use the chatbot, you will have to comment out some of the checks in auth.config.ts like below:

import { NextAuthConfig } from "next-auth";

export const authConfig = {
  pages: {
    signIn: "/login",
    newUser: "/",
  },
  providers: [
    // added later in auth.ts since it requires bcrypt which is only compatible with Node.js
    // while this file is also used in non-Node.js environments
  ],
  callbacks: {
    authorized({ auth, request: { nextUrl } }) {
      let isLoggedIn = !!auth?.user;
      // let isOnChat = nextUrl.pathname.startsWith("/");
      let isOnRegister = nextUrl.pathname.startsWith("/register");
      let isOnLogin = nextUrl.pathname.startsWith("/login");

      if (isLoggedIn && (isOnLogin || isOnRegister)) {
        return Response.redirect(new URL("/", nextUrl));
      }

      if (isOnRegister || isOnLogin) {
        return true; // Always allow access to register and login pages
      }

      // if (isOnChat) {
      //   if (isLoggedIn) return true;
      //   return false; // Redirect unauthenticated users to login page
      // }

      // if (isLoggedIn) {
      //   return Response.redirect(new URL("/", nextUrl));
      // }

      return true;
    },
  },
} satisfies NextAuthConfig;

Furthermore, I would make sure you ease the authentication checks in the route handlers based on your needs.

[solomonshalom]

Hello! @jeremyphilemon

I gave it a shot but for some reason, when I check it now - although the signup screen doesn't show up, the chat is glitching. What I mean by glitching is that if I type in a response, it's not going through :(

What do you think I should be doingg?

[0wh]

I gave it a shot but for some reason, when I check it now - although the signup screen doesn't show up, the chat is glitching. What I mean by glitching is that if I type in a response, it's not going through :(

Same here

[solomonshalom]

I gave it a shot but for some reason, when I check it now - although the signup screen doesn't show up, the chat is glitching. What I mean by glitching is that if I type in a response, it's not going through :(

Same here

:( I hope we can get a quick fix!

[sent1ne]

Hello! @jeremyphilemon

I gave it a shot but for some reason, when I check it now - although the signup screen doesn't show up, the chat is glitching. What I mean by glitching is that if I type in a response, it's not going through :(

What do you think I should be doingg?

Same here

[solomonshalom]

Hello! @jeremyphilemon I gave it a shot but for some reason, when I check it now - although the signup screen doesn't show up, the chat is glitching. What I mean by glitching is that if I type in a response, it's not going through :( What do you think I should be doingg?

Same here

:(

[solomonshalom]

Hey @solomonshalom, thanks for reaching out!

If you want to allow unauthenticated users to use the chatbot, you will have to comment out some of the checks in auth.config.ts like below:

import { NextAuthConfig } from "next-auth";

export const authConfig = {
  pages: {
    signIn: "/login",
    newUser: "/",
  },
  providers: [
    // added later in auth.ts since it requires bcrypt which is only compatible with Node.js
    // while this file is also used in non-Node.js environments
  ],
  callbacks: {
    authorized({ auth, request: { nextUrl } }) {
      let isLoggedIn = !!auth?.user;
      // let isOnChat = nextUrl.pathname.startsWith("/");
      let isOnRegister = nextUrl.pathname.startsWith("/register");
      let isOnLogin = nextUrl.pathname.startsWith("/login");

      if (isLoggedIn && (isOnLogin || isOnRegister)) {
        return Response.redirect(new URL("/", nextUrl));
      }

      if (isOnRegister || isOnLogin) {
        return true; // Always allow access to register and login pages
      }

      // if (isOnChat) {
      //   if (isLoggedIn) return true;
      //   return false; // Redirect unauthenticated users to login page
      // }

      // if (isLoggedIn) {
      //   return Response.redirect(new URL("/", nextUrl));
      // }

      return true;
    },
  },
} satisfies NextAuthConfig;

Furthermore, I would make sure you ease the authentication checks in the route handlers based on your needs.

Any update 👀

[clemtttt]

Hi, Im interested to know the answer too

[jtfitzge1]

Just worked through a bunch of this for a project so I figured I'd share what I did. The "glitching" you're all seeing is likely due to the auth checks in the route.ts files @jeremyphilemon mentioned, if you look in the console output there's probably a 401 error for all of the chat/document/vote/suggestion api calls.

if (!session || !session.user || !session.user.id) {
  return new Response('Unauthorized', { status: 401 });
}

After following the approach outlined above, you'll want to adjust those blocks (or comment them out) in each of the route.ts files in the chat portion of the project. Odds if you're using this out of the box and have this pointed at a database, once you're past that you'll run into a couple other issues. Calls to the DB to save messages or anything like that require a user id, and that user id needs to exist in the User table. You could take all of that out and it's basically a new blank chat every time, or you can ease the FK constraints on the tables and generate temporary user IDs to associate the chats with in the db, and store that ID as a cookie or something on the client side so when a user returns you can still retrieve their chats. Hope this is helpful to someone!

[yashmahe2020]

Hello, I'd like to know if anyone has been able to allow unauthenticated users to use the chatbot successfully. I have been working on it; however, I am still running into errors regarding the database.

[yashmahe2020]

Hello,

Do you have a GitHub repo allowing unauthenticated users to use the chatbot? I am facing difficulties getting that to work because of the database implications.

Best Regards, Yash Maheshwari