【问题标题】:JavaScript/jQuery + HTML5 file upload[.zip/.txt] And Send this file as jSON DataJavaScript/jQuery + HTML5 文件上传[.zip/.txt] 并将此文件作为 JSON 数据发送
【发布时间】:2014-06-05 06:41:53
【问题描述】:

如果您有Any server side scripting 技术,问题就相当简单,但在处理的情况下[即。将文件按原样发送到 JSON 函数。

场景是:

  1. 我有一个文件上传控件

    <input type="file" id="fileselect" name="fileselect[]" multiple="multiple" />

  2. 在 javascript 或 jQuery 的帮助下,我需要在“上传”按钮单击时获取该控件的上传文件。 我需要将此文件发布到 JSON。

  3. 为什么需要按原样发布,因为文件可以是 .zip 或 .text [不会使用图像文件],我的控制器中有可以处理该文件的函数 [例如提取/保存/进程等]

在所有浏览器上都可以做到这一点的任何好方法?

在这种情况下,使用 javascript 将文件保存到本地磁盘是一个很好的解决方案,而不是将其传递给 JSON 吗?也请对此发表评论。

【问题讨论】:

    标签: javascript jquery asp.net json html


    【解决方案1】:

    使用 PHP 可以做到。 $_FILES["fileselect"] 可以保留文件 arrtibutes ,上传时将其存储在临时位置,可以通过 move_upload_file($source,$destination) 进行更改

    【讨论】:

    • 我使用的是 asp.net,所以使用 php 在逻辑上是不正确的,我猜。但如果我必须这样做,我怎样才能做到这一点?
    【解决方案2】:

    要在没有服务器脚本的情况下将请求发送到服务器端,请参阅my answer here。您可以使用XMLHttpRequest 将文件上传到服务器。答案特别是关于如何显示进度条,但它也显示了如何上传文件。

    有关使用 javascript 在本地保存文件的选项,请参阅here(文件系统 API)和here(本地存储)。另见this answer,它描述了FileReaderFile API。请注意,您将需要使用一些相对较新的功能,您可以参考caniuse 以查看您的目标浏览器是否受支持。

    更新

    根据您询问如何使用 Web-API 控制器执行此操作的 cmets。见this answer。基本上,您检查并遍历控制器中HttpRequest.Files 中的每个文件。

    您不能在自托管 Web API 中使用 HttpRequest,请参阅 hereherehere 了解替代方案。

    【讨论】:

    • 感谢您的回复。我正在尝试使用 XMLHttpRequest 的一种解决方案。我上面没有提到。我没有使用 MVC 控制器。我正在使用 Web-API 控制器。我无法访问那里的 HttpPostedFileBase userFile。有没有办法在这个语句中传递参数? xhr.open("post", url, true);
    • $(function () { $('#Upload').click(function () { var formData = new FormData(); var opmlFile = $('#me')[0] ; formData.append("opmlFile", opmlFile.files[0]); var baseUrl = "localhost:8086/api/Values"; $.ajax({ url: baseUrl+ 'Post', type: 'POST', data: formData, 缓存:假,内容类型:假,过程数据:假});});});
    • ^ 不知何故,我无法在上面的评论中添加换行符。对此感到抱歉。我正在尝试您的解决方案。但是在 HttpContext.Current.Request 中获取 HttpContextCurrent 时,它在我的 web-Api 中引发了 Nullreference 错误!为什么?
    • @user3555860 - 查看我刚刚添加的最后一行。
    • 那么解决这个问题的可行方法是什么?我该怎么做?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-11-20
    • 2019-03-14
    • 1970-01-01
    • 2017-11-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多