Full-Stack HttpOnly Cookie Authentication Guide

ভবিষ্যতের জন্য এটি একটি চমৎকার নোট হতে পারে। HttpOnly Cookie এবং Interceptor ব্যবহার করে একটি সিকিউর অথেনটিকেশন সিস্টেম তৈরি করার পূর্ণাঙ্গ গাইড নিচে দেওয়া হলো:


🔐 Full-Stack HttpOnly Cookie Authentication Guide

এই সিস্টেমে JWT টোকেন ব্রাউজারের লোকাল স্টোরেজে থাকে না, বরং একটি সুরক্ষিত কুকিতে থাকে যা জাভাস্ক্রিপ্ট দিয়ে চুরি করা অসম্ভব।


ধাপ ১: ব্যাকএন্ডে (ASP.NET Core API) কুকি সেট করা

লগইন সফল হলে টোকেনটি সরাসরি রেসপন্স বডিতে না পাঠিয়ে Response.Cookies এর মাধ্যমে পাঠাতে হয়।

C#

[HttpPost("login")]
public async Task<IActionResult> Login([FromBody] LoginRequestDto request)
{
    var user = await userManager.FindByEmailAsync(request.Email);
    
    if (user != null && await userManager.CheckPasswordAsync(user, request.Password))
    {
        var roles = await userManager.GetRolesAsync(user);
        var jwtToken = tokenService.CreateJwtToken(user, roles.ToList());

        // ১. কুকি অপশন সেট করা
        var cookieOptions = new CookieOptions
        {
            HttpOnly = true,        // জাভাস্ক্রিপ্ট এক্সেস ব্লক (XSS সুরক্ষা)
            Secure = true,          // শুধু HTTPS এ কাজ করবে
            SameSite = SameSiteMode.Strict, // CSRF সুরক্ষা
            Expires = DateTime.UtcNow.AddMinutes(15) // ১৫ মিনিট মেয়াদ
        };

        // ২. রেসপন্স হেডারে কুকি যোগ করা
        Response.Cookies.Append("AuthorizationToken", jwtToken, cookieOptions);

        // ৩. ফ্রন্টএন্ডের জন্য শুধু ইউজার ডাটা পাঠানো (টোকেন ছাড়া)
        return Ok(new { Email = user.Email, Roles = roles });
    }
    return BadRequest("Invalid Login");
}

ধাপ ২: ডটনেটে কুকি থেকে টোকেন রিড করা

ডিফল্টভাবে .NET হেডারে টোকেন খোঁজে। কুকি থেকে টোকেন পড়ার জন্য Program.cs এ এটি যোগ করতে হয়:

C#

builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
    .AddJwtBearer(options => {
        options.Events = new JwtBearerEvents
        {
            OnMessageReceived = context =>
            {
                // কুকি থেকে টোকেনটি সংগ্রহ করা
                context.Token = context.Request.Cookies["AuthorizationToken"];
                return Task.CompletedTask;
            }
        };
        // ... অন্যান্য কনফিগারেশন (Issuer, Audience, Key)
    });

ধাপ ৩: ফ্রন্টএন্ডে (Angular) ইন্টারসেপ্টর তৈরি করা

যেহেতু কুকি জাভাস্ক্রিপ্ট দিয়ে পড়া যায় না, তাই ব্রাউজারকে বলতে হয় প্রতিটি রিকোয়েস্টের সাথে কুকিটি নিয়ে যেতে। এটি অটোমেটিক করার জন্য src/app/interceptors/auth.interceptor.ts তৈরি করো:

TypeScript

import { HttpInterceptorFn } from '@angular/common/http';

export const authInterceptor: HttpInterceptorFn = (req, next) => {
  
  // প্রতিটি রিকোয়েস্ট ক্লোন করে withCredentials: true যোগ করা
  const authRequest = req.clone({
    withCredentials: true
  });

  return next(authRequest);
};

ধাপ ৪: Angular এ ইন্টারসেপ্টর রেজিস্টার করা

src/app/app.config.ts ফাইলে ইন্টারসেপ্টরটি যোগ করতে হবে:

TypeScript

export const appConfig: ApplicationConfig = {
  providers: [
    provideHttpClient(
      withInterceptors([authInterceptor]) // ইন্টারসেপ্টর চালু করা
    )
  ]
};

ধাপ ৫: ব্যাকএন্ডে CORS কনফিগারেশন

কুকি আদান-প্রদান করার জন্য CORS পলিসি খুব কঠোর হতে হয়। Program.cs এ এটি নিশ্চিত করো:

C#

builder.Services.AddCors(options =>
{
    options.AddPolicy("AngularPolicy", policy =>
    {
        policy.WithOrigins("http://localhost:4200") // নির্দিষ্ট ইউআরএল লাগবেই
              .AllowAnyHeader()
              .AllowAnyMethod()
              .AllowCredentials(); // এটি কুকি পাঠানোর অনুমতি দেয়
    });
});

app.UseCors("AngularPolicy");

ধাপ ৬: লগআউট (কুকি ডিলিট করা)

ব্যাকএন্ডে একটি এন্ডপয়েন্ট লাগবে যা কুকির মেয়াদ শেষ করে দেবে:

C#

[HttpPost("logout")]
public IActionResult Logout()
{
    Response.Cookies.Delete("AuthorizationToken", new CookieOptions 
    { 
        HttpOnly = true, 
        Secure = true, 
        SameSite = SameSiteMode.Strict 
    });
    return Ok();
}

কেন এটি সেরা পদ্ধতি? (Summary for Future)

  • Security: টোকেন ব্রাউজারে দেখা গেলেও জাভাস্ক্রিপ্ট (XSS) দিয়ে চুরি করা যায় না।
  • Automation: ইন্টারসেপ্টরের কারণে ম্যানুয়ালি হেডার সেট করতে হয় না।
  • State Management: টোকেন কুকিতে থাকলেও ইউজারের রোল/ইমেইল অ্যাঙ্গুলার সিগন্যালে সেভ করা থাকে UI দেখানোর জন্য।

এটি তোমার নোটবুক বা গিটহাবে সেভ করে রাখো, প্রফেশনাল লাইফে অনেক কাজে দেবে! এখন কি তোমার প্রজেক্টে আর কোনো ফিচার বাকি আছে?

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top