Last active
October 31, 2021 14:47
-
-
Save VGabby/aa0d04c05e9b5fda52f85b244d67cd5f to your computer and use it in GitHub Desktop.
post image to AI backend _ fastapi
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | |
| <script> | |
| let base64String | |
| let data = new FormData() | |
| let url = "http://13.212.36.151:8013/api/stream_predict" | |
| $(document).ready(function () { | |
| // Check for the File API support. | |
| if (window.File && window.FileReader && window.FileList && window.Blob) { | |
| document.getElementById('files').addEventListener('change', handleFileSelect, false); | |
| } else { | |
| alert('The File APIs are not fully supported in this browser.'); | |
| } | |
| let base64String | |
| function handleFileSelect(evt) { | |
| var f = evt.target.files[0]; // FileList object | |
| var reader = new FileReader(); | |
| // Closure to capture the file information. | |
| reader.onload = (function (theFile) { | |
| return function (e) { | |
| var binaryData = e.target.result; | |
| //Converting Binary Data to base 64 | |
| base64String = window.btoa(binaryData); | |
| //showing file converted to base64 | |
| document.getElementById('base64').value = base64String; | |
| alert('File converted to base64 successfuly!\nCheck in Textarea'); | |
| data.append("image", base64String) | |
| data.append("filename", "kut.jav") | |
| }; | |
| })(f); | |
| // Read in the image file as a data URL. | |
| reader.readAsBinaryString(f); | |
| } | |
| $("button").click(function () { | |
| var el = document.getElementById('debug') | |
| el.innerText = "Check Debug console and network" | |
| console.log("POSTING") | |
| $.ajax({ | |
| method: "POST", | |
| url: url, | |
| data: data, | |
| enctype: 'multipart/form-data', | |
| // contentType: 'application/x-www-form-urlencoded; charset=UTF-8', | |
| // contentType: 'application/json', | |
| contentType: false, | |
| processData: false, | |
| crossDomain: true, | |
| success: function (json) { | |
| console.log('message: ' + "success" + JSON.stringify(json)); | |
| }, | |
| error: function (error) { | |
| console.log('message Error' + JSON.stringify(error)); | |
| }, | |
| }); | |
| }); | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <input type="file" id="files" name="files" /> | |
| <br /> | |
| <textarea id="base64" rows="5"></textarea> | |
| <br /> | |
| <button>AI process</button> | |
| <p id="debug">This is content</p> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment