How to add anti-forgery token to the PdfViewerControl?
Essential JS 2 PDF Viewer
The Syncfusion PDF Viewer in ASP.NET Core (Essential JS 2) is a modern enterprise UI toolkit that has been built from the ground up to be lightweight, responsive, modular, and touch-friendly. It is also available in other frameworks such as JavaScript, Angular, ASP.NET MVC and React.
Refer to the following UG link for getting started with the PdfViewerControl.
https://ej2.syncfusion.com/aspnetcore/documentation/pdfviewer/getting-started/
Adding Anti-Forgery Token to PDF Viewer
The anti-forgery token can be added to the PdfViewerControl’s AJAX request at the sample level. Refer to the following steps to add the anti-forgery token:
Step 1: Configure the anti-forgery token at the application Startup.cs in the ConfigureServices method using the following code example.
Startup.cs
public void ConfigureServices(IServiceCollection services)
{
services.AddMvc();
services.AddAntiforgery(options =>
{
options.HeaderName = "X-CSRF-TOKEN";
options.SuppressXFrameOptionsHeader = false;
});
}Step 2: Inject the Microsoft.AspNetCore.Antiforgery.IAntiforgery service into the view and call GetAndStoreToken.
Index.cshtml
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@functions{
public string GetAntiXsrfRequestToken()
{
return Xsrf.GetAndStoreTokens(Context).RequestToken;
}
}
<input type="hidden" id="RequestVerificationToken"
name="RequestVerificationToken" value="@GetAntiXsrfRequestToken()">
window.onload = function () {
var token = document.getElementById('RequestVerificationToken').value;
XMLHttpRequest.prototype.realSend = XMLHttpRequest.prototype.send;
var newSend = function (vData) {
if (this.getResponseHeader("X-CSRF-TOKEN") == null) {
this.setRequestHeader("X-CSRF-TOKEN", token);
}
this.realSend(vData);
};
XMLHttpRequest.prototype.send = newSend;
}
Step 3: The ValidateAntiForgeryToken is an action filter that can be applied to an individual action, a controller, or globally. Requests made to actions that have this filter applied are blocked unless the request includes a valid anti-forgery token.
PdfViewerController.cs
[AcceptVerbs("Post")]
[HttpPost]
[ValidateAntiForgeryToken]
[Route("api/[controller]/Load")]
public IActionResult Load([FromBody] Dictionary<string, string> jsonObject)
{
}Adding Custom Header to the PdfViewerControl’s AJAX Request
You can add a custom header to the PdfViewerControl’s AJAX request at the sample level. Refer to the following code to include the authorization token in the AJAX request.
XMLHttpRequest.prototype.realSend = XMLHttpRequest.prototype.send;
var newSend = function (vData) {
this.setRequestHeader('Authorization', 'Bearer 64565dfgfdsjweiuvbiuyhiueygf');
this.realSend(vData);
};
XMLHttpRequest.prototype.send = newSend;Conclusion:
I hope you enjoyed learning about how to add anti-forgery token to the PdfViewerControl.
