私のアプリでは、多くの大きな画像の操作と一時的な保存が必要です。これを効率的に管理するために、すべての画像への blob URL 参照を使用しています。
ただし、操作に続いて、キャンバスから取得した、新しいクライアント側で生成された画像用に新しい Blob URL を作成する必要があることは明らかです。
Firefox は完全に動作するネイティブCanvas.toBlob()をサポートしているため、次のようにこのブロブから新しいブロブ URL 参照を作成します。
var url = window.URL || window.webkitURL;
var bloburl = url.createObjectURL(blob);
すべてのブラウザで、次のポリフィルを使用しています。
https://github.com/blueimp/JavaScript-Canvas-to-Blob
これは IE と Opera では機能しますが、Chrome では失敗し、次の JavaScript エラー メッセージが返されます。
Uncaught Error: Syntax error, unrecognized expression: blob:http%3A//www.exampledomain.com/d4693a94-ebf9-4608-b721-1cee1a04fd00
bloburlconsole.log()変数を取得すると、次のようになります。
Firefox/IE/Opera の場合:
blob:d4693a94-ebf9-4608-b721-1cee1a04fd00
Chrome の場合:
blob:http%3A//www.exampledomain.com/d4693a94-ebf9-4608-b721-1cee1a04fd00
この URL 参照の作成に問題があるようですが、修正方法がわかりません。
どんな助けでも大歓迎です。