タイトル通りです。

あんまり実用的ではないかも?

方法

XMLHttpRequestを使って、外部の画像をArrayBufferとして取得してBlob経由でcanvasに描画します。

参考: CORS Enabled Image - HTML | MDN

ソースコード

簡易なデモコードです。

HTMLは想像してください。

var canvas = document.getElementById("canvas"),
	ctx = canvas.getContext("2d");

// 適当にリクエストを投げる
var url = "https://pbs.twimg.com/profile_images/656821360358854657/qKSAV4Pz_bigger.png";
var req = new XMLHttpRequest();
req.open("GET", url, true);
req.responseType = "arraybuffer";
req.addEventListener("load", function (event) {
	if (req.status !== 200) {// 一応ステータスコードだけ確認
		alert("Invalid status code");
		return;
	}
	
	// Blobを作成しURLを取得する
	var blob = new Blob([req.response]),
		blobUrl = URL.createObjectURL(blob);
	
	// いつも通りcanvasに描画
	var Image = new Image();
	image.src = blobUrl;
	image.addEventListener("load", function () {
		ctx.drawImage(image, 0, 0);
	});
});
req.send();

サンプル

GitHubにサンプルを置いてあります。

サンプル: Koneta/tainted-canvas

ソースコード: Koneta/tainted-canvas/index.html

おわりに

BlobじゃなくてBase64とかでも行けると思う。

文章がくそ雑い。

ゆるして。