<input type="file" id="file-id" name="file_name" onchange="theimage();">

这是我的上传按钮。

<input type="text" name="file_path" id="file-path">

这是一个文本字段,我必须在其中显示文件的完整路径。

function theimage(){
 var filename = document.getElementById('file-id').value;
 document.getElementById('file-path').value = filename;
 alert(filename);
}

这是解决我的问题的JavaScript。但在警报值给我

C:\fakepath\test.csv 

Mozilla给了我:

test.csv

但我想要本地完全限定文件路径。如何解决这个问题?

如果这是由于浏览器安全问题,那么应该采取什么替代方法来做到这一点?


当前回答

如果你真的需要发送上传文件的完整路径,那么你可能不得不使用一些类似于signed java applet的东西,因为如果浏览器不发送它,就没有任何方法获得这些信息。

其他回答

您至少可以在您的机器上获得文件路径的临时创建副本。这里唯一的条件是输入元素应该在表单中 你必须做的其他事情是在表单中放入一个属性enctype,例如:

<form id="formid" enctype="multipart/form-data" method="post" action="{{url('/add_a_note' )}}">...</form>

你可以在底部找到路径字符串。 它打开流文件,然后删除它。

在Chrome/Chromium的应用程序,如electron,你可以只使用target.files:

(我在这个例子中使用React JS)

const onChange = (event) => {
  const value = event.target.value;

  // this will return C:\fakepath\somefile.ext
  console.log(value);

  const files = event.target.files;

  //this will return an ARRAY of File object
  console.log(files);
}

return (
 <input type="file" onChange={onChange} />
)

我上面所说的File对象看起来是这样的:

{
  fullName: "C:\Users\myname\Downloads\somefile.ext"
  lastModified: 1593086858659
  lastModifiedDate: (the date)
  name: "somefile.ext"
  size: 10235546
  type: ""
  webkitRelativePath: ""
}

如果你想获取路径,你可以获取fullName。

注意,这只适用于chrome/chromium浏览器,所以如果你不需要支持其他浏览器(比如你正在构建一个电子项目),你可以使用这个。

一些浏览器具有安全特性,可以防止JavaScript知道文件的本地完整路径。这是有道理的——作为客户端,您不希望服务器知道您本地机器的文件系统。如果所有浏览器都这样做就太好了。

如果你真的需要发送上传文件的完整路径,那么你可能不得不使用一些类似于signed java applet的东西,因为如果浏览器不发送它,就没有任何方法获得这些信息。

如果你打开ie,工具,Internet选项,安全,自定义,找到“当上传文件到服务器时包括本地目录路径”(这是相当低的方法),然后点击“启用”。这是可行的