Веб-приложение html5 для мобильного сафари для загрузки изображений из Photos.app?

Можно ли написать веб-приложение HTML5, предназначенное для устройств iOS (iPad, iPhone, iPod Touch), которые могут позволить пользователю загружать изображение из файловой системы?

Представьте себе, что вы загрузили новую фотографию в свой твиттер-аватар через веб-приложение.

Ответ 1

UPDATE: iOs 6 Safari будет поддерживать загрузку видео и изображений из Photo Library.

====

Я ненавижу это слово, но это невозможно (сейчас). Вот причины:

1) мобильное сафари не поддерживает загрузку.

2) мобильное сафари не может получить доступ к компонентам ios (на самом деле это возможно, но только через phonegap)

Ответ 2

Другой способ подойти к этой проблеме - предоставить пользователям частный адрес электронной почты, чтобы они могли отправлять свои фотографии по электронной почте для автоматической загрузки (например, [email protected]).

Немного больше работы по настройке, но обеспечит постоянный опыт для пользователей на всех устройствах (и пользователи, не являющиеся мобильными, могут также оказаться удобными).

Ответ 4

Я нашел для этого приемлемую работу. Добавьте ссылку MailTo на страницу с предопределенными инструкциями, которые показывают пользователю, как скопировать вставку изображения из его ролика камеры в электронное письмо. Затем запишите задание / script, которое прослушивает этот почтовый ящик для входящих писем, разделите изображение и обработайте его соответствующим образом.

Это не идеально, но они нажимают ссылку на сафари, а затем только нужно идти на фотографии, копировать и возвращаться к вашему приложению. Попробовав его на своем телефоне, это более чем приемлемая работа, которая позволяет мне двигаться вперед, не записывая приложение.

    <div data-role="collapsible" data-collapsed="true" id="uploadPicContainer" data-theme="d">
    <h3>{l t='Upload Picture'}</h3>
    <a href="mailto:[email protected]?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>

Ответ 5

Вы сможете загружать фотографии с помощью сафари в iOS 6 и далее. Хотя вышеупомянутые обходные решения по-прежнему будут необходимы для iOS 5 и ниже.

Ответ 6

Другое родное приложение iOS (похожее на Picup или iphone-photo-picker) Aurigma Up.

Ответ 7

Идея, о которой я только думал, состоит в том, чтобы иметь текстовое поле, в которое пользователь мог вставлять URL-адрес, позволяя пользователю использовать dropbox или подобное приложение и копировать публичный url из файла dropbox. Затем сервер сможет загружаться с сервера Dropbox.

Мне нужно поддерживать типы файлов, отличные от изображений, так что это похоже на то, что picupapp не будет работать для меня.

Ответ 8

Safari на iOS 6.0 является первой, чтобы добавить поддержку <input type="file">, разрешив вам:

  • взять новое видео или фотографию
  • выберите видео или фотографию из библиотеки.

Вот как это выглядит на iOS10:

iOS 10 file input no filter

iOS9 представил iCloud Drive и дополнительные опции, включая Dropbox. В iOS с 6 по 8 были только первые два варианта.

Вы можете ограничить типы файлов только фотографиями с помощью атрибута accept="image/*":

<input type="file" accept="image/*" > ограничит параметры только фотографиями:

iOS 10 для ввода файлов для фотографий

На стороне Android Android 2.2 + является первой для поддержки вышеуказанного кода.

Отказ от ответственности: изображение предоставлено Pipe, которое обрабатывает видеозапись, где я - технический директор

Ответ 9

Если вы все еще используете iOS5, рассмотрите возможность использования iCab Mobile. Получил это для моего ipad и (по крайней мере для меня) загрузка файлов работает нормально.

С уважением, Петр

Ответ 10

Только для iOS >= 6

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

"захват" ничего не меняет с iOS, но он по-прежнему полезен для других устройств (по-видимому, Androids, см. комментарии).