用ajax获取一张图片,Python 实现AJAX获取图片

import PIL.Image as Image

import matplotlib.pyplot as plt

from scipy.misc import imread,imsave

import base64

from io import BytesIO

import os

# 图片路径

base_path = os.path.join(

os.path.abspath(os.path.join(os.path.dirname(os.path.dirname(os.path.realpath(__file__))), "../")),

'static/img/auto_logo/timg.jpg')

# 作为一个暂时保存图片的路径

new_path = os.path.join(

os.path.abspath(os.path.join(os.path.dirname(os.path.dirname(os.path.realpath(__file__))), "../")),

'static/img/auto_logo/new.jpg')

# 使用scipy.misc.image读取图片，array1是一个ndarray

array1 = imread(base_path)

# 保存到暂存区 其实可以省略，直接打开

plt.imsave(new_path,array1)

# 打开暂存区图片

photo = Image.open(new_path)

# 生成对象

output_buffer1 = BytesIO()

photo.save(output_buffer1,format='PNG')

f1 = output_buffer1.getvalue()

b64 = base64.b64encode(f1)

ret = {'label': label, 'word_cloud': 'data:image/png;base64,' + bytes.decode(b64)}

return ret

前端代码

html

$.ajax({

url: "{{ url_for('all_impress.get_WordCloud') }}",

type: 'POST',

data: {

brand_ids: $('#selBrand').val(),

type_ids: $('#selProdType').val().join(','),

date_range: $('#reservation').val(),

logo:$('#select2-s-container').html()

},

success: function (data) {

$("#tabs").html('');

$("#tabcontents").html('');

var class_active = '';

for (var i = 0; i < data.length; i++) {

if (i == 0) {

class_active = 'active'

} else {

class_active = '';

}

$("#tabs").append('

' + data[i].label + '');

$("#tabcontents").append('

\

\

\

');

// 注意：需要动态添加src属性

$("#imgWordCloud" + i).attr('src', data[i].word_cloud);

}

}

});