.gif)
Build a Flask app with real-time ML insights. Our step-by-step guide helps you integrate live feedback for dynamic predictions.
Book a call with an Expert
Starting a new venture? Need to upgrade your web app? RapidDev builds application with your growth in mind.
.png)
.png)
model.pkl (if using scikit-learn) or a similar file. We will load it when the Flask app starts so that predictions are available for any request.
// Import libraries for Flask and ML model handling
from flask import Flask, request, jsonify, render\_template
import pickle // To load a pickled model
import numpy as np // For handling numerical data
// Initialize Flask application
app = Flask(**name**)
// Load the pre-trained ML model (for example, scikit-learn model)
with open("model.pkl", "rb") as file:
model = pickle.load(file)
// Import and initialize Flask-SocketIO
from flask\_socketio import SocketIO, emit
socketio = SocketIO(app)
// Define a route that renders the main page with SocketIO client code
@app.route("/")
def index():
return render\_template("index.html") // This HTML file must connect to the SocketIO server
// Define a route for making predictions via HTTP POST (optional if using SocketIO only)
@app.route("/predict", methods=["POST"])
def predict():
data = request.get\_json() // Accepts JSON input from the client
// Assume the input is in the key 'input\_data'
input_data = np.array(data["input_data"]).reshape(1, -1)
prediction = model.predict(input\_data)
// Send response back
return jsonify({"prediction": prediction.tolist()})
// Define a SocketIO event for real time predictions
@socketio.on("request\_prediction")
def handle_prediction(json_data):
// json_data is expected to have user input details in 'input_data'
input_data = np.array(json_data["input\_data"]).reshape(1, -1)
prediction = model.predict(input\_data)
// Emit the prediction back to the client in real time
emit("prediction\_response", {"prediction": prediction.tolist()})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Real-Time ML Feedback</title>
// Include Socket.IO client script (from a CDN)
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.0/socket.io.js"></script>
</head>
<body>
<h2>Invoke ML Prediction in Real-Time</h2>
<div id="result"></div>
<input type="text" id="userInput" placeholder="Enter data (comma separated)" />
<button onclick="sendData()">Submit</button>
<script type="text/javascript">
// Connect to the SocketIO server
var socket = io();
// Function to send user input for prediction
function sendData() {
var inputText = document.getElementById("userInput").value;
// Convert comma-separated input into an array of numbers
var inputData = inputText.split(",").map(Number);
// Emit the prediction request event to the server
socket.emit("request_prediction", {"input_data": inputData});
}
// Listen for prediction response from the server
socket.on("prediction\_response", function(data) {
// Display the prediction result in div#result
document.getElementById("result").innerHTML = "Prediction: " + data.prediction;
});
</script>
</body>
</html>
if **name** == "**main**":
// Use socketio.run instead of app.run to start the server
socketio.run(app, debug=True)
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.
