Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[html] 第161天 HTML5如何调用摄像头? #1251

Open
haizhilin2013 opened this issue Sep 23, 2019 · 5 comments
Open

[html] 第161天 HTML5如何调用摄像头? #1251

haizhilin2013 opened this issue Sep 23, 2019 · 5 comments
Labels
html html

Comments

@haizhilin2013
Copy link
Collaborator

第161天 HTML5如何调用摄像头?

@haizhilin2013 haizhilin2013 added the html html label Sep 23, 2019
@forever-z-133
Copy link

后者是前者的新版本,设备支持率都很差

@vkboo
Copy link

vkboo commented Sep 24, 2019

有两种API

  • navigator.getUserMedia(已废弃,不建议使用)
var constraints = {
    video: true,
    audio: false
};
var media = navigator.getUserMedia(constraints, function (stream) {
    var v = document.getElementById('v');
    var url = window.URL || window.webkitURL;
    v.src = url ? url.createObjectURL(stream) : stream;
    v.play();
}, function (error) {
    console.log("ERROR");
    console.log(error);
});
  • navigator.mediaDevices.getUserMedia
const constraints = {
    video: true,
    audio: false
};
let promise = navigator.mediaDevices.getUserMedia(constraints);
promise.then(stream => {
    let v = document.getElementById('v');
    // 旧的浏览器可能没有srcObject
    if ("srcObject" in v) {
        v.srcObject = stream;
    } else {
        // 防止再新的浏览器里使用它,应为它已经不再支持了
        v.src = window.URL.createObjectURL(stream);
    }
    v.onloadedmetadata = function (e) {
        v.play();
    };
}).catch(err => {
    console.error(err.name + ": " + err.message);
})

@Pooo-hxp
Copy link

请问PC端和移动端只有这两个吗?没搜到其它的

@klren0312
Copy link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
html html
Projects
None yet
Development

No branches or pull requests

6 participants
@haizhilin2013 @klren0312 @vkboo @forever-z-133 @Pooo-hxp and others