問題タブ [data-url]

画像ファイル (jpg/png) をデータ URL に変換する次のコードがあります。トリミングが完了すると、レンダリング イメージを生成できますが、png として保存されます。データ URL を jpg として保存できるようにする必要があります。

renderToDataURL 行を に変更しても影響はありません"png"。"jpg"何か案は？

Angular JS (NodeJS バックエンド) には<canvas></canvas>、ユーザーがウェブカメラで写真を撮った後に drawsImage があります。写真を送信した後 (次に進むlocation.href)、ユーザーがブラウザーの「戻る」ボタンを押した場合、キャンバスに描画された画像は、 を呼び出した後でも残りますlocalStorage.clear()。

ここで何が問題になる可能性がありますか? どんな助けでも大歓迎です。

ドキュメントによると、ngImgCrop ディレクティブの画像プロパティをデータ URL ではなく画像 URL に設定できるはずです。ただし、機能していないようです。入力テキスト ボックス (ユーザーが画像の URL を入力するため) と、トリミングのために ngImgCrop のソース画像の更新をトリガーするボタンがあります。これまでの私のコードは次のとおりです。

ngImgCrop 要素の定義は次のとおりです。

app.js の AngularJS は次のとおりです。

現在の動作では、ソース イメージがまったく設定されていません。どんな助けでも大歓迎です！ありがとう！

値が画像のデータURIである入力のあるフォームがあります "data:image/jpg;base64,/9j xxxxxxx...".

ユーザーがこれを使用して画像をトリミングすると、その値が入力に与えられます-> http://fengyuanchen.github.io/cropper/ したがって、dragond イベントで、getDataURL で入力値を入力します...

フォーム送信時に、データはコントローラーに送られ、そこで dataURI を処理して拡張子、base64 文字列などを取得します...

次に、そのbase64を次のようなファイルに書き込んでいます：

すべてが問題なく動作します。しかし...大きな画像を使用すると（> 500kbなので、それほど大きな事実ではありません）、次のエラーが発生します。

ローカルホストで常に動作するのは興味深いです:(巨大な画像でも.

どうすればこれを機能させることができるか考えている人はいますか? または、スキッパーまたは素敵なサービスを使用してこれを行う方法を提案することをお勧めします...

ノードv0.10.33でSailsJS v0.10.5を使用しています

私は、キャンバスを使用して画像を操作する JS アプリケーションに取り組んでいます (つまり、 .toBlob()および.toDataURL( )を使用して png/base64 に変換します。

.transferControlToProxy()を使用して、ワーカーに仕事をさせ、スムーズな GUI を取得します。

しかし、サポートされていないようです...彼らがMozilla開発者で言ったように

あなたのいくつかは、他の情報を持っていますか？多分回避策？

私は自分の chrome アプリに取り組みましたが、コンテンツのセキュリティ ポリシーに神経質になりました。json (string/object/array I don't know)から jpeg 画像を取得したかったのですが、csp は毎回私を止めました。データリンクの方が簡単だとわかったので、コンバーターを検索しました。

残念ながら、これは機能しません。エラーメッセージは次のとおりです。

誰かが私を助けてくれることを願っています:) 私の悪い英語でごめんなさい

data:image/jpeg;base64AJAX POST を介して正しく送信されるデータ URLをエンコードするにはどうすればよいですか。私は今そうしている次のコードを持っていますxhr.open('POST', 'http://url-sent-to/image/' + saveImage + '&imageid=' + imageid.value, true);。

ただし、特に URL が含まれているため、URLhttp://url-sent-to/image/data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD…RRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFAH/2Q==&imageid=testimagedataは正しくないように見えます=。

私がやっていることの例として、フィドルのセットアップがあります。基本的に、ユーザーは画像を選択し、説明を入力して、レンダリングをクリックします。Javascript コンソールを確認すると、Blob が作成され、下部に POST メッセージが表示されます: http://jsfiddle.net/mattography/Lgduvce1/2/

私は次のデータURLを持っています

imageviewにdataUrlをロードする方法はありますか?