从移动设备通过Web浏览器上传图片是否可行?

11

这个问题之前已经有人问过,但是不包括今年的情况——目前没有具体的共识,而且我知道这是一个热门话题。此外,技术变化很快,其他问题似乎只涉及使用<input type="file">。我正在寻找一种更详细现代化的方法来处理这些请求。尽管我一直在开发ASP.NET C# MVC3,但我一直在研究天气ASP.NET MVC4 Mobile是否支持移动文件上传。从我所读的内容来看,它并不支持,或者说在新版本发布说明中没有提到。

http://www.asp.net/vnext/overview/whitepapers/whats-new

http://www.asp.net/mvc/tutorials/mvc-4/aspnet-mvc-4-mobile-features

根据我的研究,jQuery-Mobile似乎相当花哨。

http://www.parorrey.com/blog/jquery-mobile/file-input-field-uploading-using-jquery-mobile-framework-form-submission-with-ajax-disabled/

http://forum.jquery.com/topic/jquery-mobile-seems-to-clobber-ability-to-upload-files-via-forms

其中发布的一个例子在我的iPhone上没有起作用,因为<input type="file">仍然存在,因此无法访问。

http://filamentgroup.com/examples/jquery-custom-file-input/

我听说的另一个建议是强制用户将照片发送到特定的用户电子邮件中,这种方法不太吸引我和我的客户——这种方法也似乎容易出现安全漏洞。

是否有忽略的方法? 如何在移动设备上显示文件对话框?


有一篇来自2012年12月的博客文章(http://viljamis.com/blog/2012/file-upload-support-on-mobile/)声称目前大部分移动浏览器(iOS 8.0.2+,Android 2.2+,Windows Phone 8.1)都支持文件上传。 - amoebe
8个回答

3

Safari浏览器不支持文件上传。您可以通过访问许多移动站点的实际浏览器来了解这一点,但是实际应用程序将允许此操作。

因此,如果您正在制作希望部署为本地应用程序的移动Web应用程序,则可以使用PhoneGap作为图层来完成此操作。

http://docs.phonegap.com/en/1.4.1/phonegap_file_file.md.html#FileTransfer

此外,它支持以下平台:

  • Android
  • BlackBerry WebWorks(OS 5.0及更高版本)
  • iOS
  • Windows Phone 7(Mango)

1

我在一个生产应用程序中使用jquery mobile,它运行得非常好。我不使用它进行文件上传;然而,那也不是jquery mobile的工作。JqueryUI在其对话框和文件上传方面存在问题。有许多脚本可以帮助解决这个问题。我使用ajaxfileupload:http://www.phpletter.com/Our-Projects/AjaxFileUpload/ 现在有更好的选择。

我离题了。就移动设备而言,涉及相机功能比纯文件上传更有用。没有人知道他们在手机上存储什么,这是问题的一部分。为此,您可能需要尝试phonegap。请尝试这个:http://wiki.phonegap.com/w/page/18270855/Image%20Upload%20using%20JQuery%20and%20Python


从提供的阅读材料和phonegap.com网站来看,PhoneGap是一种安装在移动设备上并通过Web应用程序引用的应用程序。我可以使用跨平台移动交付系统制作一个简单的应用程序,将图片提交到我的Web应用程序,但希望找到本地的方法来完成图片上传。不过,相机上传功能非常有趣,感谢您的建议。 - Travis J

1

是的,我们可以通过手机上传图片, Facebook就是一个活生生的例子。


1
Facebook在我的iPhone浏览器上运行得非常糟糕,甚至无法加载。我曾经在另一台iPhone上看到它运行良好,但是没有上传图片的选项。我认为你可能在想Facebook应用程序,这与这个问题没有任何关系。 - Travis J
1
同意... Facebook 网页浏览器不会上传图片。有访问文件系统权限的 Facebook 应用程序可以上传图片。 - Bot

1

tinypic不允许我从iPhone上传图片,输入框被禁用了。在你的安卓手机上可以使用吗?在iPhone上,任何类型为“file”的输入都会被禁用。 - Travis J
除了登录页面,我甚至无法在iPhone上加载Facebook的任何页面。 - Travis J
1
这在我的安卓手机上可以运行,但是在iPhone上似乎不可能实现...因为Safari阻止了任何上传交互。目前唯一的解决方法是构建一个应用程序。https://dev59.com/5m865IYBdhLWcg3wSMgw - Dan
嗯,至少在Android上它能够正常工作,我可以从iPhone获取图片的文件路径。当你说“上传交互”时,这是否意味着浏览文件或实际上传数据,因为我确定iPhone浏览器允许在浏览时上传某些内容,例如位置或用户代理。 - Travis J
更新:在iOS v6+上,“媒体上传”在Safari中得到支持。因此,虽然看起来您不能直接上传任意文件(尽管Android也是如此),但现在至少有可能通过HTML表单在Android和iPhone上完成照片/视频上传。http://www.macworld.com/article/1168499/hands-on-with-ios-6-safari.html - Colin Fukai

1

这在Android 2.2+上运行良好。您可以从图库上传照片或使用相机拍摄新照片进行上传。任何其他暴露类似行为的应用程序,如录音机、摄像机和音乐应用程序,通常会提供替代方案。如果您安装了一个好的文件系统应用程序,通常会允许您上传任意文件。

在iOS上,您必须使用应用程序上传文件。由于这是Web应用程序时代的一个明显缺陷,很可能在下一个主要版本的iOS中添加此功能,尽管那可能还需要几个月的时间。


有点模糊("this works fine"),你能详细说明一下吗?你是说input type=file在Android 2.2+上能正常工作吗? - Travis J
它按照我描述的方式运作(所以“是的”:))!您至少可以从开箱即用的图库、相机和摄像机作为来源,并且还有其他选项,这些选项是由其他已安装/附带于用户操作系统的应用程序创建的(例如声音记录器、音乐、文件管理器)。如果您想自己尝试,请在Android SDK中运行模拟器并浏览到具有文件输入的站点。 - adamnfish

0

试试这个:

<input type="file" accept="image/*;capture=camera">

这应该在大多数移动浏览器中得到支持,并且应该为用户提供选择本地文件(图像)的机会,或者在一些现代设备上甚至允许他们在过程中捕获图像。

希望能对你有所帮助!


-1
使用Phonegap桥接客户端库和本地应用程序之间的差距。虽然客户端库提供了良好的处理方式和设置UI界面的简便方法,但您可以利用phonegap的功能执行特定于设备的操作,如摄像头、扫描、呼叫等。

1
PhoneGap不适用于移动Web应用程序。它只是允许您使用JavaScript编写应用程序,并将其部署类似于本机应用程序。 - Bot
同意,那么为什么要踩我呢?我说使用PhoneGap来弥合差距。请在踩之前仔细阅读我的回答。 - Liam

-1

Android(似乎是2.2之前的版本)和iOS中的移动浏览器不允许访问文件系统。当它在Android 2.2+上进行时,它并不是完全访问 - 它是通过像Gallery或Music这样的应用程序进行过滤的。


如果已知文件路径,是否可以从中获取图片? - Travis J
据我所知,没有这样的功能。我个人认为,浏览器阻止了fs来推动人们创建合法应用程序,从而增加了各自应用商店的流量。 - aknosis
2
这并不适用于Android!虽然Android没有内置文件系统管理器,但用户随时可以安装自己的管理器来暴露文件系统上传。即使没有这个,您仍然可以从其他应用程序中上传资源,例如图库(用于图片)和相机(用于拍摄新图片进行上传)。 - adamnfish

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接