Sending captured image from front-end to flask back-end

Viewed 42

I am trying to capture an image from webcam and send it to backend flask server. I captured the image successfully but am having trouble to send it to the backend.

HTML

        <form method="POST" enctype="multipart/form-data" id="myForm" >
            <table>
                <tr>
                    <td><input type="button" value="Upload" onclick="upload()"></td>
                </tr>
            </table>
        </form>
        <div id="my_camera"></div>
        <input type="button" onclick="snap()" value="Snap">
        <div id="results"></div>

JS

function snap() {
    Webcam.snap( function(data_uri) {
        // display results in page
        document.getElementById('results').innerHTML = 
        '<img id="image" src="'+data_uri+'"/>';
      } );      
}

This basically gives me the image in the image field the created div. So how can I send it to the backend. I thought if there was any way to change file in file type input like we can modify contents in other field using document.innerHTML(). But I don't think it doesn't work that way. What logic can I implement in upload(). Is there an alternative? Thanks!

0 Answers
Related