برای اعمال احراز هویت باید در صورت موفقیت آمیز بودن Login ، یک Token را تولید کرده و آن را به سمت Client فرستاد. Client با استفاده از Token دریافت شده می تواند درخواست های بعدی را بفرستد. اگر Token معتبر نباشد با پیغام خطا و یا Status Code شماره 401 مواجه می شود. یکی از بهترین راه ها برای تولید Token استفاده از یک Nuget به نام JWT می باشد.
مثال: اگر بخواهید تنها درخواست هایی که احراز هویت شده اند بتوانند پردازش شوند. ابتدا باید درخواستی تحت عنوان لاگین به سمت سرور فرستاده بفرستید. در این درخواست نام کاربری Ali و رمز عبور Pass@123 است.
اولین قدم نصب JWT است. به سراغ پنجره ی Nuget Manager رفته و این عبارت را جستجو کرده و آن را نصب کنید.
Microsoft.AspNetCore.Authentication.JwtBearer
حال به سراغ فایل appsettings.json رفته و کد زیر را به آن اضافه کنید. در قسمت Secret، کلید اصلی خود را بنویسید که می خواهید رمزنگاری بر اساس آن انجام شود.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
{ "Logging": { "LogLevel": { "Default": "Information", "Microsoft": "Warning", "Microsoft.Hosting.Lifetime": "Information" } }, "Jwt": { "Secret": "ThisismySecretKey", "Issuer": "http://localhost:61955/", "Audience": "http://localhost:4200/" }, "AllowedHosts": "*" |
سپس در Controller تغییرات مورد نظر زیر را اعمال کنید. (Configuration را به Constructor تزریق کنید.)
|
1 2 3 4 5 6 7 8 |
public class TestController : ControllerBase { private readonly IConfiguration _configuration; public TestController(IConfiguration configuration) { _configuration = configuration; } //Rest of codes |
کلاس Login Model را مانند زیر بنویسید.
|
1 2 3 4 5 6 7 8 |
public class LoginModel { [Required] public string UserName { get; set; } [Required] public string Password { get; set; } } |
اکشن Login را مطابق زیر بنویسید. کد زیر در صورت درست بودن نام کاربری و رمز عبور، یک Token تولید می کند و به Client می فرستد.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
[HttpPost] [Route("Login")] public IActionResult Login(LoginModel model) { if (model.UserName == "ali" && model.Password.ToLower() == "Pass@123") { var authClaims = new List { new Claim(ClaimTypes.Name,model.UserName), new Claim(JwtRegisteredClaimNames.Jti,Guid.NewGuid().ToString()), new Claim(ClaimTypes.Role,"Admin") }; var authSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(_configuration["JWT:Secret"])); var token = new JwtSecurityToken( issuer: _configuration["JWT:ValidIssuer"], audience: _configuration["JWT:ValidAudience"], expires: DateTime.Now.AddHours(1), claims: authClaims, signingCredentials: new SigningCredentials(authSigningKey, algorithm: SecurityAlgorithms.HmacSha256) ); return Ok(new { token = new JwtSecurityTokenHandler().WriteToken(token), expiration = token.ValidTo }); } return Unauthorized(); } |
سپس در فایل Startup.cs در متد ConfigueServices کد های زیر را اضافه کنید.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
//Adding Authentication services.AddAuthentication(options => { options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme; options.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme; options.DefaultScheme = JwtBearerDefaults.AuthenticationScheme; } ) //Add JWT Bearer .AddJwtBearer(options => { options.SaveToken = true; options.RequireHttpsMetadata = false; options.TokenValidationParameters = new TokenValidationParameters() { ValidateIssuer = true, ValidateAudience = true, ValidIssuer = Configuration["JWT:ValidIssuer"], ValidAudience = Configuration["JWT:ValidAudience"], IssuerSigningKey=new SymmetricSecurityKey(Encoding.UTF8.GetBytes(Configuration["JWT:Secret"])) }; }); |
در متد Configue هم کد های زیر را اضافه کنید.
|
1 2 |
app.UseAuthentication(); app.UseAuthorization(); |
بعد از آن نوبت به نوشتن اکشن Get می رسد. قرار است در صورت احراز شدن هویت، این متد اجرا شود. در کنترلر مورد نظر، اکشن Get را مانند زیر بنویسید. به attribute بالای متد دقت کنید. Authorize باعث می شود که تنها در صورت موفقیت آمیز بودن احراز هویت، اکشن Get اجرا شود. در غیر این صورت با خطای 401 مواجه می شوید.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
// GET: api/ [HttpGet] [Authorize] public IEnumerable Get() { return new List() { new Student(){Id=0,FirstName="Sam",LastName="Jackson"}, new Student(){Id=1,FirstName="Michael",LastName="Hilton"}, new Student(){Id=2,FirstName="Max",LastName="Jones"}, }; } |
حال نوبت تست API در برنامه ی Postman می رسد. مطابق شکل زیر درخواست Login را به سمت API بفرستید. در صورت موفقیت در Response می توان token تولید شده را دید.
برای ارسال درخواست Get به API با استفاده از Token به دست آمده، باید ابتدا مقدار Token را کپی کرده و مطابق شکل زیر در قسمت Authorization ، نوع را Bearer Token انتخاب کرده و مقدار Token را در فید Token الصاق کرد.
در صورت معتبر بودن Token ، اکشن Get اجرا می شود و نتیجه ی درخواست نشان داده می شود.
برای اطمینان از اینکه Token تولید شده معتبر است یا خیر، باید در وبسایت JWT.io مقدار Token را Decode کرد.
ذخیره Token
تا اینجای کار، تولید توکن، ارسال توکن به کلاینت، ارسال توکن به API همراه هر درخواست را بررسی کردیم. توکن ای که بعد از عملیات Login یا Register به سمت کلاینت فرستاده می شود باید در جایی ذخیره شود تا بتوان در درخواست های بعدی از آن استفاده کرد. سه راه برای ذخیره کردن توکن وجود دارد:
- Cookie
- Session Storage
- Local Storage
Cookie
کوکی ها به صورت داده های متنی که متشکل از 5 فیلد متغیر-طول ( variable-length) است ، می باشند:
- Expires : داده های کوکی منقضی می شوند. اگر این فیلد خالی باشد ، کوکی زمانی که بازدید کننده مرورگر را می بندد ، منقضی می شود.
- Domain : نام دامنه وب سایت می باشد.
- Path : مربوط به مسیر دایرکتوری یا وب سایتی است که کوکی را تنظیم می نماید. این فیلد ، در صورتی که بخواهید کوکی را از دایرکتوری یا صفحه دیگری بازیابی کنید ، خالی می ماند.
- Secure : اگر این فیلد حاوی کلمه “secure” باشد ، کوکی فقط ممکن است با سرور secure بازیابی شود. اگر این فیلد خالی باشد ، چنین محدودیتی وجود ندارد.
- Name= Value : کوکی در قالب جفت های key-value تنظیم و بازیابی می شوند.
نوشتن کوکی
برای ایجاد و ذخیره کوکی می توان از کد زیر در زبان جاوا اسکریپت استفاده کرد.
|
1 |
document.cookie = "Key1=value1;key2=value2;expires=date"; |
کوکی ها ممکن است شامل سمیکالن، کاما یا فاصله نباشند در این صورت به احتمال قوی Encode شده اند. با استفاده از متد escape() می توان مقدار کوکی را کدگذاری کرد و با متد unescape() می توان در هنگام خواندن کوکی مقدار آن را رمزگشایی کرد.
|
1 2 |
cookievalue = escape(document.myform.customer.value) + ";"; document.cookie = "name=" + cookievalue; |
خواندن کوکی
|
1 2 3 4 5 6 7 8 9 10 11 |
var allcookies = document.cookie; document.write("All Cookies : " + allcookies); //Get all the cookies pairs in an array cookiearray = allcookies.split(';'); //now take key value pair out of this array for (var i = 0; i < cookiearray.length; i++) { name = cookiearray[i].split('=')[0]; value = cookiearray[i].split('=')[1]; document.write("Key is : " + name + " and Value is : " + value); |
تاریخ انقضاء کوکی
|
1 2 3 4 5 6 |
var now = new Date(); now.setMonth(now.getMonth() + 1); cookievalue = escape(document.myform.customer.value) + ";"; document.cookie = "name=" + cookievalue; document.cookie = "expires" + now.toUTCString() + ";"; |
حذف کوکی
برای حذف کوکی تنها کافی است تاریخ انقضاء آن را به گذشته تغییر داد.
|
1 2 3 4 5 6 |
var now = new Date(); now.setMonth(now.getMonth() - 1); cookievalue = escape(document.myform.customer.value) + ";"; document.cookie = "name=" + cookievalue; document.cookie = "expires" + now.toUTCString() + ";"; |
Local Storage
حافظه ای برای ذخیره سازی به صورت Key-Value در مرورگر است. و نسبت به کوکی ها فضای بیشتری برای ذخیره سازی دارد (تقریبا 10 مگابایت)
ایجاد مقدار
|
1 2 |
let key = 'Item 1'; localStorage.setItem(key,'value') |
خواندن مقدار
|
1 |
let myItem = localStorage.getItem(key); |
بروزرسانی مقدار
|
1 |
localStorage.setItem(key,'new value') |
حذف مقدار
|
1 |
localStorage.removeItem(key); |
خالی کردن تمام Local Storage
|
1 |
localStorage.clear(); |
ذخیره با فرمت JSON در Local Storage
|
1 2 3 4 5 6 |
//create item: let myObj = { name: 'Arman', family: 'Armani' }; localStorage.setItem(key, JSON.stringify(myObj)); //Read item: let item = JSON.parse(localStorage.getItem(key)); |
Session Storage
حافظه ای برای ذخیره سازی اطلاعات در مرورگر است. شبیه Cookie عمل می کند با این تفاوت که با بستن مرورگر اطلاعات درون آن از بین می رود.
ایجاد مقدار
|
1 |
sessionStorage.setItem("key", "Value"); |
خواندن مقدار
|
1 |
let item = sessionStorage.getItem("key"); |
حذف یک Session خاص از Session Storage
|
1 |
sessionStorage.removeItem("key"); |
حذف کل Session های موجود در Session Storage
|
1 |
sessionStorage.clear(); |
Local Storage و Session Storage در این موارد شبیه هم هستند:
- داده ها به صورت محلی یا اوکال ذخیره می شوند و توسط سرور قابل خواندن نیستند.
- هر دو اجازه می دهند تا داده های بسیار بیشتری ذخیره شود (10 مگابایت برای اکثر مرورگرها).
- استفاده از آن ساده است.
مقایسه Local Storage با Session Storage
وظیفه ی Local Storage و Session Storage یکسان است، اما در Session Storage داده ها فقط تا زمانی که پنجره یا تب مرورگر بسته شود ، وجود دارند، در حالی که در Local Storage داده ها وجود دارند تا زمانی که کاربر یا به طور دستی حافظه نهان مرورگر را پاک کند و یا برنامه وب اقدام به پاک کردن آن بنماید.
