schmich / instascan

HTML5 QR code scanner using your webcam
https://schmich.github.io/instascan/
MIT License
2.96k stars 863 forks source link

Rear camera (ios) #105

Open marvinex123 opened 6 years ago

marvinex123 commented 6 years ago

Hello, i have an issue, i cant switch from front to rear camera.

I tried with cameras[1] <- works great on Android device, for iOS is still front camera I tried with video: { facingMode: 'environment'} <- then camera dont display

Do u know how to force rear Camera on iOS ?

BestRegards

JoseCDB commented 6 years ago

You have to change the facingMode parameter to "environment"

ghost commented 6 years ago

JoseCDB, Could you provide example, please?

ghost commented 6 years ago

My Code is:

Instascan.Camera.getCameras().then(function (cameras) { //for example i have two devices - [0,1] scanner.start(cameras[1]); }

There is no difference what kind of number I set (0 or 1), the front camera is always displayed

JoseCDB commented 6 years ago

Hi rus-bit,

I forked instascan with some changes to make it work on my project. Basically you have to change the facingMode to "environment".

This change is in camera.js file

You can check it out here: https://github.com/JoseCDB/instascan/tree/ios-rear-camera

Hope it helps

ghost commented 6 years ago

JoseCDB, thank you!

Please , How can i get instascan.min.js from you source code? The Folder distr does not exist.

labregowski commented 6 years ago

@JoseCDB I have the same question as @rus-bit , could you point us in the right direction on how to make a min.js from the source? If you are from PT, Lisbon or Porto, I'll pay you a coffee. :)

ghost commented 6 years ago

Hello @labregowski.

I succeeded to build instascan.js file from @JoseCDB fork from https://github.com/JoseCDB/instascan/tree/ios-rear-camera.

But now, i haven't any IOS device to check correct work

instascan.zip

labregowski commented 6 years ago

Hi @rus-bit. Thanks for remembering me. Have you noticed that Clamav detects a threat in the instascan.min.js you sent? I think it is a false positive but..... probably has something to do with some component that PallasKatze added.

I'll try to get an iOS device to test this soon.

Could you tell me how did you build the instascan.min.js? I am still not being able to do it. I'd be thankful to you.

ghost commented 6 years ago

Hi, @labregowski

You must install gulp, and many dependecies, listed in file gulpfile.js and package.json

then see output to resolve any problems.

my package.json file fragment: "devDependencies": { "babel-plugin-syntax-async-functions": "^6.8.0", "babel-plugin-transform-regenerator": "^6.9.0", "babel-preset-es2015": "^6.9.0", "babelify": "^7.3.0", "browserify": "^13.3.0", "gulp": "^3.9.1", "gulp-rename": "^1.2.2", "gulp-uglify": "^1.5.4", "vinyl-buffer": "^1.0.1", "vinyl-source-stream": "^1.1.2" }, "dependencies": { "babel": "^6.23.0", "babel-cli": "^6.26.0", "babel-core": "^6.26.0", "babel-plugin-transform-runtime": "^6.23.0", "babel-polyfill": "^6.26.0", "babel-preset-latest": "^6.24.1", "fsm-as-promised": "^0.13.2", "visibilityjs": "^1.2.6", "webrtc-adapter": "^1.4.0" }

Hope it helps

labregowski commented 6 years ago

Hi @rus-bit . A friend with iOS 11 tested and it is not working : P It requests camera access but, then, nothing.

BUt might be related to the parameters in the script (not the instascan.min,js)

Instascan.Camera.getCameras().then(function (cameras) {
        if (cameras.length > 0) {
          scanner.start(cameras[1]);
        } else {
          console.error('No cameras found.');
        }

Might I need to change this? what do you think?

ghost commented 6 years ago

hi @labregowski . We tested too, and it works fine. See example. https://github.com/rus-bit/QrCodeHtmlScanner