Node.js login page kısmında boş bir sayfaya yönlendiriyor

scorpionsx · 26 Haziran 2024

Node.js ile login page yazdım ama login butonuna tıklarken "loading" işaretini göstermek yerine giriş yapıyor ve boş bir sayfaya yönlendiriyor beni. Konsolda bu hataları veriyor. Yardımcı olur musunuz?

brkyozell · 26 Haziran 2024

Hocam HTML sayfasının, Node.js sunucusundaki ilgili kısmın kodu olmadan nasıl yardım edebiliriz?

scorpionsx · 26 Haziran 2024

brkyozell dedi:
Hocam HTML sayfasının, Node.js sunucusundaki ilgili kısmın kodu olmadan nasıl yardım edebiliriz?

Kodu eklediğimi düşündüm ekliyorum şimdi.

JavaScript:

import { useRef } from "react";
import "./login.css";
import { loginCall } from "../../apiCalls";
import { useContext } from "react";
import { AuthContext } from "../../context/AuthContext";
import CircularProgress from "@mui/material/CircularProgress";

export default function Login() {
  const email = useRef();
  const password = useRef();
  const { user, isFetching, error, dispatch } = useContext(AuthContext);

  const handleClick = (e) => {
    e.preventDefault();
    loginCall(
      { email: email.current.value, password: password.current.value },
      dispatch
    );
  };
  console.log(user);
  return (
    <div>
      <div className="login">
        <div className="loginWrapper">
          <div className="loginLeft">
            <h3 className="loginLogo">SocialApp</h3>
            <span className="loginDesc">
              Connect with friends and the world around you on SocialApp.
            </span>
          </div>
          <div className="loginRight">
            <form className="loginBox" onSubmit={handleClick}>
              <input
                placeholder="Email"
                type="email"
                className="loginInput"
                ref={email}
                required
              />
              <input
                placeholder="Password"
                type="password"
                className="loginInput"
                minLength="6"
                ref={password}
                required
              />
              <button className="inputButton" type="submit">
                {isFetching ? (
                  <CircularProgress color="white" size="20px" />
                ) : (
                  "Log In"
                )}
              </button>
              <span className="loginForgot">Forgot Password?</span>

              <button className="registerButton">
                {isFetching ? (
                  <CircularProgress color="white" size="20px" />
                ) : (
                  "Create New Account"
                )}
              </button>
            </form>
          </div>
        </div>
      </div>
    </div>
  );
}

JavaScript:

import Login from "./pages/login/Login";
import Register from "./pages/register/Register";
import Profile from "./pages/profile/Profile";
import Home from "./pages/home/Home";
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
function App() {
  return (
    <Router>
      <Switch>
        <Route exact path="/">
          <Home />
        </Route>
        <Route path="/login">
          <Login />
        </Route>
        <Route path="/register">
          <Register />
        </Route>
        <Route path="/profile/:username">
          <Profile />
        </Route>
      </Switch>
    </Router>
  );
}

export default App;

JavaScript:

const express = require("express");
const mongoose = require("mongoose");
const dotenv = require("dotenv");
const helmet = require("helmet");
const morgan = require("morgan");
const userRoute = require("./routes/users");
const authRoute = require("./routes/auth");
const postRoute = require("./routes/posts");
const app = express();

dotenv.config();

mongoose.set("strictQuery", false);
mongoose
  .connect(process.env.MONGO_URL, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
  })
  .then(() => console.log("Connected to MongoDB"))
  .catch((err) => console.log(err));

//middleware
app.use(express.json());
app.use(helmet());
app.use(morgan("common"));

app.use("/api/users", userRoute);
app.use("/api/auth", authRoute);
app.use("/api/posts", postRoute);

app.listen(8800, () => {
  console.log("Backend server is running!");
});

Node.js login page kısmında boş bir sayfaya yönlendiriyor

Ayrıntılı düzenleme

scorpionsx

Hectopat

brkyozell

Kilopat

scorpionsx

Hectopat

Benzer konular

Technopat Haberler

Yeni konular

Yeni mesajlar

Gizliliğinize önem veriyoruz