Instascan: android/chrome: ๋น„๋””์˜ค ์†Œ์Šค๋ฅผ ์‹œ์ž‘ํ•  ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค. NotReadableError

์— ๋งŒ๋“  2018๋…„ 05์›” 10์ผ  ยท  7์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: schmich/instascan

chrome/android์—์„œ getCameras()๋ฅผ ์‹œ๋„ํ•  ๋•Œ ๋‹ค์Œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค.

๋‚˜๋Š” https์—†์ด localhost๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์Šต๋‹ˆ๋‹ค.

Uncaught (in promise) {name: "NotReadableError", message: "Could not start video source", constraint: undefined, toString: ฦ’}constraint: undefinedmessage: "Could not start video source"name: "NotReadableError"toString: ฦ’ ()__proto__: constructor: ฦ’ Object()hasOwnProperty: ฦ’ hasOwnProperty()isPrototypeOf: ฦ’ isPrototypeOf()propertyIsEnumerable: ฦ’ propertyIsEnumerable()toLocaleString: ฦ’ toLocaleString()toString: ฦ’ toString()valueOf: ฦ’ valueOf()__defineGetter__: ฦ’ __defineGetter__()__defineSetter__: ฦ’ __defineSetter__()__lookupGetter__: ฦ’ __lookupGetter__()__lookupSetter__: ฦ’ __lookupSetter__()get __proto__: ฦ’ __proto__()set __proto__: ฦ’ __proto__()
step @ instascan.js:44
(anonymous) @ instascan.js:54
Promise.then (async)
step @ instascan.js:51
(anonymous) @ instascan.js:59
F @ instascan.js:416
(anonymous) @ instascan.js:38
start @ instascan.js:23709
getCameras @ QRScan.vue?54e3:51
Promise.then (async)
mounted @ QRScan.vue?54e3:68
callHook @ vue.esm.js?65d7:2921
insert @ vue.esm.js?65d7:4158
invokeInsertHook @ vue.esm.js?65d7:5960
patch @ vue.esm.js?65d7:6179
Vue._update @ vue.esm.js?65d7:2670
updateComponent @ vue.esm.js?65d7:2788
get @ vue.esm.js?65d7:3142
run @ vue.esm.js?65d7:3219
flushSchedulerQueue @ vue.esm.js?65d7:2981
(anonymous) @ vue.esm.js?65d7:1837
flushCallbacks @ vue.esm.js?65d7:1758

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

Chrome Android์˜ ํ”„๋กœ์ ํŠธ(instascan๊ณผ ๊ด€๋ จ์ด ์—†์Œ)์— ๋น„์Šทํ•œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.
์นด๋ฉ”๋ผ๋ฅผ ์ „ํ™˜ํ•˜๋ ค๊ณ  ํ•  ๋•Œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.
๋‚˜๋ฅผ ์œ„ํ•œ ํ•ด๊ฒฐ์ฑ…์€ ์ƒˆ ํŠธ๋ž™์„ ํš๋“ํ•˜๊ธฐ ์ „์— ํ™œ์„ฑ ์ŠคํŠธ๋ฆผ์˜ ๋ชจ๋“  ํŠธ๋ž™์„ ์ค‘์ง€ํ•˜๋Š” ๊ฒƒ์ด์—ˆ์Šต๋‹ˆ๋‹ค.

if(this.lastStream) {
  this.lastStream.getTracks().forEach(track => track.stop()) 
}

๊ทธ ํ›„ ์˜ค๋ฅ˜๊ฐ€ ์‚ฌ๋ผ์กŒ์Šต๋‹ˆ๋‹ค

๋ชจ๋“  7 ๋Œ“๊ธ€

์ž์ฒด ์„œ๋ช… ์ธ์ฆ์„œ๋ฅผ ์ถ”๊ฐ€ํ•˜์—ฌ https://localhost :8443์„ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ์ง€๋งŒ ๋ฌธ์ œ๊ฐ€ ํ•ด๊ฒฐ๋˜์ง€ ์•Š์•˜์Šต๋‹ˆ๋‹ค.

์ด๊ฒƒ์€ Android 7์—์„œ๋งŒ ๋ฌธ์ œ์ž…๋‹ˆ๋‹ค.

Android ๋ฒ„์ „ 4.1.2์—์„œ ๋™์ผํ•œ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค. ํ”„๋ก ํŠธ ์บ ์€ ๋ฌธ์ œ์—†์ง€๋งŒ ๋ฆฌ์–ด ์บ ์€ ๊ฐ™์€ ์—๋Ÿฌ๊ฐ€ ๋‚ฉ๋‹ˆ๋‹ค.

ํ…Œ์ŠคํŠธํ•œ ๋ชจ๋“  ๋ธŒ๋ผ์šฐ์ €์—์„œ ๋™์ผํ•œ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค.

ํ•ด๊ฒฐ์ฑ…์„ ์ฐพ์•˜์Šต๋‹ˆ๊นŒ?

Chrome Android์˜ ํ”„๋กœ์ ํŠธ(instascan๊ณผ ๊ด€๋ จ์ด ์—†์Œ)์— ๋น„์Šทํ•œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.
์นด๋ฉ”๋ผ๋ฅผ ์ „ํ™˜ํ•˜๋ ค๊ณ  ํ•  ๋•Œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.
๋‚˜๋ฅผ ์œ„ํ•œ ํ•ด๊ฒฐ์ฑ…์€ ์ƒˆ ํŠธ๋ž™์„ ํš๋“ํ•˜๊ธฐ ์ „์— ํ™œ์„ฑ ์ŠคํŠธ๋ฆผ์˜ ๋ชจ๋“  ํŠธ๋ž™์„ ์ค‘์ง€ํ•˜๋Š” ๊ฒƒ์ด์—ˆ์Šต๋‹ˆ๋‹ค.

if(this.lastStream) {
  this.lastStream.getTracks().forEach(track => track.stop()) 
}

๊ทธ ํ›„ ์˜ค๋ฅ˜๊ฐ€ ์‚ฌ๋ผ์กŒ์Šต๋‹ˆ๋‹ค

Chrome Android์˜ ํ”„๋กœ์ ํŠธ(instascan๊ณผ ๊ด€๋ จ์ด ์—†์Œ)์— ๋น„์Šทํ•œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.
์นด๋ฉ”๋ผ๋ฅผ ์ „ํ™˜ํ•˜๋ ค๊ณ  ํ•  ๋•Œ ์˜ค๋ฅ˜๊ฐ€ ๋ฐœ์ƒํ–ˆ์Šต๋‹ˆ๋‹ค.
๋‚˜๋ฅผ ์œ„ํ•œ ํ•ด๊ฒฐ์ฑ…์€ ์ƒˆ ํŠธ๋ž™์„ ํš๋“ํ•˜๊ธฐ ์ „์— ํ™œ์„ฑ ์ŠคํŠธ๋ฆผ์˜ ๋ชจ๋“  ํŠธ๋ž™์„ ์ค‘์ง€ํ•˜๋Š” ๊ฒƒ์ด์—ˆ์Šต๋‹ˆ๋‹ค.

if(this.lastStream) {
  this.lastStream.getTracks().forEach(track => track.stop()) 
}

๊ทธ ํ›„ ์˜ค๋ฅ˜๊ฐ€ ์‚ฌ๋ผ์กŒ์Šต๋‹ˆ๋‹ค

์ •๋ฅ˜์žฅ์ด ์–ด๋””์ธ์ง€ ๊ถ๊ธˆํ•˜์‹  ๋ถ„๋“ค์„ ์œ„ํ•ด navigator.mediaDevices.getUserMedia ๋ฐ”๋กœ ์•ž์— ์žˆ์Šต๋‹ˆ๋‹ค.

@Kukunin๋‹˜ โ€‹โ€‹๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰