C# MVC detect if XMLHttpRequest

Question

I've tried the following in my C# Controller

used the following namespaces

 using System;
 using System.Web;
 using System.Web.Mvc;

and the following "things" inside IActionResult Create() method

    // GET: Movies/Create
    public IActionResult Create()
    {
        Request.IsAjaxRequest(); // this line tells me "HttpRequest does not contain a defintion for IsAjaxRequest .. (are you missing a using directive?)"


        string method = HttpContext.Request.Method;
        string requestedWith = HttpContext.Request.Headers["X-Requested-With"];

        HttpContext.Request.Headers["X-Requested-With"] == "XMLHttpRequest";

        new HttpRequestWrapper(System.Web.HttpContext.Current.Request).IsAjaxRequest()


        return View();
    }

None of them works for me. I can debug the request but I can not find anything telling me this is a xhr or XMLHttpRequest.

I'm calling the controller action like so:

function reqListener () {
    console.log(this.responseText);
}

var oReq = new XMLHttpRequest();
oReq.addEventListener("load", reqListener);
oReq.open("GET", "https://localhost:5001/Movies/Create");
oReq.send();

The browser dev tools tell me it is a XHR Type Request:

How can I detect the XHR request in a C# Controller or in a .cshtml file?

Answer 1

You can do the following:

    // GET: Movies/Create
    public IActionResult Create()
    {
        string requestedWith = HttpContext.Current.Request.Headers["X-Requested-With"];

        if(requestedWith == "XMLHttpRequest")
        {
           // Do whatever you want when an AJAX request comes in here....
        }

        return View();
    }

Be aware that, in reality, there is no foolproof way to detect AJAX requests -- the X-Requested-With header is optionally sent by the developer or a client library, such as jQuery. So there is no guarantee this header will be sent, unless of course, you are the developer of the only client side code that will use this service. To the server, there is nothing that differentiates an AJAX request from any other kind of request.

Answer 2

As Byron Jones pointed out in the answer I needed to set the the MLHttpRequest.setRequestHeader() my self and if you follow the link you will see it's as simple as adding

oReq.setRequestHeader('X-Requested-With', 'XMLHttpRequest');

so updated my code from the question like so:

// C# needs the line:
public IActionResult Create()
    {
        ViewData["xmlHttpRequest"] = false;
        if (HttpContext.Request.Headers["X-Requested-With"] == "XMLHttpRequest") {
            ViewData["xmlHttpRequest"] = true;
        }

        return View();
    }


// and javascript like so:
function reqListener () {
  console.log(this.responseText);
}

var oReq = new XMLHttpRequest();
oReq.addEventListener("load", reqListener);
oReq.open("GET", "https://localhost:5001/Movies/Create");
oReq.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); // this is the only new line
oReq.send();

From the documentation it's stated

The XMLHttpRequest method setRequestHeader() sets the value of an HTTP request header. When using setRequestHeader(), you must call it after calling open(), but before calling send(). If this method is called several times with the same header, the values are merged into one single request header.

Follow the links for more information.

Answer 3

You didn't import extension AjaxRequestExtensions. This is why you get an error on the first line

Request.IsAjaxRequest(); // this line tells me "HttpRequest does not contain a defintion for IsAjaxRequest .. (are you missing a using directive?)"