使用jquery使用POST服务调用从图像标记<img/>保存图像

时间:2016-10-09 04:55:32

标签: javascript jquery html image post

我试图从图片标签中保存图片

我尝试过像文件上传方法

但它不起作用,

 var request = new XMLHttpRequest();
        var imageUrl = info.ImageUri + '/Upload?imagePath=' + imagePath + '&imageName=' + imagename + '&imageSize=' + imagesize;
        var imageFileUri;
        request.open('POST', imageUrl);
        request.send(imgFile.files[0]);
        request.onreadystatechange = function () {
            if (request.readyState == 4) {
                if (request.status == 200) {

有没有办法保存已经在图片标签中显示的图片?

2 个答案:

答案 0 :(得分:2)

您可以从图像中获取base64字符串。

HTML:

<img src="http://some/image/source" id="myImage"/>
<canvas id="myCanvas" style="display:none;"/>

JS:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("myImage");
ctx.drawImage(img, 10, 10);
var imgString = c.toDataURL();
$.ajax({
    type: "POST",
    dataType: "JSON",
    data: {
       imageString: imgString
    }
    url: "/route/to/store/my/image",
    success: function (data) {
        alert('success');
    }
});

并在服务器端从base64字符串生成图像并使用文件名存储它。 :)

答案 1 :(得分:0)

此代码是我之前写的jquery ui插件的一部分。需要jquery,

requestLayout()