Как сохранить элемент canvas как изображение на сервере flask с помощью ajax - PullRequest
0 голосов
/ 02 апреля 2020

Я пытаюсь отправить элемент canvas в виде файла изображения на мой Flask сервер для сохранения. Кроме того, я хочу, чтобы пользователь мог вводить имя файла изображения.

Я планирую использовать ajax для ввода и изображения и отправить запрос на публикацию и получить изображение в Flask, а затем мне придется декодировать изображение с помощью OpenCV для обработки.

Я бы не хотел отправлять с ToDataURL. Я пробовал, и кажется, что он съел много данных, а также трудно конвертировать в формат OpenCV.

У меня нормально работает ввод, мне просто нужен эффективный способ отправки данных на Flask для OpenCV.

JS:

function imagedata() {
let imageCanvas = document.createElement('canvas');
let imageCtx = imageCanvas.getContext("2d");
imageCanvas.width = 800;
imageCanvas.height = 800;
imageCtx.drawImage(v, 0, 0, v.videoWidth, v.videoHeight);
//var imgURL = imageCanvas.toDataURL();
imageCanvas.toBlob(saveimage, 'image/jpeg');
}
function saveimage(file) {
  let formdata = new FormData();
  formdata.append("image", file);
  return formdata;
 }
var image = imagedata();

$(document).ready(function() {


$('form').on('submit', function(event) {

    $.ajax({
        data : {
            part : $('#myInput').val(),
            image: image
    },
        type : 'POST',
        url : 'http://servername/correctid'
    })
    .done(function(data) {
        if (data.error) {
            $('#errorAlert').text(data.error).show();
            $('#successAlert').hide();
            errortext();
        }   

        else {
            correctid();
            $('#successAlert').text(data.name).show();
            $('#errorAlert').hide();
            setTimeout(() => {  $('#successAlert').hide(); }, 2000);

        }

       });
    event.preventDefault();

   });

   });

Flask:

'''ignore partlist'''

            @app.route('/correctid',methods=['POST'])
        def correctid():
            partlist = ['7097147C91', 'CMI2520185C1', '735423C91', '749763C91', '735426C91', '735350C91', '735422C91', '735383C91', '735349C91', '735465C91', '735384C91', '735464C91', '735094C91', '735425C91', '1813859C91', '1822351C91', '735424C91', '735387C91', '1823935C91', '749039C91', '735194C91', '1822349C91', '991612C91', '1823761RX91', '1823757RX91', '1823763RX91', '1823759RX91', '1820838RX91', '1823763C91', '991610C91', '1823759C91', '1823757C91', '1824779RX91', '1823937RX91', '1820844RX91', '1820834RX91', '1820834C91', '1820890RX91', '1815409C91', '735349C92', 'ZGA1823761RX91', '991838C91', '5010889R91', '1883111C92', '4307381R91', '1883111C91', '1899239C92', '5010666R91', '1873422C92', '1873422C93', '5010715R91', '5010561R93', '5010657R92', '1878285C91', '5010983R91', '5010717R91', '5010656R92', '1848718C92', '5010986R91', '5010823R91', '1884057C91', '1878282C92', '5010658R92', '1848721C92', '1890055C92', '5010984R91', '1842576C93', '1884057C92', '5010561R91', '5010561R92', '1848492C91', '5010657R91', '1842577C93', '5010659R92', '1842578C91', '1848489C91', '1890057C92', '1848489C92', '1848492C92', '5010985R91', '5010656R91', '1878282C91', '1842578C94', '1878281C91', '1890055C91', '4307212R92', '1842579C91', '1842579C94', '1848495C91', '1890057C91', '1842576C94', '4307212R91', '1894556C93', '1848495C92', '5010658R91', '1846692C2', '1842577C94', 'IMBR5010983R91', '1845150C92', '2602498C91', '1843089C91', '7092408C91', 'IMBR5228790', 'R414703002', '2590898C1', '2590897C1', '2590901C1', '2588740C1', '2588747C1', '2588735C1', 'IMBR5228900', '2588741C1', 'IMBR5237650', '2593595C92', 'FLTFI2593595', '2593597C92', '1831487C93', '2593594C92', '2593592C92', 'FLTFI1831487', '2593595C91', 'FLTFI2593597', 'FLTFI2593594', '2593597C91', 'FLTFI2593592', '2593596C92', '1824583C98', '1822801C99', '2593592C91', 'FLTFI2593596', '1833646C92', '2593591C92', '2593588C92', '2593594C91', '2593593C92', '2593588C91', 'FLTFI2593591', 'FLTFI2593588', 'FLTFI1824583', 'FLTFI1822801', '1831487C91', '1830560C2', '1830572C93', '2593590C91', '5010741R91', 'FLTFI1833646', 'FLTFI2593590', '2593589C91', 'FLTFI2593593', 'FLTFI2593589', '2593596C91', '1829837C3', '2593593C91', '2593591C91', '2593589C92', '1833647C91', 'FLTFI5010741', '1830561C93', '2602118C91', 'IMBR2593592C91BE', '5010732R92', '3007640C93', '3005556C91', '2612566C91', '2517613C91', '3014431C91', '3005555C91', '3007640C92', '2612567C91', '3007639C92'];
            name = request.form['part']
            image = request.form['image'].read()
            if name in partlist:
                decoded = cv2.imdecode(np.frombuffer(image, np.uint8), -1)
                cv2.imwrite(os.path.join(PATH_TO_TEST_IMAGES_DIR ,str(name) + '_' + str(time.time()) + '.jpg'), decoded )
                return jsonify({'name' : str(name) +' saved'})

            return jsonify({'error' : 'Incorrect ID'})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...