HTMLで入力されたファイルに値を設定するにはどうすればよいですか？

注意：

以下の回答とコメントは、2009年のレガシーブラウザーの状態を反映しています。これで、2017年にJavaScriptとdataTransferまたはFileListオブジェクトを使用して、ファイル入力要素の値を動的/プログラムで実際に設定できるようになりました。

詳細とデモについては、この質問の回答を参照してください：
ファイルの入力値をプログラムで設定する方法（つまり、ファイルをドラッグアンドドロップする場合）？

これの値をどのように設定できますか？

<input type="file" />

セキュリティ上の理由によりできません。

想像してみてください：

<form name="foo" method="post" enctype="multipart/form-data">
    <input type="file" value="c:/passwords.txt">
</form>
<script>document.foo.submit();</script>

あなたが訪問するウェブサイトがこれをできるようにしたくないのですか？=）

できません。

ファイル入力の値を設定する唯一の方法は、ユーザーがファイルを選択することです。

これはセキュリティ上の理由から行われます。それ以外の場合は、クライアントコンピューターから特定のファイルを自動的にアップロードするJavaScriptを作成できます。

質問に対する回答ではありませんが（他の人が回答したものです）、アップロードされたファイルフィールドの編集機能が必要な場合は、おそらく次のようにします。

• ファイル名またはURL、それをダウンロードするためのクリック可能なリンク、または画像の場合：単にサムネイルとして表示するだけで、このフィールドの現在の値を表示する
• の <input>新しいファイルをアップロードするタグ
• チェックすると、現在アップロードされているファイルを削除するチェックボックス。「空の」ファイルをアップロードする方法はないため、フィールドの値をクリアするには、次のようなものが必要です。

できません。そしてそれはセキュリティ対策です。ファイル入力値を機密データファイルに設定するJSを誰かが書き込んだとしたらどうでしょうか。

ここの他の皆が述べたように：JavaScriptでファイルを自動的にアップロードすることはできません。

しかしながら！ コードで送信したい情報（つまり、passwords.txtではない）にアクセスできる場合は、それをblobタイプとしてアップロードして、ファイルとして扱うことができます。

サーバーが最終的に見るものは、実際にの値を設定している誰かと区別がつかなくなります<input type="file" />。トリックは、最終的には、サーバーで新しいXMLHttpRequest（）を開始することです...

function uploadFile (data) {
        // define data and connections
    var blob = new Blob([JSON.stringify(data)]);
    var url = URL.createObjectURL(blob);
    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'myForm.php', true);

        // define new form
    var formData = new FormData();
    formData.append('someUploadIdentifier', blob, 'someFileName.json');

        // action after uploading happens
    xhr.onload = function(e) {
        console.log("File uploading completed!");
    };

        // do the uploading
    console.log("File uploading started!");
    xhr.send(formData);
}

    // This data/text below is local to the JS script, so we are allowed to send it!
uploadFile({'hello!':'how are you?'});

それで、これを何に使うことができるでしょうか？HTML5キャンバス要素をjpgとして アップロードするために使用します。これにより、ユーザーはfile input要素を開く必要がなくなり、サイズ変更や変更などを行ったローカルのキャッシュされた画像を選択するだけで済みます。ただし、どのファイルタイプでも機能するはずです。

1）ファイル入力のデフォルト値の問題は「セキュリティ上の理由で完了」ではありませんが、ブラウザは「正当な理由がないため、実装に失敗しました」：この詳細レポートを参照してください

2）簡単な解決策は、ここにあるように、ファイル入力の上にテキスト入力を使用することです。もちろん、ファイル入力ではなくテキスト入力の値を使用して、ファイルを送信するためのコードが必要です。

私の場合、HTAアプリケーションを実行することは問題ありません。フォームをまったく使用しません。

HTMLで定義：

<input type="hidden" name="image" id="image"/>

JSの場合：

ajax.jsonRpc("/consulta/dni", 'call', {'document_number': document_number})
    .then(function (data) {
        if (data.error){
            ...;
        }
        else {
            $('#image').val(data.image);
        }
    })

後：

<input type="hidden" name="image" id="image" value="/9j/4AAQSkZJRgABAgAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8U..."/>
<button type="submit">Submit</button>

実際にそれを行うことができます。FormToMultipartPostDataライブラリを使用してc＃でwebbrowserコントロールを使用することにより、ファイル値のデフォルトを設定できます。このライブラリをダウンロードしてプロジェクトに含める必要があります。Webブラウザーを使用すると、ユーザーはフォーム内のWebページをナビゲートできます。Webページが読み込まれると、webBrowser1_DocumentCompleted内のスクリプトが実行されます。そう、

private void webBrowser1_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
    {
       FormToMultipartPostData postData = 
            new FormToMultipartPostData(webBrowser1, form);
        postData.SetFile("fileField", @"C:\windows\win.ini");
        postData.Submit();
    }

ダウンロードと完全なリファレンスについては、以下のリンクを参照してください。

https://www.codeproject.com/Articles/28917/Setting-a-file-to-upload-inside-the-WebBrowser-com