zoukankan      html  css  js  c++  java
  • Android 录制屏幕的实现方法

    Android 录制屏幕的实现方法

    Chrome   2017-02-15 15:32:01 发布
    您的评价:
         
    5.0  
    收藏     0收藏

    长久以来,我一直希望能够直接从Android屏幕上进行录制并将其编码为多种格式,以便将录制内容嵌入在任意位置,而不需要安装任何软件。

    如今,我们已经接近这个目标。Chrome团队正在添加一种功能,可以通过getUserMedia从Android设备上共享屏幕。我创建了一个原型来录制屏幕并将录制内容流式传输到其他设备,以便将其录制到文件并为其添加设备帧。

    虽然WebRTC有很多复杂的细节,但总体而言,该基础架构并没有那么复杂。

    录制过程分为两个阶段:

    1.在本地捕获(并可选择在本地录制);

    2.传输到远程桌面。

    捕获屏幕

    getUserMedia是一个十分有用的API。通过它可直接在网页中以内联方式实时访问任何摄像头或麦克风。getUserMediaAPI可用于请求仅连接到某些类型的设备。例如,通过设置参数{audio:true},可请求仅连接至支持音频的设备,而通过设置{video:{'mandatory': {1920,height:1080}}},可指示仅连接至高清摄像头。

    Chrome即将推出一个新的参数{'chromeMediaSource':'screen'},该参数制定Chrome应使用屏幕作为流媒体源。

    它当前位于标记之后,完全是实验性质。在Android上,需要开启chrome://flags#enable-usermedia-screen-capturing来启用它。您也可以跟踪Chrome错误487935的实现情况。

    const constraints = {

    audio: false, // mandatory.

    video: {'mandatory': {'chromeMediaSource':'screen'}}

    };

    const successCallback = (stream) => {

    // Do something with the stream.

    //Attach to WebRTC connections

    //Record via MediaRecorder

    };

    consterrorCallback = () => {

    //We don't have access to the API

    };

    navigator.getUserMedia(constraints,successCallback, errorCallback);

    这就是全部代码。

    当然,这是从技术上而言。在实际中,您不会直接获得访问权限。用户需要向getUserMedia的媒体流授予访问权限(与往常一样),由于此API的这项功能十分强大,用户必须明确选择使用它才能共享自己的屏幕。一旦用户明确选择使用此功能,系统就会明确指示他们在共享屏幕。

    现在,您已经有了可存储在本地的屏幕流,您也可以通过WebRTC将它传输到外部位置。

    通过MediaRecorder可在本地录制屏幕,正如我在WebGL录制代码段中所做的那样。我还创建了一个简单的演示,可对屏幕录制10秒,再将录制的内容下载到您的设备上。

    (function(){

    //Download locally

    functiondownload(blob) {

    varurl = window.URL.createObjectURL(blob);

    vara = document.createElement('a');

    a.style.display= 'none';

    a.href= url;

    a.download= 'test.webm';

    document.body.appendChild(a);

    a.click();

    setTimeout(function(){

    document.body.removeChild(a);

    window.URL.revokeObjectURL(url);

    },100);

    }

    constsuccessCallback = (stream) => {

    //Set up the recorder

    letblobs = [];

    letrecorder = new MediaRecorder(stream, {mimeType: 'video/webm; codecs=vp9'});

    recorder.ondataavailable= e => { if (e.data && e.data.size > 0) blobs.push(e.data)};

    recorder.onstop= (e) => download(new Blob(blobs, {type: 'video/webm'}));

    //Record for 10 seconds.

    setTimeout(()=>recorder.stop(), 10000);

    //Start recording.

    recorder.start(10);// collect 10ms chunks of data

    };

    consterrorCallback = (err) => {

    //We don't have access to the API

    console.log(err)

    };

    navigator.getUserMedia({

    audio:false,

    video:{'mandatory': {'chromeMediaSource':'screen'}}

    },successCallback, errorCallback);

    })();

    来自:http://www.jianshu.com/p/5055c29173df

  • 相关阅读:
    tensorflow 2.0 学习 (十) 拟合与过拟合问题
    tensorflow 2.0 学习 (九) tensorboard可视化功能认识
    tensorflow 2.0 学习 (八) keras模块的认识
    tensorflow 2.0 学习 (七) 反向传播代码逐步实现
    tensorflow 2.0 学习 (六) Himmelblua函数求极值
    tensorflow 2.0 学习 (五)MPG全连接网络训练与测试
    arp协议简单介绍
    Pthread spinlock自旋锁
    线程和进程状态
    内核态(内核空间)和用户态(用户空间)的区别和联系·
  • 原文地址:https://www.cnblogs.com/developer-ios/p/6517358.html
Copyright © 2011-2022 走看看