[解決済み] フォーム入力でカメラにアクセスし、Webアプリで写真を即座にアップロードする
2023-02-06 09:55:34
質問
私は この回答 は見事です。
<ブロッククオートiPhone iOS6 と Android ICS 以降の HTML5 では、次のような タグがあり、デバイスから写真を撮影することができます。
<input type="file" accept="image/*" capture="camera">
Captureはカメラ、カムコーダー、オーディオのような値を取ることができます。
これをさらに一歩進めて、撮影後すぐに写真をアップロードするために何らかのajaxを使用することは可能でしょうか?
例えば、私の携帯電話を使用して、一度入力をタップすると、カメラを開き、すぐに写真を撮って保存することができます。カメラに保存すると、アップロードするファイルとして入力ボタンにリストアップされます。
ユーザーがフォームの送信ボタンをクリックするのを待たずに、この写真をすぐにアップロードするには何が必要でしょうか?
どのように解決するのですか?
これは本当に簡単で、ファイル入力のonchangeハンドラ内のXHRリクエストを介してファイルを送信するだけです。
<input id="myFileInput" type="file" accept="image/*;capture=camera">
var myInput = document.getElementById('myFileInput');
function sendPic() {
var file = myInput.files[0];
// Send file here either by adding it to a `FormData` object
// and sending that via XHR, or by simply passing the file into
// the `send` method of an XHR instance.
}
myInput.addEventListener('change', sendPic, false);
関連
-
[解決済み] Webフォームのフィールド/入力タグでブラウザのオートコンプリートを無効にするにはどうすればよいですか?
-
[解決済み] jQueryを使用してフォームの入力フィールドを取得する?
-
[解決済み] JQueryを使って<input type="text">の変更をすべて(即座に)検出する。
-
[解決済み] iOS11のホーム画面のWebアプリでカメラにアクセスするには?
-
[解決済み] サブドメインにまたがってlocalStorageを使用する
-
[解決済み] AJAX Mailchimp サインアップフォームの統合
-
[解決済み] jQueryで入力ファイルが空かどうかをチェックする方法
-
[解決済み] JavaScriptのArray.sort()メソッドでシャッフルするのは正しいのか?
-
[解決済み] JavaScriptの文字列プリミティブとStringオブジェクトの違いは何ですか?
-
[解決済み] 変異を伴わないオブジェクトからの値の削除
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Javascriptによるタッチスクリーンデバイスの検出
-
[解決済み] なぜ "use strict "はパフォーマンスを10倍向上させるのか?
-
[解決済み] javascript の関数から `undefined` と `null` のどちらを返すのが良いのでしょうか?
-
[解決済み] jQueryの$という記号の意味は何ですか?
-
[解決済み] 各オブジェクトに?重複
-
[解決済み] Node.jsのES6クラスをrequireで作る
-
[解決済み] <ng-content>が空かどうかを確認する方法は?(これまでのAngular 2+で)
-
[解決済み] javascriptのキャンバスで画像をリサイズする (スムーズ)
-
[解決済み] V8 Javascript エンジンのスタンドアロン実行
-
[解決済み] Chrome拡張機能:popup.htmlを強制終了させる