.gif)
Learn how to upload CSV files to your ML model through a user-friendly web interface with our simple step-by-step guide.
Book a call with an Expert
Starting a new venture? Need to upgrade your web app? RapidDev builds application with your growth in mind.
This guide explains how to build a web interface that allows users to upload a CSV file, process it through a machine learning (ML) model, and then return predictions. The guide focuses on the technical details and integration steps rather than the basic project setup.
Develop a simple HTML page for users to upload their CSV file. The form includes an input of type="file" and a submit button. This HTML snippet demonstrates the required form structure:
.png)
.png)
// HTML form for file upload
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSV Upload</title>
</head>
<body>
<form action="/upload" method="POST" enctype="multipart/form-data">
<label for="file">Select CSV file:</label>
<input type="file" id="file" name="file" accept=".csv">
<input type="submit" value="Upload">
</form>
</body>
</html>
Below is a Python Flask example that handles the file upload, reads the CSV using pandas, and integrates with a pre-trained ML model:
import os
from flask import Flask, request, render_template_string, send\_file
import pandas as pd
import pickle
import io
app = Flask(**name**)
// Load the pre-trained ML model once when the server starts
with open('model.pkl', 'rb') as model\_file:
ml_model = pickle.load(model_file)
@app.route('/')
def index():
// Return the HTML upload form
html\_content = """
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSV Upload</title>
</head>
<body>
<form action="/upload" method="POST" enctype="multipart/form-data">
<label for="file">Select CSV file:</label>
<input type="file" id="file" name="file" accept=".csv">
<input type="submit" value="Upload">
</form>
</body>
</html>
"""
return render_template_string(html\_content)
@app.route('/upload', methods=['POST'])
def upload\_csv():
// Validate file presence
if 'file' not in request.files:
return "No file part in the request", 400
file = request.files['file']
if file.filename == '':
return "No selected file", 400
// Read the CSV file directly into a pandas DataFrame
try:
data = pd.read\_csv(file)
except Exception as e:
return f"Error processing CSV file: {e}", 400
// Optionally perform data preprocessing here if needed
// For example: handle missing values, encoding, etc.
// Assuming the CSV has columns that match the model's expected input
try:
predictions = ml\_model.predict(data)
except Exception as e:
return f"Error during prediction: {e}", 500
// Append predictions to the original DataFrame for clarity
data['Prediction'] = predictions
// Convert DataFrame to CSV in memory for download
output = io.StringIO()
data.to\_csv(output, index=False)
output.seek(0)
return send\_file(
io.BytesIO(output.getvalue().encode()),
mimetype='text/csv',
as\_attachment=True,
download\_name='predictions.csv'
)
if **name** == '**main**':
// Run the Flask application
app.run(debug=True)
This end-to-end guide demonstrates how to build a web interface for uploading CSV files and processing them with an ML model. By integrating an HTML upload form, Flask endpoints, pandas for data processing, and your ML model, you can build a seamless system that processes user data and returns predictions. Adjust and expand upon the provided code to meet the specific needs and complexities of your application.
From startups to enterprises and everything in between, see for yourself our incredible impact.
They do complex work on extremely fast timelines and effectively manage the testing and pre-launch process to deliver the best possible product. I'm extremely impressed with their execution ability.
