博主最近碰到几个朋友遇到图片上传的问题 周末在家没事干 就写了一个demo

其实原理很简单 用插件裁完图的数据是base64数据 post 到后台 保存为文件
router.post('/upload', function(req, res){
//接收前台POST过来的base64
var imgData = req.body.imgData;
//过滤data:URL
var base64Data = imgData.replace(/^data:image\/\w+;base64,/, "");
var dataBuffer = new Buffer(base64Data, 'base64');
var url=path.join('./', 'public')+"/out.png";
fs.writeFile(url, dataBuffer, function(err) {
if(err){
res.send({meta: {code: 1, message: '请求失败'}, data:''});
}else {
res.send({meta: {code: 0, message: '通讯成功'}, data: {image: "out.png"}}) ;
}
});
});前端请求代码
$('#btnCrop').on('click', function(){
var img = cropper.getDataURL();
$.ajax({
type: "post",
url: "/upload/",
data: {imgData:img},
success: function (result) {
var code=result.meta.code
if(code==1)
{
alert('保存失败')
}
else
{
$('.cropped').append('<img src="'+result.data.image+'">');
alert('保存成功')
}
}
});
})本实例代码 http://git.oschina.net/niefengjun/niefengjundemo
以后小聂的demo 都会放到这个项目里 大家有问题 可以给我提问哈
你打算打赏多少钱呢?
(微信扫一扫)