文章/答案/技术大牛

发布

社区首页 >问答首页 >desktopCapturer例子..。如何使它适用于特定的应用程序

问desktopCapturer例子..。如何使它适用于特定的应用程序
EN

Stack Overflow用户

提问于 2020-09-16 19:42:14

回答 1查看 1.1K关注 0票数 1

我试着遵循这个教程：https://www.tutorialspoint.com/electron/electron_audio_and_video_capturing.htm

本教程的第一部分效果很好.我可以用我的个人电脑摄像头和麦克风.进入我的电子应用程序。但是现在我正在尝试通过desktopCapturer对象从我的windows桌面上运行的特定应用程序中流音频和视频。

问题

我不会犯任何错误的。但是这个电子应用程序的视频html标签并没有显示来自myappthatstreamsAV的流。

码

我更改了我的index.html代码如下：(只是改变了标签内的内容)

<!DOCTYPE html>
<html>
   <head>
      <meta charset = "UTF-8">
      <title>Audio and Video</title>
   </head>
   
   <body>
      <video autoplay></video>
      <script type = "text/javascript">
        var desktopCapturer = require('electron').desktopCapturer;
        desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
        if (error) throw error
         desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
            if (error) throw error
            for (let i = 0; i < sources.length; ++i) {
               if (sources[i].name === 'myappthatstreamsAV') {
                  navigator.webkitGetUserMedia({
                     audio: true,
                     video: {
                        mandatory: {
                           chromeMediaSource: 'desktop',
                           chromeMediaSourceId: sources[i].id,
                           minWidth: 1280,
                           maxWidth: 1280,
                           minHeight: 720,
                           maxHeight: 720
                        }
                     }
                  }, handleStream, handleError)
                  return
               }
            }
         })

         function handleStream (stream) {
            document.querySelector('video').src = URL.createObjectURL(stream)
         }

         function handleError (e) {
            console.log(e)
         }
      </script>
   </body>
</html>

index.js看起来是这样的：

const {app, BrowserWindow} = require('electron')
const url = require('url')
const path = require('path')

let win

// Set the path where recordings will be saved
app.setPath("userData", __dirname + "/saved_recordings")

function createWindow() {
   win = new BrowserWindow({width: 800, height: 600,
      webPreferences: {
         nodeIntegration: true
     }
   })
   win.loadURL(url.format({
      pathname: path.join(__dirname, 'index.html'),
      protocol: 'file:',
      slashes: true
   }))
}

app.on('ready', createWindow)

到目前为止我尝试过的：

我添加了一些调试语句，如：

  <script type = "text/javascript">
     var desktopCapturer = require('electron').desktopCapturer;
     console.log("1")
     console.log(desktopCapturer)
     desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
        console.log("2")
        if (error) throw error
        for (let i = 0; i < sources.length; ++i) {
           console.log((sources[i].name));
           console.log("3")

基本上，它只执行前两个console.logs：

     console.log("1")
     console.log(desktopCapturer)

它永远不会达到2或3。

node.js

electron

回答 1

Stack Overflow用户

发布于 2020-09-16 20:53:57

更改代码如下：

     var desktopCapturer = require('electron').desktopCapturer;
     console.log("are you here?")
     console.log(desktopCapturer)

     desktopCapturer.getSources({ types: ['window', 'screen'] }).then(async sources => {
        for (const source of sources) {
           if (source.name === 'mystreamApp') {
              try {
              const stream = await navigator.mediaDevices.getUserMedia({
                 audio: true,
                 video: {
                    mandatory: {
                    chromeMediaSource: 'desktop',
                    chromeMediaSourceId: source.id,
                    minWidth: 1280,
                    maxWidth: 1280,
                    minHeight: 720,
                    maxHeight: 720
                    }
                 }
              })
              handleStream(stream)
              } catch (e) {
              handleError(e)
              }
              return
           }
        }
        })

        function handleStream (stream) {
        const video = document.querySelector('video')
        video.srcObject = stream
        video.onloadedmetadata = (e) => video.play()
        }

        function handleError (e) {
        console.log(e)
        }

现在我看到了视频流。音频仍然不工作。但我要问另一个问题。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/63926964

复制

相似问题

问desktopCapturer例子..。如何使它适用于特定的应用程序
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问desktopCapturer例子..。如何使它适用于特定的应用程序EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问desktopCapturer例子..。如何使它适用于特定的应用程序
EN