У меня есть веб-приложение, которое делает снимок с помощью веб-камеры и отправляет его на флеш-сервер, работающий на том же компьютере.
Я попытался отправить dataURL с помощью ajax, а затем декодировать base64 на моем сервере.
@test_function.route('/test',methods=["POST", "GET"])
def test():
json_data_from_request = request.get_json()
image_data = json_data_from_request['imageData']
image_data = re.sub('^data:image/.+;base64,', '', json_data_from_request['imageData']).decode('base64')
image = Image.open(StringIO(image_data))
image_data.save(secure_filename(image_data.filename))
return "received message"
function takepicture() {
var context = canvas.getContext('2d');
if (width && height) {
canvas.width = width;
canvas.height = height;
context.drawImage(video, 0, 0, width, height);
var data = canvas.toDataURL('image/png');
photo.setAttribute('src', data);
$.ajax({
url: 'http://127.0.0.1:5000/test',
type: 'post',
contentType: 'application/json',
data: {"imageData":data},
success: function(response){
console.log(response);
}
});
Я вижу одно «ОПЦИИ» - 200 и одно «POST» - 400 сообщение на моем сервере. Для целей тестирования я хочу сохранить указанное изображение в папке сервера.
В конечном итоге я хочу отправить изображение в другой класс для обработки, возможно, в виде последовательности байтов?
ОБНОВЛЕНИЕ: Я понял это и поэтому решил добавить рабочий код, на случай, если кому-то так неопытно, как мне, понадобится в будущем.
def test():
json_data_from_request = request.get_json()
img=json_data_from_request['data']
base64result = img.split(',')[1]
print(base64result)
imgdata = base64.b64decode(str(base64result))
image = Image.open(io.BytesIO(imgdata))
plt.imshow(image)
plt.show()
return "received message"
var data = canvas.toDataURL('image/png');
photo.setAttribute('src', data);
var data_to_send={'data':data};
$.ajax({
url: 'http://127.0.0.1:5000/test',
type: 'post',
contentType: 'application/json',
dataType:'json',
data: JSON.stringify(data_to_send),
success: function(response){
console.log(response);
}
});