jquery - 使用 html5 页面和文件输入类型在服务器上上传文件

Question

我有一个 html5 页面，需要在某个服务器路径上上传一个图像文件，并希望在页面上显示上传的文件。我使用 jquery 读取文件路径并使用 ajax 尝试调用处理程序。但是我们无法在 jquery 中读取完整的文件路径。

如果使用标签并将文件输入类型放入其中并在其发布调用处理程序时，我们可以使用 context.Request.Files["ID"] 读取文件路径并保存但无法显示上传的文件html页面。

任何人都可以建议如何使用 html 文件输入类型上传文件

谢谢苏普里亚

Answer 1

通常，您不能使用 JavaScript 访问或发布文件（因此也不能使用 jQuery 或 AJAX）。<input type="file" ...>有一些方法可以解决这个问题，但是对于您的第一次尝试，使用带有和不带有任何 JavaScript的简单表单会容易得多。

你没有提到你在服务器端使用的是什么（我猜是我稍微熟悉的 C#/ASP/.NET），但基本上你通常得到的只是图像文件中的纯数据（不文件名或文件路径）并且您必须自己将该数据写入文件（或对其进行其他操作，例如将其写入数据库）。

但是，一些 Web 框架会为您编写文件并为您提供创建文件的路径，但我不知道您是否正在使用类似的东西。

然后，您需要将创建的文件复制到 Web 服务器的公共目录中（或者直接在其中写入，如果您自己创建文件），以便您可以在img显示图像的 HTML 文件的元素中引用它. 或者，您可以使用单独的服务器端脚本，该脚本读取图像文件并返回具有正确 MIME 类型的数据。