根据博文H5调用相机和相册更换头像我们可以做到更换头像的功能,接下来补充对接图片上传接口的参考代码。
代码示例如下:
$('input[type=file]').on('change', function () {
var reader = new FileReader();
reader.onload = function (e) {
$(".pic").attr("src", reader.result)
}
reader.readAsDataURL(this.files[0])
//filses就是input[type=file]文件列表,files[0]就是第一个文件,这里就是将选择的第一个图片文件转化为base64的码
let file = $('#file')[0].files[0]
let formData = new FormData()
formData.append('file',file)
$.ajax({
type: 'POST',
url: `/${$('input:radio:checked').val()}/predict`,
data: formData,
processData: false,
contentType: false,
cache: false,
success: function(data){
$(".result").text(data.result)
},
error: function(){
},
})
})
要特别注意发送ajax请求时的一些配置。