是否可以编写为 iOS 设备(iPad、iPhone、iPod Touch)设计的 HTML5 Web 应用程序,允许用户从文件系统上传图像?
想象一下通过网络应用程序将新照片上传到您的 Twitter 头像。
更新:iOs 6 Safari 将支持从照片库上传视频和图像。
====
我讨厌这个词,但是,这是不可能的(现在)。以下是原因:
1) 移动 Safari 不支持上传任何内容。
2) mobile safari 无法访问 ios 组件(实际上可以,但只能通过 phonegap)
解决此问题的另一种方法是为用户提供一个私人电子邮件地址,他们可以将照片通过电子邮件发送到以进行自动上传(例如,photos+abc123@yoursite.com)。
需要做更多的设置工作,但将为所有设备上的用户提供一致的体验(非移动用户也可能会觉得它很方便)。
我喜欢 http://picupapp.com 的 picup 解决方案
我找到了一个可以接受的解决方法。在页面上添加一个带有预定义说明的 mailTo 链接,该链接向用户展示如何将其相机胶卷中的图像复制粘贴到电子邮件中。然后,编写一个作业/脚本来监听该收件箱中的入站电子邮件,剥离图像并进行相应的处理。
这并不完美,但他们单击 safari 中的链接,然后只需要转到照片、复制并返回到您的应用程序。在我的手机上尝试之后,它不仅仅是一个可以接受的解决方法,它允许我在不编写应用程序的情况下继续前进。
<div data-role="collapsible" data-collapsed="true" id="uploadPicContainer" data-theme="d">
<h3>{l t='Upload Picture'}</h3>
<a href="mailto:fotos@opina.com?subject={l t='My pictures of'} {$var_biz.bizname}[{$var_biz.id}]!&body={l t='To upload a picture go to your Camera Roll and copy paste an image to this area in the email. We will apply your picture after review!'}">{l t='Click here to upload pictures of'} {$var_biz.bizname}</a>
</div>
您将能够在 iOS 6 及更高版本中使用 safari 上传照片。尽管对于 iOS 5 及更低版本仍然需要上述解决方法。
iOS 6.0 上的 Safari 是第一个添加对 <input type="file">
的支持的,它允许您:
拍摄新视频或照片
从库中选择视频或照片
这是它在 iOS10 上的外观:
https://i.stack.imgur.com/XDnBv.png
iOS9 introduced iCloud Drive and More options including Dropbox。 iOS 6 到 8 只有第一个两个选项。
您可以使用 accept="image/*"
属性将文件类型限制为仅照片:
<input type="file" accept="image/*" >
会将选项限制为仅照片:
https://i.stack.imgur.com/8N1lN.png
在 Android 方面,Android 2.2+ 是第一个支持上述代码的。
免责声明:图片由处理视频录制的 Pipe 提供,我是 CTO
我刚刚想到的一个想法是有一个文本框,用户可以将 url 粘贴到其中,允许用户使用 Dropbox 或类似的应用程序并复制 Dropbox 文件的公共 url。然后服务器将能够从保管箱服务器下载。
我需要支持图像以外的文件类型,所以听起来 picupapp 对我不起作用。
仅适用于 iOS >= 6
<input type="file" accept="image/*" capture>
“捕获”不会改变 iOS 的任何内容,但它对其他设备仍然有用(显然是 Android,请参阅评论)。
capture="camera"
(字符串)已替换为 capture="capture"
。在这两种情况下,它都只适用于 Android。