Asp.net核心Razor页面-页面加载后设置变量值

Question

I have a string variable named 'cookie' in my Index page model. This cookie gets set using the following method:

private string GetXsrfToken()
{
    this.Request.Cookies.TryGetValue("XSRF-TOKEN", out var token);
    var xsrfToken = token ?? "TestToken";
    return xsrfToken;
}

Then in my Razor Page it is being used like this:

....
<div>
    <input type="submit" name="btn_signin" value="Sign In" id="btn_signin" formaction="~/SignIn/?_csrf=@Model.cookie" default />
</div>
....

The issue I am having is on the first time the page loads, the GetXsrfToken() method returns "TestToken". After debugging I realised that this is because 'cookie' is being set before the page loads, so the XSRF-TOKEN cookie does not exist for the page yet.

In the Index PageModel I have OnGet and OnPostSignIn Methods and I have tried setting the cookie variable in both using:

cookie = GetXsrfToken();

HoweverThe OnGet method gets called too early, and putting it in the OnPost method means it will get called too late.

So it needs to be set once the page has fully loaded, but I am unsure how to implement this. Any advice would be appreciated.

Answer 1

ASP.NET Core will inject a hidden form field named __RequestVerificationToken at the end of every form with an encrypted value, and passing the same value to a cookie which is sent with the form request :

<input name="__RequestVerificationToken" type="hidden" value="CfDJ8NrAkS ... s2-m9Yw">

Reference : https://docs.microsoft.com/en-us/aspnet/core/security/anti-request-forgery?view=aspnetcore-2.1

Then you could use Jquery to get the anti-forgery token and dynamically change the button's attribute :

@section Scripts {
  <script type="text/javascript">

    $(function () {
        var csrf = $('input[name="__RequestVerificationToken"]').val();
        $("#btn_signin").attr("formaction", "~/SignIn/?" + csrf);
        //alert(csrf);
    })
  </script>
}