atahango/belgeler/OAUTH_FRONTEND_USAGE.md

OAuth Frontend Kullanimi (Google/GitHub)

Bu proje icin OAuth akisi backend uzerinden baslar ve callback sonunda frontend'e redirect edilir.

1) Frontend Login Baslatma

Kullanici butona tikladiginda tarayiciyi backend'e yonlendir:

const API_BASE = "http://localhost:8080";

// Google
window.location.href = `${API_BASE}/v1/auth/google`;

// GitHub
// window.location.href = `${API_BASE}/v1/auth/github`;

2) Backend Callback Davranisi

OAuth tamamlandiginda backend su URL'e redirect eder:

http://localhost:5173/auth/callback#access_token=...&refresh_token=...&provider=google

Bu davranis icin backend .env ayari:

OAUTH_REDIRECT_URL=http://localhost:5173/auth/callback

3) Frontend Callback Sayfasi

Frontend tarafinda /auth/callback sayfasinda URL hash'ten tokenlari al:

const params = new URLSearchParams(window.location.hash.replace("#", ""));
const accessToken = params.get("access_token");
const refreshToken = params.get("refresh_token");
const provider = params.get("provider");

if (accessToken && refreshToken) {
  localStorage.setItem("access_token", accessToken);
  localStorage.setItem("refresh_token", refreshToken);
  // istersen /v1/auth/me ile kullanici bilgisini cek
}

4) /v1/auth/me Kullanimi

Token alindiktan sonra kullanici bilgisi icin:

curl http://localhost:8080/v1/auth/me \
  -H "Authorization: Bearer YOUR_TOKEN"

Notlar

• Callback endpoint'i frontend tarafindan fetch ile cagrilmaz.
• Tokenlar URL hash ile geldigi icin query'den daha guvenlidir (server loglarina dusmez).
• Isteklerde Authorization header olarak Bearer <token> kullanilir.