52

<input type="file">以下に示すように、を含む単純な HTML フォームがあります。

<form>
  <label for="attachment">Attachment:</label>
  <input type="file" name="attachment" id="attachment">
  <input type="submit">
</form>

IE7 (および古い Firefox 2 を含むすべての有名なブラウザー) では、'//server1/path/to/file/filename' のようなファイルを送信すると、正しく機能し、ファイルへのフル パスとファイル名が返されます。

Firefox 3 では、Firefox バグ追跡システム ( https://bugzilla.mozilla.org/show_bug.cgi?id=143220 )で説明されているように、パスを切り捨てる新しい「セキュリティ機能」のため、「ファイル名」のみを返します。

この「新機能」を克服する方法がわかりません。Web アプリケーションのすべてのアップロード フォームが Firefox 3 で動作しなくなるためです。

Firefox 3 と IE7 の両方でファイル パスを取得するための単一のソリューションを見つけるのを手伝ってくれる人はいますか?

4

8 に答える 8

10

Firefox でのプレビューでは、これが機能します。最初の例では、添付ファイルは添付ファイル要素のオブジェクトです。

           if (attachment.files)
             previewImage.src = attachment.files.item(0).getAsDataURL();
           else
             previewImage.src = attachment.value;
于 2010-01-03T18:12:13.883 に答える
2

FF3では完全なファイルパスを取得できません。以下は、ファイルコンポーネントのカスタマイズに役立つ場合があります。

<script>

function setFileName()
{
    var file1=document.forms[0].firstAttachmentFileName.value; 

    initFileUploads('firstFile1','fileinputs1',file1);
    }
function initFileUploads(fileName,fileinputs,fileValue) {
    var fakeFileUpload = document.createElement('div');
    fakeFileUpload.className = 'fakefile';
    var filename = document.createElement('input');
    filename.type='text';
    filename.value=fileValue;
    filename.id=fileName;
    filename.title='Title';
    fakeFileUpload.appendChild(filename);
    var image = document.createElement('input');
    image.type='button';
    image.value='Browse File';
    image.size=5100;
    image.style.border=0;
    fakeFileUpload.appendChild(image);
    var x = document.getElementsByTagName('input');
    for (var i=0; i&lt;x.length;i++) {
        if (x[i].type != 'file') continue;
        if (x[i].parentNode.className != fileinputs) continue;
        x[i].className = 'file hidden';
        var clone = fakeFileUpload.cloneNode(true);
        x[i].parentNode.appendChild(clone);
        x[i].relatedElement = clone.getElementsByTagName('input')[0];
        x[i].onchange= function () {
            this.relatedElement.value = this.value;
        }}
    if(document.forms[0].firstFile != null && document.getElementById('firstFile1') != null)
    {
    document.getElementById('firstFile1').value= document.forms[0].firstFile.value;
    document.forms[0].firstAttachmentFileName.title=document.forms[0].firstFile.value;
    }
}

function submitFile()
{
alert( document.forms[0].firstAttachmentFileName.value);
}
</script>
<style>div.fileinputs1 {position: relative;}div.fileinputs2 {position: relative;}
div.fakefile {position: absolute;top: 0px;left: 0px;z-index: 1;}
input.file {position: relative;text-align: right;-moz-opacity:0 ;filter:alpha(opacity: 0);
    opacity: 0;z-index: 2;}</style>

<html>
<body onLoad ="setFileName();">
<form>
<div class="fileinputs1">
<INPUT TYPE=file NAME="firstAttachmentFileName" styleClass="file" />
</div>
<INPUT type="button" value="submit" onclick="submitFile();" />
</form>
</body>
</html>
于 2010-12-07T21:40:51.673 に答える
2

実際、FF3 が出る直前にいくつかの実験を行い、FF2 は Opera 9.0 と同様にファイル名のみを送信しました。IE のみがフル パスを送信します。サーバーは、ユーザーが自分のコンピューターのどこにファイルを保存しているかを知る必要がなく、アップロード プロセスとは関係がないため、この動作は理にかなっています。イントラネット アプリケーションを作成していて、ネットワークに直接アクセスしてファイルを取得している場合を除きます。

何が変わったのか (それがあなたが指摘したバグ項目の本当のポイントです) は、FF3 が JavaScript からファイル パスにアクセスできなくなったことです。そして、そこにパスを入力/貼り付けることはできません. DragDropUpload 拡張機能を使用して問題を解決しました。しかし、これは話題から外れてしまうのではないかと心配しています。

あなたの Web フォームは、この新しい動作を止めるために何をしているのでしょうか。

[編集] マイクによってリンクされたページを読んだ後、実際にイントラネットでのパスの使用 (たとえば、ユーザーの識別) とローカルでの使用 (画像のプレビューの表示、ファイルのローカル管理) を確認しました。ユーザー Jam-es は nsIDOMFile で回避策を提供しているようです (まだ試していません)。

于 2008-10-08T06:18:12.603 に答える
0

This is an example that could work for you if what you need is not exactly the path, but a reference to the file working offline.

http://www.ab-d.fr/date/2008-07-12/

It is in french, but the code is javascript :)

This are the references the article points to: http://developer.mozilla.org/en/nsIDOMFile http://developer.mozilla.org/en/nsIDOMFileList

于 2008-09-17T09:08:17.183 に答える
0

これを解決する非常に醜い方法の1つは、ユーザーが手動でディレクトリをテキストボックスに入力し、JavaScriptのファイル値の前にこれを追加することです。

厄介です...しかし、それはあなたが作業しているユーザーのレベルに依存し、セキュリティの問題を回避します。

<form>
    <input type="text" id="file_path" value="C:/" />
    <input type="file" id="file_name" />
    <input type="button" onclick="ajax_restore();" value="Restore Database" />
</form>

JavaScript

var str = document.getElementById('file_path').value;
var str = str + document.getElementById('file_name').value;
于 2009-08-20T20:08:33.160 に答える
0

XPCOMを見てください。Firefox3がクライアントによって使用されている場合に使用できるものがあるかもしれません。

于 2008-09-17T08:53:04.303 に答える
0

単純にFF3ではできない。

もう 1 つのオプションは、アプレットまたはその他のコントロールを使用してファイルを選択およびアップロードすることです。

于 2008-09-17T08:48:53.097 に答える
0

これは別の解決策/修正です... FF3 では、ファイル参照ボックスではなく、テキスト ボックスでファイルのフル パスを取得できます。それも…ファイルをドラッグ＆ドロップで！

ファイルを HTML ページのテキスト ボックスにドラッグ ドロップできます。ファイルの完全なパスが表示されます。このデータは、サーバーに簡単に転送したり、操作したりできます。

必要なのは、拡張機能 DragDropUpload を使用することだけです

http://www.teslacore.it/wiki/index.php?title=DragDropUpload

この拡張機能は、ファイル参照 (入力ファイル) ボックスにファイルをドラッグ ドロップするのに役立ちます。それでも、取得しようとすると、ファイルのフル パスを取得できません。

そこで、この拡張機能を少し調整しました。ファイルを「テキスト入力」ボックスにドラッグドロップして、ファイルのフルパスを取得できるようにします。したがって、FF3 Firefox 3 でファイルのフルパスを取得できます。

于 2009-07-23T05:01:09.277 に答える