source

ASP로 위조 방지 토큰을 활성화합니다.NET Core 및 JQuery

ittop 2023. 9. 14. 23:35
반응형

ASP로 위조 방지 토큰을 활성화합니다.NET Core 및 JQuery

저는 ASP와 함께 JQuery를 사용하고 있습니다.NET Core 1.0.1과 Ajax와의 통화:

$("#send-message").on("submit", function (event) {
  event.preventDefault();
  var $form = $(this);   
  $.ajax({
    url: "api/messages",
    data: JSON.stringify($form.serializeToJSON()),
    dataType: "json",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json"
    },
    type: "post"
  })
  .done(function (data, status, xhr) { })
  .fail(function (xhr, status, error) { });

ASP에게.NET 핵심 작업:

[HttpPost("messages")]
public async Task<IActionResult> Post([FromBody]MessagePostApiModelModel model) {
   // Send message
}

양식은 공유 보기에 있으며 다음과 같습니다.

<form id="send-question" method="post">
  <textarea name="content"></textarea>
  <button class="button" type="submit">Enviar</button>
</form>

양식을 제출하면 오류가 발생합니다.

Microsoft.AspNetCore.Antiforgery.AntiforgeryValidationException: The required antiforgery header value "RequestVerificationToken" is not present.

ASP를 활성화하려면 어떻게 해야 합니까?NET 코어의 위조 방지 기술JQuery Ajax 호출이 있는 토큰?

갱신하다

양식에 다음 asp-controller와 asp-action을 추가해야 합니다.

<form asp-controller="QuestionApi" asp-action="Post" id="send-question" method="post">
</form>

위변조 방지 토큰이 생성됩니다.그리고 다음과 같이 JQuery 호출의 헤더에 토큰을 수동으로 추가해야 했습니다.

  headers: {
    "Accept": "application/json",
    "Content-Type": "application/json",
    "RequestVerificationToken": $form.find("input[name='af_token']").val()
  },

더 좋은 방법이 없을까요?

양식이 없고 클릭하면 Ajax 호출이 되는 A 태그만 있는데 어떻게 해결합니까?해당 페이지의 모든 Ajax 호출에 사용할 공통 위조 방지 토큰을 페이지 헤드에 생성할 수 있습니까?

mode777의 답변은 이것을 효과적으로 만들기 위해 약간의 추가만 있으면 됩니다 (시도해 보았습니다):

$(document).ajaxSend(function(e, xhr, options) {
    if (options.type.toUpperCase() == "POST") {
        var token = $form.find("input[name='af_token']").val();
        xhr.setRequestHeader("RequestVerificationToken", token);
    }
});

사실 아약스를 이용해서 제출하는 경우에는 양식을 전혀 사용할 필요가 없습니다.이 내용을 _배치에 입력합니다.

 <span class="AntiForge"> @Html.AntiForgeryToken() </span>

그런 다음 이를 자바스크립트에 추가하여 토큰을 선택합니다.

$(document)
   .ajaxSend(function (event, jqxhr, settings) {
        if (settings.type.toUpperCase() != "POST") return;
        jqxhr.setRequestHeader('RequestVerificationToken', $(".AntiForge" + " input").val())
})

@HtmlAntiForgy토큰은 양식을 사용할 때와 동일하게 위조 방지 토큰으로 숨겨진 입력 필드를 생성합니다.위의 코드는 클래스 선택기를 사용하여 스팬을 선택한 다음 입력 필드를 가져와 토큰을 수집하고 헤더로 추가합니다.

참고: 이 답변은 ASP에 적용됩니다.NET Core 2.0.이전 버전에는 맞지 않을 수 있습니다.

잠깐 아스넷의 소스코드를 뒤적인 후에 제가 한 일은 다음과 같습니다.

public static class HttpContextExtensions
{
    public static string GetAntiforgeryToken(this HttpContext httpContext)
    {
        var antiforgery = (IAntiforgery)httpContext.RequestServices.GetService(typeof(IAntiforgery));
        var tokenSet = antiforgery.GetAndStoreTokens(httpContext);
        string fieldName = tokenSet.FormFieldName;
        string requestToken = tokenSet.RequestToken;
        return requestToken;
    }
}

다음과 같은 보기로 사용할 수 있습니다.

<script>
    var data = {
        yourData: "bla",
        "__RequestVerificationToken": "@Context.GetAntiforgeryToken()"
    };
    $.post("@Url.Action("ActionName")", data);
</script>

JSON fragment 등 원하는 형식으로 필드 이름을 반환하도록 확장 메서드를 수정할 수 있습니다.

Asp.Net Core에서는 문서화된 대로 토큰을 직접 요청할 수 있습니다.

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf    
@functions{
    public string GetAntiXsrfRequestToken()
    {
        return Xsrf.GetAndStoreTokens(Context).RequestToken;
    }
}

자바스크립트에서 사용합니다.

function DoSomething(id) {
    $.post("/something/todo/"+id,
               { "__RequestVerificationToken": '@GetAntiXsrfRequestToken()' });
}

문서화된 대로 권장 전역 필터를 추가할 수 있습니다.

services.AddMvc(options =>
{
    options.Filters.Add(new AutoValidateAntiforgeryTokenAttribute());
})

GET이 아닌 모든 ajax 호출에 헤더를 추가하는 글로벌 ajax 이벤트를 등록할 수 있습니다.

$(document).ajaxSend(function(e, xhr, options) {
    if (options.type.toUpperCase() != "GET") {
        xhr.setRequestHeader("RequestVerificationToken", token);
    }
});

예를 들어 XSRF 토큰을 헤더로 전달하려면 ygoe의 답변 외에X-XSRF-Token:

var ajax = {
    url: "/users",
    data: data,
    type: "post",

    // ...
};

var antiForgeryToken = $("input[name=__RequestVerificationToken]").val();
if (antiForgeryToken) {
    ajax.headers = {};
    ajax.headers["X-XSRF-Token"] = antiForgeryToken;
};

$.ajax(ajax);

그런 다음 각각의 위조 방지 옵션도 지정해야 합니다.

public void ConfigureServices(IServiceCollection services)
{
    // your services to inject are also configured here ...

    services.AddAntiforgery(options => options.HeaderName = "X-XSRF-Token");
    services.AddMvc();
}

그러면 표준을 사용할 수 있습니다.ValidateAntiForgeryToken요청의 유효성을 검사할 속성:

[HttpPost]
[ValidateAntiForgeryToken]
public JsonResult Users(UserModel user)
{
    // ...
}

언급URL : https://stackoverflow.com/questions/40530474/enable-antiforgery-token-with-asp-net-core-and-jquery

반응형