Hi, first of all thanks for this cool add-on. Is there any trick to run th

Directory ZXingVaadin
1

Hi, first of all thanks for the cool add-on.

Is there any trick to run this on mobile devices (especially on iPad). The demo works…but if I implement it, it doesn’t. Only a gray rectangle is visible and the question for camera access does not show up.

@Route("")
public class BarcodeScanner extends VerticalLayout {

	public BarcodeScanner() {
		ZXingVaadinReader zXingVaadin = new ZXingVaadinReader();
		zXingVaadin.setFrom(From.camera);
		zXingVaadin.setWidth("350");
		zXingVaadin.setStyle("border : 1px solid gray");
		add(zXingVaadin);
	}
}

Best
Jan

2

Is the demo working on your mobile? or you try to test it by another phone?

3

The demo works on all devices.
I have tested it on PC, iPhone, iPad and Samsung.
My implementation (code from above) does not work on mobile devices.
Im using Version 1.0.2 and Vaadin Version 14.6.5

I got this Problem on my Samsung phone:

Uncaught (in promise) TypeError: Cannot read property 'getUserMedia' of undefined
    at t.BrowserMultiFormatReader.<anonymous> (vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323)
    at Generator.next (<anonymous>)
    at vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323
    at new Promise (<anonymous>)
    at R (vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323)
    at t.BrowserMultiFormatReader.decodeFromConstraints (vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323)
    at t.BrowserMultiFormatReader.<anonymous> (vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323)
    at Generator.next (<anonymous>)
    at vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323
    at new Promise (<anonymous>)
    at R (vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323)
    at t.BrowserMultiFormatReader.decodeFromVideoDevice (vaadin-bundle-12d749d0cdef9608e99a.cache.js:2323)
    at HTMLElement.videoDevice (vaadin-bundle-12d749d0cdef9608e99a.cache.js:4738)
    at HTMLElement.updated (vaadin-bundle-12d749d0cdef9608e99a.cache.js:4738)
    at HTMLElement.performUpdate (vaadin-bundle-12d749d0cdef9608e99a.cache.js:228)
    at HTMLElement._enqueueUpdate (vaadin-bundle-12d749d0cdef9608e99a.cache.js:228)
4

I solved the problem. This error is due to chrome and other browsers block microphone access to not https sites.

5

Maybe you need to add zXingVaadin.setId(“video”); to your code.

6

Cool

7

So i am trying to just test this feature in localhost, how did you get it to work or what workaround did you get? Please help :,( !!!