locked
Web worker: Unable to get posted model data in controller action by using Web worker RRS feed

  • Question

  • User842257015 posted

    Hi,

    Am using ASP.Net MVC application and we have parted some logic in the background by using Web Worker.

    In worker block trying to call Controller action method by using Ajax Post call, we able to access the mentioned method but model value got null.

    Model

    public class Employee
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }

    Controller

    [HttpPost]
    public ActionResult Worker(Employee model) // got null for all property 
    {
      return Json(model);
    }

    Worker.js

    self.addEventListener('message', function (e) {
    	var employee = {
            Id: 11,
            Name: 'AAAAAAAA'       
        };
        
        fetch(employee, function (xhr) {
            console.log(xhr);
            var result = xhr;
            //process the JSON
            //var object = JSON.parse(result);
            //set a timeout just to add some latency
            setTimeout(function () { sendback(); }, 2000);
            //pass JSON object back as string
            function sendback() {
                self.postMessage(result);
            }
        });
    
    }, false);
    
    
    //simple XHR request in pure raw JavaScript
    function fetch(data, callback) {
        
        var xhr = new XMLHttpRequest();
        xhr.open("POST", '/Home/Worker');
        //Send the proper header information along with the request
        xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
        xhr.onreadystatechange = function () {//Call a function when the state changes.
            if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
                // Request finished. Do processing here.
                callback(xhr.response);
            }
        };	
        xhr.send(data);
    }
    

    Would you please let me know where I missed any.

    Thanks

    Thursday, September 20, 2018 4:12 AM

Answers

  • User1724605321 posted

    Hi jayakumarvinayagam,

    Please try to parse JSON like :

      function fetch(data, callback) {
    
                var xhr = new XMLHttpRequest();
                xhr.open("POST", '/Home/Worker');
                //Send the proper header information along with the request
                xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
                xhr.onreadystatechange = function () {//Call a function when the state changes.
                    if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
                        // Request finished. Do processing here.
                        callback(xhr.response);
                    }
                };
                xhr.send(JSON.stringify(data));
            }

    Then you could get values in your backend :

            public ActionResult Worker(Employee model)
            {
                return Json(model);
            }

    Best Regards,

    Nan Yu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, September 20, 2018 5:28 AM

All replies

  • User1724605321 posted

    Hi jayakumarvinayagam,

    Please try to parse JSON like :

      function fetch(data, callback) {
    
                var xhr = new XMLHttpRequest();
                xhr.open("POST", '/Home/Worker');
                //Send the proper header information along with the request
                xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
                xhr.onreadystatechange = function () {//Call a function when the state changes.
                    if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
                        // Request finished. Do processing here.
                        callback(xhr.response);
                    }
                };
                xhr.send(JSON.stringify(data));
            }

    Then you could get values in your backend :

            public ActionResult Worker(Employee model)
            {
                return Json(model);
            }

    Best Regards,

    Nan Yu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, September 20, 2018 5:28 AM
  • User842257015 posted

    Thanks, Nan Yu, able to get the posted data in action, and I hope it accepts JSON array too.

    Thursday, September 20, 2018 7:08 AM