Search code examples
asp.net-mvcajaxjsonstreamredirectstandardoutput

Streaming Standard Output of a console application to an ASP.NET MVC View


What I am looking to do is:

1) From an MVC View, Start a long running Process. In my case, this process is a seperate Console Application being executed. The Console Application runs for potentially 30 minutes and regurlarily Console.Write's its current actions.

2) Back on the MVC View, periodically poll the server to retrieve the latest Standard Out which I have redirected to a Stream (or anywhere I can get access to it for that matter). I'll append newly retieved standard output to a log textbox or something equivalent.

Sounds relativly easy. My client side programming is a bit rusty though and I'm having issues with the actual streaming. I would assume this is not an uncommon task. Anyone got a decent solution for it in ASP.NET MVC?

Biggest issue seems to be that I cant get the StandardOutput until the end of execution, but I was able to get it with an event handler. Of course, using the event handler seems to lose focus of my output.

This is what I was working with so far...

    public ActionResult ProcessImport()
    {
        // Get the file path of your Application (exe)
        var importApplicationFilePath = ConfigurationManager.AppSettings["ImportApplicationFilePath"];

        var info = new ProcessStartInfo
        {
            FileName = importApplicationFilePath,
            RedirectStandardError = true,
            RedirectStandardInput = true,
            RedirectStandardOutput = true,
            CreateNoWindow = true,
            WindowStyle =  ProcessWindowStyle.Hidden,
            UseShellExecute = false
        };

        _process = Process.Start(info);
        _process.BeginOutputReadLine();

        _process.OutputDataReceived += new DataReceivedEventHandler(_process_OutputDataReceived);

        _process.WaitForExit(1);

        Session["pid"] = _process.Id;

        return Json(new { success = true }, JsonRequestBehavior.AllowGet);
    }

    void _process_OutputDataReceived(object sender, DataReceivedEventArgs e)
    {
        _importStandardOutputBuilder.Insert(0, e.Data);
    }

    public ActionResult Update()
    {
        //var pid = (int)Session["pid"];
        //_process = Process.GetProcessById(pid);

        var newOutput = _importStandardOutputBuilder.ToString();
        _importStandardOutputBuilder.Clear();

        //return View("Index", new { Text = _process.StandardOutput.ReadToEnd() });
        return Json(new { output = newOutput }, "text/html");
    }

I haven't written the client code yet as I am just hitting the URL to test the Actions, but I'm also interested how you would approach polling for this text. If you could provide the actual code for this too, it would be great. I would assume you'd have a js loop running after kicking off the process that would use ajax calls to the server which returns JSON results... but again, its not my forte so would love to see how its done.

Thanks!


Solution

  • Right, so from the couple of suggestions I received and a lot of trial and error I have come up with a work in progress solution and thought I should share with you all. There are definitely potential issues with it at the moment, as it relies on static variables shared across the website, but for my requirement it does the job well. Here goes!

    Let's start off with my view. We start off by binding the click event of my button with some jquery which does a post to /Upload/ProcessImport (Upload being my MVC Controller and ProcessImport being my MVC Action). Process Import kicks off my process which I will detail below. The js then waits a short time (using setTimeout) before calling the js function getMessages.

    So getMessages gets called after the button is clicked and it does a post to /Upload/Update (my Update action). The Update action basically retrieves the status of the Process and returns it as well as the StandardOutput since last time Update was called. getMessages will then parse the JSON result and append the StandardOutput to a list in my view. I also try to scroll to the bottom of the list, but that doesn't work perfectly. Finally, getMessages checks whether the process has finished, and if it hasn't it will recursivly call itself every second until it has.

    <script type="text/javascript">
    
        function getMessages() {
    
            $.post("/Upload/Update", null, function (data, s) {
    
                if (data) {
                    var obj = jQuery.parseJSON(data);
    
                    $("#processOutputList").append('<li>' + obj.message + '</li>');
                    $('#processOutputList').animate({
                        scrollTop: $('#processOutputList').get(0).scrollHeight
                    }, 500);
                }
    
                // Recurivly call itself until process finishes
                if (!obj.processExited) {
                    setTimeout(function () {
                        getMessages();
                    }, 1000)
                }
            });
        }
    
        $(document).ready(function () {
    
            // bind importButton click to run import and then poll for messages
            $('#importButton').bind('click', function () {
                // Call ProcessImport
                $.post("/Upload/ProcessImport", {}, function () { });
    
                // TODO: disable inputs
    
                // Run's getMessages after waiting the specified time
                setTimeout(function () {
                    getMessages();
                }, 500)
            });
    
        });
    
    </script>
    
    <h2>Upload</h2>
    
    <p style="padding: 20px;">
        Description of the upload process and any warnings or important information here.
    </p>
    
    <div style="padding: 20px;">
    
        <div id="importButton" class="qq-upload-button">Process files</div>
    
        <div id="processOutput">
            <ul id="processOutputList" 
                style="list-style-type: none; margin: 20px 0px 10px 0px; max-height: 500px; min-height: 500px; overflow: auto;">
            </ul>
        </div>
    
    </div>
    

    The Controller. I chose not to go with an AsyncController, mainly because I found I didn't need to. My original issue was piping the StdOut of my Console application to the view. I found couldn't ReadToEnd of the standard out, so instead hooked the event handler ProcessOutputDataReceived up which gets fired when standard out data is recieved and then using a StringBuilder, append the output to previously received output. The issue with this approach was that the Controller gets reinstantiated every post and to overcome this I decided to make the Process and the StringBuilder static for the application. This allows me to then receive a call to the Update Action, grab the static StringBuilder and effectivly flush its contents back to my view. I also send back to the view a boolean indicating whether the process has exited or not, so that the view can stop polling when it knows this. Also, being static I tried to ensure that if an import in in progress, don't allow other's to begin.

    public class UploadController : Controller
    {
        private static Process _process;
        private static StringBuilder _importStandardOutputBuilder;
    
        public UploadController()
        {
            if(_importStandardOutputBuilder == null)
                _importStandardOutputBuilder = new StringBuilder();
        }
    
        public ActionResult Index()
        {
            ViewData["Title"] = "Upload";
            return View("UploadView");
        }
    
        //[HttpPost]
        public ActionResult ProcessImport()
        {
            // Validate that process is not running
            if (_process != null && !_process.HasExited)
                return Json(new { success = false, message = "An Import Process is already in progress. Only one Import can occur at any one time." }, "text/html");
    
            // Get the file path of your Application (exe)
            var importApplicationFilePath = ConfigurationManager.AppSettings["ImportApplicationFilePath"];
    
            var info = new ProcessStartInfo
            {
                FileName = importApplicationFilePath,
                RedirectStandardError = true,
                RedirectStandardInput = true,
                RedirectStandardOutput = true,
                CreateNoWindow = true,
                WindowStyle =  ProcessWindowStyle.Hidden,
                UseShellExecute = false
            };
    
            _process = Process.Start(info);
            _process.BeginOutputReadLine();
            _process.OutputDataReceived += ProcessOutputDataReceived;
            _process.WaitForExit(1);
    
            return Json(new { success = true }, JsonRequestBehavior.AllowGet);
        }
    
        static void ProcessOutputDataReceived(object sender, DataReceivedEventArgs e)
        {
            _importStandardOutputBuilder.Append(String.Format("{0}{1}", e.Data, "</br>"));
        }
    
        public ActionResult Update()
        {
            var newOutput = _importStandardOutputBuilder.ToString();
            _importStandardOutputBuilder.Clear();
            return Json(new { message = newOutput, processExited = _process.HasExited }, "text/html");
        }
    }
    

    Well, that's it so far. It works. It still needs work, so hopefully I'll update this solution when I perfect mine. What are your thoughts on the static approach (assuming the business rule is that only one import can occur at any one time)?