5

I have a webpage with PWA capabilities.

On iOS safari I do get the usual OS dialog asking me if I want to take a photo or upload a picture from the photo library:

enter image description here

After "installing" it as an PWA via the menu "Add to Homescreen" button and starting it via homescreen, I still get the same options, "choose from library" still works, but when choosing "take a photo", the iOS camera app opens, as expected, but stays completely black.

html:

<head>

  <meta charset="utf-8">
  <title>dingsda user interface 2</title>

  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="mobile-web-app-capable" content="yes">
  <link rel="manifest" href="manifest.json">

  (...)

  <label class="fileContainer ui-btn">
    <input type="file" accept="image/jpeg" id="photo_upload" multiple data-role="none"/>
   </label>

only javascript connected:

document.getElementById("photo_upload").addEventListener("change",
function(){
  console.log("got pic, will resize now:");
  resizeBase64image(document.getElementById("photo_upload"),
  function(base64img){
    console.log("resized pic. will add it to src");
    document.getElementById("addPhoto").src = base64img;
  });
});

I have no ideas, nor did I find any clues about limitations. Also: it seems like it should not prompt the dialog nor the photo app anyhow. I am happy for any suggestions. either to fix it with HTML file-input or (if possible) alternatives.

gaugau
  • 765
  • 1
  • 9
  • 30

3 Answers3

1

It did not work till iOS 11.3 but all Versions from 11.3 upwards might be okay:

More Details to that can be also found here: How to access camera on iOS11 home screen web app?

I could test with different devices with iOS Versions 11.4+ and confirm: works on those. Not tested with 12 and above though.

gaugau
  • 765
  • 1
  • 9
  • 30
0

Actually when i try to record video

enter image description here

Thx08
  • 1
  • 3
  • 1
    please describe what happens when you try to record video. the screenshot itself does not show how that adds anything to answer the question. Is it, that video input does work within a PWA but only file input for pictures does not work? or do you mean sth else? thank you! – gaugau Feb 27 '19 at 11:33
  • @gauguerilla the screen blur. I also have this issue now on PWA. But it's only on IOS. Android is working perfectly – deanwilliammills Jul 29 '22 at 13:19
0

Add capture (camera, camcorder or filesystem) to input file

<label class="fileContainer ui-btn"> <input type="file" accept="image/jpeg" id="photo_upload" multiple data- role="none" capture="camera"/> </label>

brudek
  • 171
  • 1
  • 5