The input implementation calls the local camera to take photos and take videos. The input camera
<! Doctype html> <Head> <meta charset = "UTF-8"> <! -- <Meta name = "viewport" content = "width = device-width, initial-scale = 1, maximum-scale = 1, minimum-scale = 1, user-scalable = no, minimal-ui "> --> <meta name =" viewport "content =" initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no "/> <meta name =" HandheldFriendly "content =" true "/> <meta name =" MobileOptimized "content =" 320 "/> <meta name = "apple-mobile-web-app-capable" content = "yes"> <meta name = "apple-mobile-web-app-status-bar-style" content = "black "> <title> input video test </title> <Body> <! -- Take a photo <input id = "myfile" type = "file" name = "file" accept = "image/*" capture = "camera"> --> // take a video <input type = "file" name = "video" id = "video-input" accept = "video/*" capture = "user" onchange = "videoChange () "/> <p style =" font-size: 14px "> Appendix: <br> only cameras can be started, you cannot select a file. <br> the live video size cannot exceed 8 Mb, the duration cannot exceed 6 seconds <br> <span id = 'info'> </span> </p> <video id = "video" width = '000000' height =" 300 "controls autoplay> </video>
<Script type = "text/javascript"> function videoChange () {var file = document. getElementById ('video-input '). files [0]; var fileSize = (Math. round (file. size/1024 )). toFixed (); document. getElementById ('info '). innerHTML + = "the recorded video size is about:" + (fileSize/1024 ). toFixed (2) + "Mb ";
Var url = URL. createObjectURL (file); console. log (url); document. getElementById ("video"). src = url ;}</script> </body>
</Html>