如何保存网络服务返回的图像？

Question

我有一个 Web 服务调用将返回一个图像，现在我想将此图像保存到服务器中的文件系统中。

问题是，我无法从服务器进行 Web 服务调用，因为 Web 服务应用程序在每个用户计算机上运行，​​并且以 http://localhost/get_image 形式向服务发出请求，该请求返回图像。

如何将该图像保存到服务器上？

Answer 1

您可以使用 HTML5 使用 javascript 加载图像，并将 Base64 编码的响应发送到服务器，您可以在服务器中解码响应并将图像写入文件。 方法

1. 这是使用以下 html 元素创建表单的
   • canvas元素：获取图像
   • 文本区域：存储 Base 64 编码响应并将响应发送到服务器

2. 确保 Web 服务响应标头具有“Access-Control-Allow-Origin: *”以允许交叉源资源共享

3. Jquery 代码

var myCanvas = document.getElementById('canvasId');    
var ctx = myCanvas.getContext('2d');    
var img = 新图像；    
img.crossOrigin = '匿名';    
img.src = "返回图像的 Web 服务 url";    
img.onload = 函数(){
  console.log( img.width, img.height );
  // 将画布的高度和宽度设置为图像的高度和宽度，否则只会创建图像的一部分
  myCanvas.height = img.height;    
  myCanvas.width = img.width;    
  ctx.drawImage(img,0,0); // 或者你喜欢的任何偏移量    
  var dataURL = myCanvas.toDataURL("image/png");    
  dataURL = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");    
  $('#some_text_area_id').val(dataURL); // 在文本区域设置响应    
  $('#form_id').submit(); // 提交表单
};

1. 服务器端 - 使用“base64”ruby 库解码响应

File.open('test.png',"wb") do |file|
  file.write(Base64.decode64(params[:text_area]))
结尾

Answer 2

我更喜欢使用 Carrierwave gem 进行 url 图像上传

http://railscasts.com/剧集/253-rierwave-file-uploads?autoplay=true

Answer 3

如上所述，通过网络传输图像时应使用 base64 编码。 Base64 表示 ASCII 字符串格式的二进制数据。它专门用于 MIME 内容传输编码和 XML 中的复杂数据存储。

您可以在这里尝试Javascript base64编码解码 http://rumkin.com/tools/compression/base64.php

此外，当您尝试写入 png 图像文件时，请确保使用 file.write 和 file.read 而不是 file.puts 和 file.gets

File.open('a.png', 'rb') do |infile|
   File.open('b.png', 'wb') do |outfile|
      outfile.write(infile.read)
   end  
end

虽然最好的解决方案是将图像 URL 作为 Web 服务响应返回并获取来自资产的图像 服务器。