Search code examples
pythonphpformsauthenticationartificial-intelligence

Operating on photo retrieved from php page using python

I want to make pseudo-verification api in python that works with images(ID of a worker). It is supposed to be based on certain patterns in image like(circles squares etc. like in snapchat famous system). How do i run python script whenever image is sent from user using normal html input file form? I mean like user sends photo to server, it runs script in python and gives verdict? Thanks in advance.

I tried looking up problem on the internet. I didn't find any solutions. It seems like it's really expensive operation and probably suboptimatl, but neverthelles I want to do it that way.

Solution

  • You can create that solution, using a combination of PHP+Python, there are several libraries that can operate images to get to a desired result, in case of employee ID verification, the python script should be capable of recognizing what is looking at, for this example let's there is a colleague in the company and a camera device or similar takes a picture of the ID:

    Client side application will require constant read of the camera or a picture, here is the code for a camera and a local saved picture:

    Python Bar code reader: (Involving Numpy is a good idea to enhance the cv2 bar code recognition)

    ##import cv2
##img = cv2.imread('/home/jbsidis/Pictures/sofiaID.png')
##
##barcode_detector = cv2.barcode_BarcodeDetector()
##
### 'retval' is boolean mentioning whether barcode has been detected or not
##retval, points, _ = barcode_detector.detectAndDecode(img)
##
### copy of original image
##img2 = img.copy()
##
### proceed further only if at least one barcode is detected:
##if retval:
##    points = points.astype(np.int)
##    for i, point in enumerate(points):
##        img2 = cv2.drawContours(img2,[point],0,(0, 255, 0),2)
##
##
##print(retval,points,barcode_detector.detectAndDecode(img))

import sys
import cv2
import time
camera = cv2.VideoCapture(0)
if (camera.isOpened() == False):
    print("Can not open camera #0.")
    sys.exit(0)
print("Camera ready")
doAgain = True
while doAgain:
    ret, image = camera.read()
    if ret:
        qrCodeDetector = cv2.QRCodeDetector()
        text, points, _ = qrCodeDetector.detectAndDecode(image)
        if points is not None:
            print(text)
            cv2.imwrite("./result.jpg",image)
        else:
            print("QR code not detected")
        cv2.imshow("Image", image)
        key = cv2.waitKey(1) & 0xFF
        if key == 27:
            cv2.destroyAllWindows()
            doAgain = False
camera.release()

    Server side application (PHP):

    <?php
//server side for the python process
$target_dir = "uploads/"; //add a directory where to save the file in the server
//this receives the data from the HTML form
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $file = $_FILES["picture"];
    if ($file["type"] != "image/jpeg" && $file["type"] != "image/png" && $file["type"] != "image/gif") {
        echo "This file is not allowed! IMages only please";
        exit();
    }
    if ($file["size"] > 1000000) {
        echo "Error: File size is too large.";
        exit();
    }
    // here we are guessing that you have storage in your server or php server
    $filename = basename($file["name"]);
    $target_path = $target_dir . $filename;
    move_uploaded_file($file["tmp_name"], $target_path);

    echo "THanks for uploading the image, Barcode is being recognized!";
} else {
    echo "No file was uploaded. Try again please";
}
if (move_uploaded_file($file["tmp_name"], $target_path)) {
    // this will run the script the python script we created, you have to modify to if this will read the png or the image file or a camera, in this case it must be the camera 
    $python_script = "python /securepathtothescriptorsomeonecouldfindit/to/your/python/script.py " . $target_path;
    $output = shell_exec($python_script);
    echo "Barcode generated successfully!";
} else {
    echo "There was an error processing your image, please contact support";
}
?>

    Client side (The user who is visiting your website or webapp):

    <!DOCTYPE html>
<html>
<head>
    <title>User will upload Picture</title>
    <style>
        .card {width: 900px;background-color: #f9f9f9;border: 1px solid #ddd;border-radius: 10px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);padding: 20px;margin: 40px auto;}
    </style>
</head>
<body>
    <div class="card">
        <h2>Upload Picture</h2>
        <form action="action.php" method="post" enctype="multipart/form-data">
            <input type="file" name="picture" accept="image/*">
            <button type="submit">Upload</button>
        </form>
        <div id="image-preview"></div>
    </div>

    <script>
        
        const fileInput = document.querySelector('input[type="file"]');

        
        fileInput.addEventListener('change', (event) => {
            const file = event.target.files[0];
            const reader = new FileReader();

            reader.onload = (event) => {
                const imageDataUrl = event.target.result;

                
                document.getElementById('image-preview').innerHTML = `<img src="${imageDataUrl}" alt="Uploaded Image width=200 height=550">`;
            };

            reader.readAsDataURL(file);
        });
    </script>
    </div>
</body>
</html>

    Result: enter image description here

    To test this, you can install XAMPP or a similar tool to locally run a PHP server and test it offline without cloud or you can use a public hosting compatible with PHP and test it.