Question

如果我通过javascript在客户端上create a dynamic bitmap，我如何通过POST或GET提交这个（然后从服务器端的位图解析出来的值？NodeJS，PHP等）

来自Making Images Byte-by-Byte in Javascript

var src = 'data:image/bmp;base64,' + myBase64EncodedData;

Answer 1

只需上传基础64数据。无论你喜欢什么，都可以在服务器端解析它。

HTML：

<form id="uploadImage" method="POST">
  <input type="hidden" name="imageData64" id="imageData64"/>
  <input type="submit" value="upload"/>
<form>

JS：

document.getElementById('uploadImage').onsubmit = function() {
  document.getElementById('imageData64').value = myBase64EncodedData;
};

或者您也可以使用ajax请求执行相同操作。

你可能不想使用GET。部分原因是它不合适，你不能从服务器中检索任何东西。但更多是因为GET对URL长度有一些限制，因此您的图像数据可能不合适。 POST没有这样的限制，因为请求可以有一个正文，与GET不同。

Answer 2

你可以使用这样的帖子..

HTML

<img src="whatever.jpg" id="myimage" />
<div id="button" data-role="button">Click on button</div>

JS

    $(function() {
        $("#button").click(function() {
              postImageData();
            });
    });

            function postImageData(){
var img = document.getElementById('myimage')
var myBase64EncodedData  = getBase64Image(img);
                $.ajax({
                    type: 'POST',
                    url: 'http://same_domain_url.com/',
                    data: { 
                        'imagedata': myBase64EncodedData 
                          },
                    success: function(msg){
                        console.log('posted' + msg);
                    }
                });
            }

PHP

 $imagedata=$_POST['imagedata'];

对于getBase64Image函数，请参阅此SO问题 Get image data in JavaScript?

如何通过POST提交Javascript生成的位图图像？

2 个答案: