繁体   English   中英

将画布转换为图像并使用ruby on rails和javascript在新窗口中打开

[英]Convert canvas to image and open in new window using ruby on rails and javascript

我非常坚持这个问题,希望你们能帮助我。

我想要实现的是点击链接,按钮或图像,这似乎更简单,我使用toDataURL将画布转换为图像。 之后,打开包含此图像的新窗口。

如何使用ruby on rails将从toDataURL生成的数据url传递到新窗口?

提前致谢。

首先,这与Rails没什么关系。 但是,您可以使用Ruby来解决此问题。

首先获取您正在执行的画布内容:

var dataURL = canvas.toDataURL("image/png");

此时您只需使用Javascript打开一个新窗口并在那里直接打开图像(无需服务器交互):

var window = window.open();
window.document.write('<img src="'+dataURL+'"/>');

$('a.my-link').click(function(){
  open().document.write('<img src="'+dataURL+'"/>');
  return false;
});

这是一个小小的小提琴来说明这个: http//jsfiddle.net/XtUFt/

或者您可以将纯base64字符串发送到服务器并让您的应用创建实际图像并使用视图来呈现它:

var base64 = dataURL.replace(/^data:image\/(png|jpg);base64,/, "") ;
var window = window.open('http://www.yourapp.com/controller/action?base64='+base64);

!这是一个简化的例子,假设图像非常小。 如果您的图像无论如何更大,您将不得不使用“发布”请求,因为您的URL不会携带数据,因为字符串太长了!

然后在服务器上,您可以使用它来创建图像:

require 'base64'
File.open('your/image/path/and/name.gif', 'wb') do|f|
  f.write(Base64.decode64(params[:base64]))
end

然后,这只是打开图像并相应地渲染视图的问题。

我迟到了,但这里有一个快速的脏衬里解决了这个问题:

 window.open(document.getElementById("mycanvas").toDataURL());

希望这可以在不久的将来帮助某人。

我的方法:

var dataURL = canvas.toDataURL("image/png");
var newTab = window.open(dataURL, 'Image');
newTab.focus();

它可能在将来帮助某人。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM