v2.5.2
Giriş yap

next.js ve express.js deploy sorunu

Anonim
132 defa görüntülendi

merhaba arkadaşlar next.js ve express.js ile bir proje geliştirmeyi dusunuyorum auth kısmını yaptım localhosta duzgun calışıyor ama bunu deploy ettiğimde giriş yaparken istek atıyor cookieyi kaydediyor ama yönlendirme yapmıyor ve sayfayı yenilediğimde cookiie siliniyor yardımcı olur musunuz baya araştırma yaptım bulamadım linki de verim isterseniz deneyin https://socializee-app.vercel.app/

Cevap yaz
Cevaplar (9)
rustemxyzdn
75 gün önce

@ebykdrms knki şunu çözersek super olur

rustemxyzdn
75 gün önce

backend .env

CLIENT_HOST="https://socializee-app.vercel.app"
rustemxyzdn
75 gün önce

middleware

import { NextResponse } from "next/server";

export const middleware = async (req) => {
    const { nextUrl, cookies } = req;
    const token = cookies.get("token");
    const pathname = nextUrl.pathname;
    const paths = ["/auth/login", "/auth/register"];

    if (!paths.includes(pathname) && !token?.value) {
        return NextResponse.redirect(new URL("/auth/login", req.url));
    }

    if (paths.includes(pathname) && token?.value) {
        return NextResponse.redirect(new URL("/dashboard", req.url));
    }

    return NextResponse.next();
};

export const config = {
    matcher: [
        "/",
        "/dashboard",
        "/dashboard/:path*",
        "/auth/register",
        "/auth/login",
    ],
};


rustemxyzdn
75 gün önce

login sayfası

 const handleSubmit = async (e) => {
        e.preventDefault();

        try {
            setLoading(true);
            const res = await FetchLogin(data);
            if (res.status === 200) {
                toast.success(res.data.message);
                router.push("/dashboard");
            }
        } catch (error) {
            toast.error(error.response.data.message ?? error.message);
        } finally {
            setLoading(false);
        }
    };
rustemxyzdn
75 gün önce

login sayfası

 const handleSubmit = async (e) => {
        e.preventDefault();

        try {
            setLoading(true);
            const res = await FetchLogin(data);
            if (res.status === 200) {
                toast.success(res.data.message);
                router.push("/dashboard");
            }
        } catch (error) {
            toast.error(error.response.data.message ?? error.message);
        } finally {
            setLoading(false);
        }
    };
ebykdrms
77 gün önce

Evet, bu kez kayıt olabildim.
Aslında oturum başarılı şekilde açılıyor. Dashboard ekranına gitmek istiyor. Ama sonra oturumu doğrulayamayıp tekrar login ekranına redirect ediyor gibi görünüyor.
Bu sorun sanıyorum bir middleware'dan kaynaklanıyordur. Bir yandan da localhost'ta düzgün çalıştığını söylüyorsun.

Production ortamında domain farklı olabilir (localhost yerine vercel.app), bu yüzden corsOptions kısmında doğru domain'i ayarladığından emin olmak gerek.
process.env.CLIENT_HOST değerinin ne olduğuna bakmak gerekebilir. Bunu login ekranına yazdırıp görmeyi deneyebilirsin. Bu değer boş da olabilir, production ortamındaki domain'inden farklı da olabilir. Kontrol etmek gerek.
Bu domain farkı yüzünden cors sorunları yaşayıp dashboard sayfanda cookie'yi okuyamıyor olabilirsin.

const corsOptions = {
    origin: process.env.CLIENT_HOST || 'https://socializee-app.vercel.app',
    credentials: true,
};

Pek de Next.js tecrübem olmadığından böyle adım adım deneye yanıla ilerleyeceğiz artık :)
Aslında production ortamındaki tüm process.env değerlerini görebilsek güzel olurdu.

rustemxyzdn
81 gün önce

kodlarım bu sekilde @ebykdrms ve ben kayıt olmayı denedim oldu bir hata vermedi

rustemxyzdn
81 gün önce
const express = require("express");
const https = require("http");
require("dotenv").config();
const dbConnect = require("./libs/dbConnect.js");
const cors = require("cors");
const bodyParser = require("body-parser");
const cookieParser = require("cookie-parser");
const root = require("./routers/root.js");
const errorHandler = require("./middleware/error.js");

dbConnect();

const app = express();
const server = https.createServer(app);

const corsOptions = {
    origin: process.env.CLIENT_HOST,
    credentials: true,
};

app.use(cors(corsOptions));
app.use(bodyParser.json({ extended: true }));
app.use(bodyParser.urlencoded({ extended: true }));
app.use(cookieParser());

app.use("/api", root);
app.use(errorHandler);

const port = process.env.PORT || 3000;

server.listen(port, () => {
    console.log(`listening to port ${port}`);
});

ebykdrms
81 gün önce

Aşağıdaki bilgilerle kayıt olmayı denedim.

{
    "name": "Proto",
    "surname": "Test",
    "username": "prototurkebykdrms",
    "email": "[email protected]",
    "password": "123456"
}

Console'da şu hatayı aldım:

Access to XMLHttpRequest at 'https://socializee-backend.vercel.app/api/auth/register' from origin 'https://socializee-app.vercel.app' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Yani CORS hatası alıyorsun. Bu da isteği atan subdomain socializee-app iken istek atılan subdomain socializee-backend olduğu için oluyor. Localhost'ta CORS'a düşmüyor olabilirsin.
Ben bu aşamada takıldığım için cookie ile ilgili durumu gözlemleyemedim.
Bu sorunu çözmek için -backend kodunu bilemiyorum ama- kabaca aşağıdaki düzenlemeyi yapabilirsin:

const express = require('express');
const cors = require('cors');
const app = express();

// Aşağıdaki origin'den gelen isteklere izin veriyoruz:
app.use(cors({origin: 'https://socializee-app.vercel.app'}));

// ...diğer kodlar ve middleware'lar...

app.listen(80, () => {
  console.log('Sunucu çalışıyor...');
});