將畫布轉換為圖像並使用ruby on rails和javascript在新窗口中打開

Question

我非常堅持這個問題，希望你們能幫助我。

我想要實現的是點擊鏈接，按鈕或圖像，這似乎更簡單，我使用toDataURL將畫布轉換為圖像。 之后，打開包含此圖像的新窗口。

如何使用ruby on rails將從toDataURL生成的數據url傳遞到新窗口？

提前致謝。

Answer 1

首先，這與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

然后，這只是打開圖像並相應地渲染視圖的問題。

Answer 2

我遲到了，但這里有一個快速的臟襯里解決了這個問題：

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

希望這可以在不久的將來幫助某人。

Answer 3

我的方法：

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

它可能在將來幫助某人。