如何使用HTML5和transferControlToProxy？

Question

我在使用畫布來處理圖片的JS應用程序上工作（即，使用.toBlob（）和.toDataURL（） 轉換為png / base64 。

我將使用.transferControlToProxy（）讓工作人員完成工作並獲得平滑的GUI。

你們中有些人還有其他信息嗎？ 也許解決方法？

Answer 1

Whatwg.org有在使用canvas.transferControlToProxy（）的一個JavaScript樣本https://developers.whatwg.org/the-canvas-element.html#dom-canvas-transfercontroltoproxy ，但它似乎並沒有工作在任何瀏覽器呢，甚至不是最新版本（Chrome Canary或Opera Next）。

即使在chrome：// flags中啟用“啟用實驗性畫布功能”，在Chrome Canary中也無效。

實時測試： http ： //jsbin.com/bocoti/5/edit？html，輸出

它說：“ TypeError：canvas.transferControlToProxy不是一個函數”。

這將是一個很好的補充。 考慮在工作器中的畫布上繪制所有內容，並創建畫布的blob / arraybuffer / dataurl，然后使用Transferable對象將其傳輸到主線程。 如今，如果您想使用畫布功能（fill（），drawImage（）等）在畫布上繪制某些東西，則必須在主線程中進行...

<!DOCTYPE html><html><head><meta charset="utf-8" /></head><body>
  <div id="log"></div>
<canvas style="border:1px solid red"></canvas> 

  <script id="worker1" type="javascript/worker">
    self.onmessage = function(e) {
      var context = new CanvasRenderingContext2D();
      e.data.setContext(context); // event.data is the CanvasProxy object
      setInterval(function () {
        context.clearRect(0, 0, context.width, context.height);
        context.fillText(new Date(), 0, 100);
        context.commit();
      }, 1000);
    }
  </script>

  <script>
    var blob = new Blob([document.querySelector('#worker1').textContent]);
    var worker = new Worker(window.URL.createObjectURL(blob));
    worker.onmessage = function(e) {
      //document.querySelector("#log").innerHTML = "Received: " + e.data;
    }
    var canvas = document.getElementsByTagName('canvas')[0];
    try { var proxy = canvas.transferControlToProxy(); 
          worker.postMessage(proxy, [proxy]);}
    catch(e) { document.querySelector("#log").innerHTML = e; }

  </script>
<br>
From: <a href="https://developers.whatwg.org/the-canvas-element.html#the-canvas-element">https://developers.whatwg.org/the-canvas-element.html#the-canvas-element</a>
</body></html>

如何使用HTML5和transferControlToProxy？

問題描述

1 個解決方案

解決方案1
1 2015-09-08 07:10:30

如何使用HTML5和transferControlToProxy？

問題描述

1 個解決方案

解決方案1 1 2015-09-08 07:10:30

解決方案1
1 2015-09-08 07:10:30