Next.js Discord

Discord Forum

Access database using mysql2 with data from a form

Answered
Pavement ant posted this in #help-forum
Open in Discord
Pavement antOP
Hi, im trying to login by using a form where on submit it sends a request to the database, checks the credentials and then redirects to a page that is protected by that login. The main issue im having is that to get the contents of the form it has to be client side but when i set "use client" and try to call the function it complains about "net" not being found even if it is in a different file. So how would i do this? (I can send the code if need be but i dont think its relevant as its pretty much just html)
Answered by averydelusionalperson
either deploy next.js as as server
View full answer

29 Replies

Pavement antOP
"use client";
import styles from "./page.module.css";

export default function AdminPage() {
  return (
    <>
      <div className={styles.loginform}>
        <h1>
          You&apos;re probably not meant to be here but if you are please log in
        </h1>
        <form className={styles.form} action="/api/admin">
          <input type="text" placeholder="Username" name="uname" required />
          <input type="password" placeholder="Password" name="upass" required />
          <input type="submit" value="Submit" className={styles.button} />
        </form>
      </div>
    </>
  );
}
I've changed my approach to use api routes now (is that right)?
what were you doing before?
and yes, you can use whatever you want
Pavement antOP
import mysql from "mysql2";
import { NextResponse } from "next/server";

const connection = mysql.createConnection({
  host: "localhost",
  user: "root",
  database: "--",
});

export async function GET(request: Request) {
  console.log(request.url);
  return NextResponse.json({ message: "Hello World" }, { status: 200 });
}

export function CheckLogin(uname: string, upass: string) {
  connection.query(
    "SELECT * FROM `logins` WHERE username = " +
      uname +
      " AND password = " +
      upass +
      ";",
  );
}
and this is my api file
before i was just calling CheckLogin before but it would complain
@averydelusionalperson what were you doing before?
Pavement antOP
so
onSubmit={() => {
CheckLogin(params...)
}}
are you using next 13 or 12?
Pavement antOP
14.1
with the app router
then you can use server actions
Pavement antOP
will that work if i export it as a static site?
no, cause it's server?
if you want to create static sites
use vite or something
Pavement antOP
Is there any way to pull data from a db that will work on when I export as static?
create external api with node.js or smthing
cause static export is meant to be html, css, js export
not server
Pavement antOP
Can I do it without node js, cuz I don’t want to have more things running
you can't
cause you need backend
for interacting with db
either deploy next.js as as server
Answer
or deploy next.js as static , and any other backend as server
Pavement antOP
Okay thanks, I’ll look into that
sure, if your problem is solved, please close the thread.
Original message was deleted
^
Pavement antOP
yup sorry had to go for a sec