C\#진급 시리즈 WebApi 인증 솔 루 션 추천:Basic 기초 인증
1.왜 신분 인증 이 필요 합 니까?
앞에서 말 했 듯 이 인증 을 사용 하지 않 으 면 익명 의 사용자 가 Google 서비스의 url 을 알 면 Google 서비스 인 터 페 이 스 를 임의로 방문 하여 데이터 베 이 스 를 방문 하거나 수정 할 수 있 습 니 다.
1.저 희 는 인증 을 하지 않 고 익명 의 사용 자 는 url 을 통 해 인 터 페 이 스 를 임의로 방문 할 수 있 습 니 다.
익명 의 사용자 가 url 을 통 해 우리 의 데이터 인 터 페 이 스 를 직접 방문 할 수 있 고 최종 적 으로 무슨 일이 발생 할 지 마음대로 생각 할 수 있 습 니 다.
2.신분 인증 을 추가 한 후에 저희 가 어음 을 방문 하 라 는 요청 을 가 져 와 야 저희 인 터 페 이 스 를 방문 할 수 있 습 니 다.
예 를 들 어 우 리 는 url 을 통 해 직접 방문 하면 401 로 돌아 갑 니 다.
정상 적 인 절차 의 요청 이 라면 어음 을 가 져 오 면 OK 입 니 다.
정상 적 인 절차 의 요청 은 요청 메시지 의 머리 에 Authorization 을 추가 합 니 다.그 값 은 바로 우리 의 Ticket 어음 정보 입 니 다.
2.Basic 기초 인증 의 원리 분석
1.흔히 볼 수 있 는 인증 방식
우 리 는 asp.net 의 인증 메커니즘 이 여러 가지 가 있다 는 것 을 안다.WebApi 에 대해 서도 예외 가 아니다.흔히 볼 수 있 는 인증 방식 은
2.Basic 기초 인증 원리
우 리 는 인증 의 목적 이 안전 에 있다 는 것 을 알 고 있 습 니 다.그러면 어떻게 안전 을 보장 할 수 있 습 니까?자주 사용 하 는 수단 은 당연히 암호 화 이다.Basic 인증 도 예외 가 아니다.주요 원 리 는 사용자 정 보 를 암호 화하 고 어음 을 생 성하 여 요청 할 때마다 어음 을 가 져 와 검증 하 는 것 이다.이렇게 말 하면 약간 추상 적일 수 있 습 니 다.우 리 는 모든 절 차 를 상세 하 게 분해 합 니 다.
3.Basic 기초 인증 코드 예제
먼저 우리 의 예시 장면 을 말씀 드 리 겠 습 니 다.지난번 에 CORS 을 소 개 했 을 때 우 리 는 하나의 해결 방안 에 두 개의 프로젝트 웹 과 WebApiCORS 를 넣 었 습 니 다.우 리 는 이번에 도 이 를 예 로 들 어 설명 합 니 다.
1.로그 인 과정 1.1,웹 전단
<body>
<div style="text-align:center;">
<div> ：<input type="text" id="txt_username" /></div>
<div> ：<input type="password" id="txt_password" /></div>
<div><input type="button" value=" " id="btn_login" class="btn-default" /></div>
</div>
</body>
$(function () {
$("#btn_login").click(function () {
$.ajax({
type: "get",
url: "http://localhost:27221/api/User/Login",
data: { strUser: $("#txt_username").val(), strPwd: $("#txt_password").val() },
success: function (data, status) {
if (status == "success") {
if (!data.bRes){
alert(" ");
return;
}
alert(" ");
//
window.location = "/Home/Index?UserName=" + data.UserName + "&Ticket=" + data.Ticket;
}
},
error: function (e) {
},
complete: function () {
}
});
});
});
public class UserController : ApiController
{
/// <summary>
///
/// </summary>
/// <param name="strUser"></param>
/// <param name="strPwd"></param>
/// <returns></returns>
[HttpGet]
public object Login(string strUser, string strPwd)
{
if (!ValidateUser(strUser, strPwd))
{
return new { bRes = false };
}
FormsAuthenticationTicket ticket = new FormsAuthenticationTicket(0, strUser, DateTime.Now,
DateTime.Now.AddHours(1), true, string.Format("{0}&{1}", strUser, strPwd),
FormsAuthentication.FormsCookiePath);
// 、 、
var oUser = new UserInfo { bRes = true, UserName = strUser, Password = strPwd, Ticket = FormsAuthentication.Encrypt(ticket) };
// session ，
HttpContext.Current.Session[strUser] = oUser;
return oUser;
}
// （ ）
private bool ValidateUser(string strUser, string strPwd)
{
if (strUser == "admin" && strPwd == "123456")
{
return true;
}
else
{
return false;
}
}
}
public class UserInfo
{
public bool bRes { get; set; }
public string UserName { get; set; }
public string Password { get; set; }
public string Ticket { get; set; }
}위의 원리 부분 에서 말 한 바 와 같이 로그 인 에 실패 하면 바로 돌아 갑 니 다.성공 하면 생 성 된 어음 Ticket 을 전단 으로 가 져 와 메 인 인터페이스/Home/Index 로 전달 합 니 다.다음은 메 인 인터페이스 Home/Index 를 살 펴 보 겠 습 니 다.
2./Home/Index 메 인 인터페이스
public class HomeController : Controller
{
// GET: Home
public ActionResult Index(string UserName, string Ticket)
{
ViewBag.UserName = UserName;
ViewBag.Ticket = Ticket;
return View();
}
}
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Content/jquery-1.9.1.js"></script>
<link href="~/Content/bootstrap/css/bootstrap.css" rel="stylesheet" />
<script src="~/Content/bootstrap/js/bootstrap.js"></script>
<script src="~/Scripts/Home/Index.js"></script>
<script type="text/javascript">
//
var UserName = '@ViewBag.UserName';
var Ticket = '@ViewBag.Ticket';
</script>
</head>
<body>
<div> ：'@ViewBag.UserName'</div>
<div id="div_test">
</div>
</body>
</html>
$(function () {
$.ajax({
type: "get",
url: "http://localhost:27221/api/Charging/GetAllChargingData",
data: {},
beforeSend: function (XHR) {
// ajax http head
XHR.setRequestHeader('Authorization', 'BasicAuth ' + Ticket);
},
success: function (data, status) {
if (status == "success") {
$("#div_test").html(data);
}
},
error: function (e) {
$("#div_test").html("Error");
},
complete: function () {
}
});
});
3.WebApiCORS 인증 부분(중점)
위/Home/Index 페이지 에서 ajax 요청 서 비 스 를 보 낸 것 을 보 았 습 니 다. http://localhost:27221/api/Charging/GetAllChargingData 이 인터페이스,그러면 우 리 는 WebApi 에서 이 요청 과 합 법 적 인 요청 을 어떻게 검증 합 니까?다음은 검증 의 이 과정 을 중점적으로 살 펴 보 자.
3.1.WebApiCORS 프로젝트 에서 RequestAuthorizeAttribute 클래스 를 사용자 정의 하여 AuthorizeAttribute 클래스 를 계승 합 니 다.그리고 OnAuthorization 방법 을 다시 쓰 고 이 방법 에서 요청 헤더 의 Ticket 정 보 를 찾 은 다음 사용자 이름 비밀번호 가 합 리 적 인지 확인 합 니 다.
/// <summary>
///
/// </summary>
public class RequestAuthorizeAttribute : AuthorizeAttribute
{
// ， Ticket
public override void OnAuthorization(System.Web.Http.Controllers.HttpActionContext actionContext)
{
// http ， ticket
var authorization = actionContext.Request.Headers.Authorization;
if ((authorization != null) && (authorization.Parameter != null))
{
// ticket,
var encryptTicket = authorization.Parameter;
if (ValidateTicket(encryptTicket))
{
base.IsAuthorized(actionContext);
}
else
{
HandleUnauthorizedRequest(actionContext);
}
}
// ， ， 401
else
{
var attributes = actionContext.ActionDescriptor.GetCustomAttributes<AllowAnonymousAttribute>().OfType<AllowAnonymousAttribute>();
bool isAnonymous = attributes.Any(a => a is AllowAnonymousAttribute);
if (isAnonymous) base.OnAuthorization(actionContext);
else HandleUnauthorizedRequest(actionContext);
}
}
// （ ）
private bool ValidateTicket(string encryptTicket)
{
// Ticket
var strTicket = FormsAuthentication.Decrypt(encryptTicket).UserData;
// Ticket
var index = strTicket.IndexOf("&");
string strUser = strTicket.Substring(0, index);
string strPwd = strTicket.Substring(index + 1);
if (strUser == "admin" && strPwd == "123456")
{
return true;
}
else
{
return false;
}
}
}
[RequestAuthorize]
public class ChargingController : ApiController
{
/// <summary>
///
/// </summary>
/// <returns> </returns>
[HttpGet]
public string GetAllChargingData()
{
return "Success";
}
/// <summary>
/// Id
/// </summary>
/// <param name="id"> Id</param>
/// <returns> </returns>
[HttpGet]
public string GetAllChargingData(string id)
{
return "ChargingData" + id;
}
}최적화
위의 몇 단 계 를 통 해 우리 가 원 하 는 신분 인증 효 과 를 얻 을 수 있 지만 항상 불편 하고 주로 불편 한 점 은 다음 과 같다.
1.API 를 새로 만 들 때마다 대응 하 는 인터페이스 에[RequestAuthorize]라 는 것 을 표시 해 야 하기 때문에 매우 번거롭다.
2.ajax 요청 을 보 낼 때마다 beforeSend 이벤트 에 XHR.setRequestHeader('Authorization','Basic Auth'+Ticket)를 추가 합 니 다.이것 도 귀 찮 은 것 같 아 요.
상기 두 가지 에 대하 여 우 리 는 최적화 하 였 다.
1.API 문제 해결
API 에 공통 부모 클래스 를 추가 하고 부모 클래스 에[RequestAuthorize]를 표시 하면 됩 니 다.
namespace WebApiCORS.Controllers
{
[RequestAuthorize]
[EnableCors(origins: "*", headers: "*", methods: "*")]
public class BaseApiController : ApiController
{
}
}
namespace WebApiCORS.Controllers
{
public class ChargingController : BaseApiController
{
/// <summary>
///
/// </summary>
/// <returns> </returns>
[HttpGet]
public string GetAllChargingData()
{
return "Success";
}
/// <summary>
/// Id
/// </summary>
/// <param name="id"> Id</param>
/// <returns> </returns>
[HttpGet]
public string GetAllChargingData(string id)
{
return "ChargingData" + id;
}
}
}2.ajax 문제 해결
우리 가 JS 구성 요소 시리즈-자신의 JS 구성 요 소 를 봉인 합 니 다. 에 소개 한 ajax 의 error 사건 을 추가 하 는 공공 처리 방법 을 기억 하 십 니까?우리 도 같은 메커니즘 을 통 해 이것 을 늘 릴 수 있 을 까?새 파일 Jqueryajax_extention.js
(function ($) {
//1. $.ajax
var _ajax = $.ajax;
$.ajax = function (options) {
//2. ajax error
var fn = {
error: function (XMLHttpRequest, textStatus, errorThrown) {
toastr.error(XMLHttpRequest.responseText, ' ', { closeButton: true, timeOut: 0, positionClass: 'toast-top-full-width' });
},
success: function (data, textStatus) { },
beforeSend: function (XHR) { },
complete: function (XHR, TS) { }
}
//3. $.ajax ，
var _options = $.extend({}, {
error: function (XMLHttpRequest, textStatus, errorThrown) {
fn.error(XMLHttpRequest, textStatus, errorThrown);
},
success: function (data, textStatus) {
fn.success(data, textStatus);
},
beforeSend: function (XHR) {
XHR.setRequestHeader('Authorization', 'BasicAuth ' + Ticket);
fn.beforeSend(XHR);
},
complete: function (XHR, TS) {
fn.complete(XHR, TS);
}
}, options);
//4. ajax
_ajax(_options);
};
})(jQuery);총화
이상 은 하나의 사례 를 결합 하여 Basic 인증 의 실현 원리 와 간단 한 사용 을 설명 했다.본 고 는 모두 블 로 거 자신의 이해 에서 나 온 것 이 고 전면적 이지 않 은 부분 이 있 으 면 원 림 친구 들 이 고 쳐 주 기 를 기대한다.만약 본문 이 많 든 적 든 너 를 도 울 수 있다 면,추천 을 도와 도 무방 하 다.
이상 의 C\#진급 시리즈 WebApi 인증 솔 루 션 추천:Basic 기초 인증 은 바로 편집장 이 여러분 에 게 공유 한 모든 내용 입 니 다.여러분 에 게 참고 가 될 수 있 고 많은 응원 을 바 랍 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
nuxt.js와 serverMiddleware (express)에서 Twitter 로그인을 구현 한 이야기nuxt.js + serverMiddleware(express)에서 Twitter 로그인을 구현했다. 이것은 에 영감을 썼습니다. 위의 기사에서는 서버 측을 Larabel로 준비하고 있지만, 그러고 보니 nuxt의 ...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
