How to send an uploaded .CSV file to a Web service

Question

I am trying to figure out how to send a file uploaded from the UI(angular) and send it to a .NET web service for it to parse the CSV file and create a list of objects.

My current idea of how the logic should work is

File upload ---> Web Service(to parse file) --> Web API ---> Database

is this right?

What am I missing to send this file to the service and then from the service to the API Controller?

HTML:

  <input type="file" (change)="onFileSelected($event)">
                <button type="submit" (click)="onUpload"   class="button">Upload</button>

Web service:

 static void Main(string[] args)
        {

            string currentDirectory = Directory.GetCurrentDirectory();
            DirectoryInfo directory = new DirectoryInfo(currentDirectory);
            var fileName = Path.Combine(directory.FullName, "sample-data.csv");
            var fileContents = ReadMonitoredEvent(fileName);
        }

        public static string ReadFile(string fileName)
        {
            using (var reader = new StreamReader(fileName))
            {
                return reader.ReadToEnd();
            }
        }


        public static List<MonitoredEvent> ReadMonitoredEvent(string fileName)
        {
            var monitoredEventResults = new List<MonitoredEvent>();
            using (var reader = new StreamReader(fileName))
            {
                string line = "";
                reader.ReadLine();
                while ((line = reader.ReadLine()) != null)
                {
                    var monitoredEvent = new MonitoredEvent();
                    string[] values = line.Split(',');              
                    DateTime eventDate;
                    TimeSpan eventTime;
                    float tlc;
                    float totalOrder;

                    //String.Format("{Short Date}", DateTime.Now);
                    if (DateTime.TryParse(values[3], out eventDate))
                    {
                        var date = eventDate.Date;
                        monitoredEvent.EventDate = date;
                    }
                    if(TimeSpan.TryParse(values[4], out eventTime))
                    {
                        monitoredEvent.Time = eventTime;
                    }
                    if (float.TryParse(values[6], out tlc))
                    {
                        monitoredEvent.TLC = tlc;
                    }
                    if (float.TryParse(values[5], out totalOrder))
                    {
                        monitoredEvent.TotalOrder = totalOrder;
                    }
                    monitoredEvent.Venue = values[0];
                    monitoredEvent.Event = values[1];
                    monitoredEvent.Section = values[2];
                    monitoredEvent.TicketType = values[7];
                    monitoredEvent.Source = values[8];
                    monitoredEvent.TicketPage = values[9];

                    monitoredEventResults.Add(monitoredEvent);

                }
            }
            return monitoredEventResults;


        }

I don't have any code for the controller nor the typescript.

I want this file to be able to go from a user uploading it to all the objects being stored in the database.

Check this:https://stackoverflow.com/a/5283014/7124761 – Prashant Pimpale Mar 31 '19 at 05:33 — Prashant Pimpale, Mar 31 '19 at 05:33

score 0 · Answer 1 · edited Mar 31 '19 at 05:30

0

your logic is almost correct except rather than a web service we use Http Client in angular, I suggest you read a tutorial, like this

UPDATE:

here is the function to upload a file to web api the c# code is:

[HttpPost]
[Route("File/Post")]
public IHttpActionResult UploadFile()
{
   var httpRequest = HttpContext.Current.Request;
   var postedFile = httpRequest.Files["File"];
   //the parsing logic
   return Ok();
}

and the angular part is:

postFile(fileToUpload: File) {
   const formData: FormData = new FormData();
   const tmpUrl=myUrl+"File/Post";
   formData.append("File", fileToUpload, fileToUpload.name);
   return this.http.post(tmpUrl, formData).pipe();
}

I simplified it but that's enough to get you going

edited Mar 31 '19 at 05:30

Prashant Pimpale

10,349
9
44
84

answered Mar 30 '19 at 10:12

Ehsan Kiani

3,050
1
17
19

Ok so when I upload the file, do I do the parsing client side or server side? I don't know exactly where to put the data parse file at. You upload the file, create the HTTP post request, then what? – BobbyWidThaTool Mar 31 '19 at 02:42
For example you have a model that represents a table in db you have a model class in client side and another one in a c# web API you send an instance of the model through the post method, and in server side you parse it. and insert it to database. this way you don't need to do the serialization or parsing manually – Ehsan Kiani Mar 31 '19 at 03:40
Right, I have a model in my web api with a bunch of properties, but if the CSV file is being sent via a POST method, wouldn't the model client side not be relevant since the data has not been parsed out the file yet? – BobbyWidThaTool Mar 31 '19 at 04:31
Sorry I forget about CSV format,In opinion you can send csv as plain text and then send it to server or if it's too large you can send the file via post method, anyway I think the parsing should be done server side. – Ehsan Kiani Mar 31 '19 at 04:38
I shouldn't put my parsing code in the API controller though right? If I'm doing an HTTP POST method, how do I send the file to the Web Service if it's trying to post to the API? – BobbyWidThaTool Mar 31 '19 at 04:47
I'm using .NET web api 2.2 the controller syntax doesn't work at all, I tried implementing the function and I am getting errors still. – BobbyWidThaTool Mar 31 '19 at 07:53
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/190977/discussion-between-ehsan-kiani-and-bobbywidthatool). – Ehsan Kiani Mar 31 '19 at 08:41

How to send an uploaded .CSV file to a Web service

1 Answers1