用于移动浏览器的html5网络应用程序,可以从Photos.app上传图像?


92

是否可以编写专为iOS设备(iPad,iPhone,iPod Touch)设计的HTML5 Web应用程序,该应用程序允许用户从文件系统上载图像?

想象一下通过网络应用程序将新照片上传到您的Twitter头像。

Answers:


98

更新: iOs 6 Safari将支持从照片库上传视频和图像。

====

我讨厌这个词,但是(现在)是不可能的。原因如下:

1)移动浏览器不支持上传任何内容。

2)手机浏览器无法访问ios组件(实际上可以,但是只能通过phonegap


7
你是对的,这是一个可恶的词!我的研究表明了同样的事情,我实在受不了了,所以在这里被问到。谢谢你的回答。
阿比克

2
我不明白的是,为什么苹果不让图片/视频文件夹暴露,而不是害怕暴露整个系统。
fasih.rana

1
任何指向iOS Safari文档的链接,以引用如何在iOS中实现图像上传?谢谢!
detj 2012年

啊! 它会自动执行。没有麻烦:)
detj 2012年

您可以使用HTML 5在iOS Safari浏览器中发布一些文件上传代码吗?
Karthick

28

解决此问题的另一种方法是为用户提供一个私人电子邮件地址,他们可以将照片通过电子邮件发送到该地址以自动上传(例如,photos+abc123@yoursite.com)。

要做更多的工作,但可以为所有设备上的用户提供一致的体验(非移动用户也可能会觉得方便)。


我想知道如何做到这一点,我的意思是,用户发送带有附件,照片或视频的电子邮件,如何提取该信息并将其保存到数据库中,并将相关信息张贴在正确的位置,将照片发布到图像文件夹,以及将视频视频文件夹......必须有一个脚本已经可以做到这一点...或者类似的东西..
油轮

@Tanker是的,您的应用程序必须定期检索电子邮件,获取附件并保存更改。我过去曾使用ChilKat电子邮件库,尽管我会警告您它在32/64位之间编译并不总是很好(对我来说-ymmv)。
brichins 2014年

9

我喜欢http://picupapp.com上的picup解决方案


一个教程。Picup的一个问题是它将图片上传到第三方服务器(imgur.com),这会造成很多许可/隐私问题。Imgur的服务条款基本上说他们拥有图片,并且您不能将其用于商业目的。
伊恩·邓恩

2
@Ian Dunn:Picup可以配置为将图像上传到您喜欢的任何URL。Imgur只是默认设置。
乔治,2012年

8

我找到了可以接受的解决方案。在页面上添加带预定义说明的mailTo链接,该链接向用户显示如何将其胶卷中的图像粘贴粘贴到电子邮件中。然后,编写一个作业/脚本,侦听该收件箱中的入站电子邮件,剥离图像并进行相应处理。

这并不完美,但是他们点击了野生动物园的链接,然后只需要转到照片,复制并返回到您的应用即可。在手机上尝试过之后,它不仅可以接受,而且可以让我无需编写应用即可继续前进。

    <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>

您更容易接受它,因为您知道局限性-我很好奇看到非开发人员对此类应用程序的响应。这是一种有趣的解决方法,它依赖于用户已经熟悉的另一种方法-它可能也可以用于我尝试做的事情。
Angelo R.

是的 这是一个好主意。必须有一个脚本来解析附件。Zend Framework为此提供了一些不错的组件。
Svetoslav Marinov 2012年

6

从iOS 6开始,您将可以使用野生动物园上传照片。尽管上述变通办法对于iOS 5及以下版本仍然是必需的。


2
您在iOS 6上有任何使用说明吗?
Wim Deblauwe 2012年


2

<input type="file">通过允许您执行以下操作,iOS 6.0上的Safari是第一个添加支持的功能:

  • 拍摄新的视频或照片
  • 从图库中选择视频或照片

这是在iOS10上的外观:

iOS 10文件输入无过滤器

iOS9引入了iCloud Drive和包括Dropbox在内的更多选项。iOS 6至8仅具有前两个选项。

您可以使用accept="image/*"属性将文件类型限制为仅照片:

<input type="file" accept="image/*" > 会将选项限制为仅照片:

用于照片的iOS 10文件输入

在Android方面,Android 2.2+是第一个支持以上代码的应用。

免责声明:图片由Pipe提供,在我是CTO的地方处理视频记录


1

我刚刚想到的一个想法是有一个文本框,用户可以将URL粘贴到其中,从而允许用户使用Dropbox或类似的应用程序并复制Dropbox文件的公共URL。然后,该服务器将能够从保管箱服务器下载。

我需要支持图片以外的文件类型,所以听起来picupapp对我不起作用。



0

仅适用于iOS> = 6

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

“捕获”在iOS上不会发生任何变化,但对于其他设备(显然是Android,请参见注释)仍然有用。


capture="camera"(字符串)已capture="capture"在W3C候选推荐书中替换。在这两种情况下,它仅适用于Android。
Octavian Naicu '16

@OctavianNaicu很有道理。我已经编辑了回复。感谢您的信息
ERDAL G.
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.