如何在HTML5畫布上呈現AppEngine blobstore圖像？

我想在HTML5畫布上顯示AppEngine blobstore PNG圖像。這是我到目前爲止已經試過，基於HTML5教程和使用Web應用程序模板，通過PNG圖像和它的尺寸到客戶端：如何在HTML5畫布上呈現AppEngine blobstore圖像？

<html> 
    <head> 
    <script type="text/javascript"> 
     function draw(png) { 
     var ctx = document.getElementById('image').getContext('2d'); 
     var img = new Image(); 
     img.onload = function(){ 
      ctx.drawImage(img,0,0) 
     }; 
     img.src = png; 
     } 
    </script> 
    </head> 
    <body onload="draw({{png}});"> 
<canvas id="image" width={{width}} height={{height}}></canvas>  
    </body> 
</html>

聲明

img.src = PNG

我想是錯誤的，因爲JavaScript Image對象的SRC屬性必須是服務器端文件名。但App Engine上沒有服務器端文件，那麼有沒有辦法做到這一點？

由於

莫特

來源

2012-04-01 MortCanty

你需要編寫一個處理程序就可以提供斑點，like this，然後使用URL在你的HTML和JavaScript處理程序。或者，由於您正在投放圖片，因此您可以使用Google的高性能圖片服務投放圖片，如文檔here所述，並使用該網址替代。

來源

2012-04-02 11:42:02

非常感謝，尼克。我應該知道，因爲我正在使用blob服務器處理程序已經將斑點傳遞給Picloud。 – MortCanty 2012-04-02 14:02:04

圖像出來使用servlet（或等效在python）作爲字節數組Blob存儲區的。您可以編寫代碼以他們瞭解的方式將其寫回客戶端。在java中通常是這樣的：

BlobKey blobKey = new BlobKey(req.getParameter("blobkey")); 
blobstoreService.serve(blobKey, resp);

我們使用urlRewriteFilter（tuckey.org）來重寫URL像/image/.png來調用一個servlet /服務的blobKey =這樣瀏覽器就知道他們？獲取圖像。

參見：https://developers.google.com/appengine/docs/java/javadoc/com/google/appengine/api/blobstore/BlobstoreService

來源

2012-04-01 18:48:46

如何在HTML5畫布上呈現AppEngine blobstore圖像？

回答

相關問題