web-dev-qa-db-ja.com

jQueryを使用したファイル入力からのフルパス

_type="file"_を使用して入力でval()を呼び出すと、フルパスではなくファイル名のみが取得されます。フルパスを取得するにはどうすればよいですか?

38
gruszczy

次のことはできません。これは、すべての最新ブラウザーのセキュリティ機能です。

IE8 の場合、デフォルトではオフになっていますが、セキュリティ設定を使用して再アクティブ化できます。

Input type = fileオブジェクトを使用してファイルを選択すると、valueプロパティの値は、Webページの表示に使用されるセキュリティゾーンの「サーバーにファイルをアップロードするときにローカルディレクトリパスを含める」セキュリティ設定の値に依存します入力オブジェクトを含む。

選択したファイルの完全修飾ファイル名は、この設定が有効になっている場合にのみ返されます。この設定を無効にすると、Internet Explorer 8は、不適切な情報開示を防ぐために、ローカルドライブとディレクトリパスを文字列C:\ fakepath \に置き換えます。

私が知っている他のすべての現在の主流のブラウザでは、それもオフになっています。ファイル名はあなたが得ることができる最高のものです。

この質問 の詳細情報と適切なリンク。サーバー側で値を取得することを指しますが、フォームの送信前のJavaScriptの問題は同じです。

47
Pekka 웃

完全なパスを取得することはできませんが、一時的なパスを使用することはできます。

これを試して:

正確なパスではなく一時的なパスを提供します。このjsfiddleの例のように選択した画像を表示する場合は、このスクリプトを使用できます(画像や他のファイルを選択して試してください):

[〜#〜] jsfiddle [〜#〜]

コードは次のとおりです。

HTML:-

<input type="file" id="i_file" value=""> 
<input type="button" id="i_submit" value="Submit">
    <br>
<img src="" width="200" style="display:none;" />
        <br>
<div id="disp_tmp_path"></div>

JS:-

$('#i_file').change( function(event) {
var tmppath = URL.createObjectURL(event.target.files[0]);
    $("img").fadeIn("fast").attr('src',URL.createObjectURL(event.target.files[0]));

    $("#disp_tmp_path").html("Temporary Path(Copy it and try pasting it in browser address bar) --> <strong>["+tmppath+"]</strong>");
});

それはあなたが探していたものではありませんが、どこかであなたを助けることができるかもしれません。

15
DWX