Question

我从Chrome和Opera中的文件输入元素中得到一些非常奇怪的行为（可能更多，尚未测试）。

我有以下HTML：

<div id="profileImgContainer" class="formFile">
    <label>Profile Picture</label><div>
        <input type="text" id="profileImgText"><input type="button" value="Choose File" id="profileImgButton">
    </div>
    <input type="file" id="profileImg" name="profileImg">
</div>

以下jQuery获取文件输入的值并将其放入（可见）文本框中。实际的文件输入是隐藏的。

$(".formFile input[type='file']").live('change', function()
{
    $(this).parents(".formFile").find("input[type='text']").val($(this).val());
});

我做了a JSFiddle for you try out。在Firefox中，文本框很高兴地获取文件元素的文件名（不关心路径）。但是，在Chrome和Opera中，选择文件时，可见文本框中的文件路径将更改为C:\fakepath\[filename]，其中[filename]是所选文件的名称。这条路径显然是假的，但我想知道的是为什么它改为它，以及隐藏的上传元素中的文件是否仍然可以正常上传。我猜这是一个安全功能，但我可能错了。

Answer 1

这是一种尝试，可以缓解允许任意外部代码在浏览器中运行所带来的安全问题：脚本（我们假设可能来自恶意攻击者）无法查看（并且可能通过AJAX进行通信））有关您本地文件的信息。

想象一下，如果脚本可以自由设置文件上传和提交表单，会发生什么。

由于这个原因，有关文件上载控件和脚本的这种行为是由某种标准强制执行的（我相信DOM规范的一部分）。

从<file>获取值会产生C：\ fakepath \ filename，即使在Linux </file>中也是如此

1 个答案: