Wasp-lang•2mo ago

Routing issues with signup/login

I'm using the provided boilerplate for signup/login, which use the <SignupForm> and <LoginForm> which appear to be provided by wasp. When user clicks the Login or Signup buttons, there is an error either /api/auth/username/login or /api/auth/username/signup are 404. It is not clear what is happening, do we need to supply code for these routes?

6 Replies

kapa.ai•2mo ago

Hi @Conspyre. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- In Wasp, the routes for login and signup are automatically generated when you use the auth feature. You don't need to manually create these routes. However, you do need to define the pages where these forms will be displayed. Here is an example of how you can define these pages in your main.wasp file:

route SignupRoute { path: "/signup", to: SignupPage }  
page SignupPage {  
 component: import { SignupPage } from "@src/SignupPage"  
}  
  
route LoginRoute { path: "/login", to: LoginPage }  
page LoginPage {  
 component: import { LoginPage } from "@src/LoginPage"  
}

route SignupRoute { path: "/signup", to: SignupPage }  
page SignupPage {  
 component: import { SignupPage } from "@src/SignupPage"  
}  
  
route LoginRoute { path: "/login", to: LoginPage }  
page LoginPage {  
 component: import { LoginPage } from "@src/LoginPage"  
}

(Source: Wasp Docs (https://wasp-lang.dev/docs/tutorial/auth#adding-login-and-signup-pages)) And here is an example of how you can use the LoginForm and SignupForm components in your React pages:

import { LoginForm } from 'wasp/client/auth'  
import { Link } from 'react-router-dom'  
  
export const LoginPage = () => {  
 return (  
 <div style={{ maxWidth: '400px', margin: '0 auto' }}>  
 <LoginForm />  
 <br />  
 <span>  
 I don't have an account yet (<Link to="/signup">go to signup</Link>).  
 </span>  
 </div>  
 )  
}

import { LoginForm } from 'wasp/client/auth'  
import { Link } from 'react-router-dom'  
  
export const LoginPage = () => {  
 return (  
 <div style={{ maxWidth: '400px', margin: '0 auto' }}>  
 <LoginForm />  
 <br />  
 <span>  
 I don't have an account yet (<Link to="/signup">go to signup</Link>).  
 </span>  
 </div>  
 )  
}

(Source: Wasp Docs (https://wasp-lang.dev/docs/tutorial/auth#adding-login-and-signup-pages)) If you're still encountering 404 errors, it might be due to a configuration issue or a problem with your development environment. Make sure that your Wasp project is correctly set up and that you're running the development server on the correct port. If the problem persists, consider reaching out to the Wasp community for further assistance. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Conspyre, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?

IamIconLiving•2mo ago

You used template and you get 404 out of the box, without changing anything? Can you say which template you used exactly? For the 404 itself, you can check this article here to see how to fix it https://wasp-lang.dev/docs/tutorial/auth

7. Adding Authentication | Wasp

Most modern apps need a way to create and authenticate users. Wasp makes this as easy as possible with its first-class auth support.

Conspyre•2mo ago

I was definitely not using the SaaS template as intended, switching to that solved the problem.

martinsos•2mo ago

Ok great @Conspyre ! What did you use then instead though, and how did that happen? I am wondering if we can somehow misled you

Conspyre•2mo ago

Hi @martinsos this was definitely user error and perhaps adding a note like "RTFM BEFORE MAKING NEW PROJECT" could have slowed me down? Doubtful! IMO issue is LLM coding encourages going faster than practical.

martinsos•2mo ago

Haha, ok no worries :). I still like to ask, because I would hate to miss opportunity to improve something on our side if we can. Sometimes people miss stuff in docs because docs are not well written / clear enough.

Gaming

Programming

Routing issues with signup/login