Home > Back-end >  C# & ASP.NET Core MVC : web scraper ajax sends null to controller
C# & ASP.NET Core MVC : web scraper ajax sends null to controller

Time:08-31

I'm trying to implement a simple screen scraper program in C#. When I run the application, and type in a url into the input box and click on the submit button, I execute some jQuery to use Ajax to send the url entered to the controller. For some reason, the controller is always receiving null.

This is the code in my view:

 <div id="message"></div>
 <input id="urlInput" type="text" placeholder="Enter URL" />
 <button id="submit">Submit</button> 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
 <script>
    $(document).ready(function () {

    $("#submit").click(function (e) {
        var urlValue = $("#urlInput").val();
        console.log(urlValue);
        $.ajax({
                type: "POST",
                url: "/Home/GetUrlSource",
                contentType: "application/json; charset=utf-8",
                data: '{"url":"'   urlValue   '"}',
                dataType: "html",
                success: function (result, status, xhr) {
                    ExtractData(result);
                    //GetUrlTelePhone(result);
                },
                error: function (xhr, status, error) {
                    $("#message").html("Result: "   status   " "   error   " "   xhr.status   " "   xhr.statusText)
                }
            });
    });
 </script>

When I run the application, the view is presented. In the input box, I type in the following:

https://www.zillow.com/homes/90-westwood-circle-roslyn-heights-ny-11577

When I click on the submit button, and I look at the browser console, I see the url so I know that the url value is valid when the console.log instruction executes.

This is the code in the controller:

[HttpPost]
public string GetUrlSource(string url)
{
    url = url.Substring(0, 4) != "http" ? "http://"   url : url;
    string htmlCode = "";

    using (WebClient client = new WebClient())
    {
        try
        {
            htmlCode = client.DownloadString(url);
        }
        catch (Exception ex)
        {
        }
    }

    return htmlCode;
}

I have a breakpoint set at the first line of code in GetUrlSource and when I watch the variable url, it has a null value.

Any ideas why this is happening? I am running Visual Studio 2019 on a mac. The application is a .NET Core application.

Thanks in advance.

CodePudding user response:

Try the following:

 $("#submit").click(function (e) {
            var urlValue = $("#urlInput").val();
            console.log(urlValue);

            $.ajax({
                type: "POST",
                url: "/Home/GetUrlSource",
                data: { url: urlValue },
                dataType: "html",
                success: function (result, status, xhr) {
                    ExtractData(result);
                    //GetUrlTelePhone(result);
                },
                error: function (xhr, status, error) {
                    $("#message").html("Result: "   status   " "   error   " "   xhr.status   " "   xhr.statusText)
                }
            });
        });

There are two fixes in the code above:

  1. data: { url: urlValue },
  2. Removing contentType: "application/json; charset=utf-8", to use the default value. The default is: enter image description here

  • Related