Question

我正在使用GitHub中的示例代码在网页（https://github.com/collab-project/videojs-record）上录制视频。该网页完全可以在我的计算机上使用。但是，当我使用FTP将文件上传到服务器时，网页会显示播放器，但单击播放器时不会记录。

我尝试更改FTP的权限以允许读取，写入和执行，但是仍然无法正常工作。当我从浏览器的“查看页面源代码”中单击它们时，将打开javascript和CSS文件。

    <!doctype html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>Audio/Video Example - Record Plugin for Video.js</title>

      <link href="video-js.min.css" rel="stylesheet">
      <link href="videojs.record.min.css" rel="stylesheet">
      <link href="examples.css" rel="stylesheet">

      <script src="video.min.js"></script>
      <script src="RecordRTC.js"></script>
      <script src="adapter.js"></script>

      <script src="videojs.record.min.js"></script>

      <script src="browser-workarounds.js"></script>

      <style>
      /* change player background color */
      #myVideo {
          background-color: #9ab87a;
      }
      </style>
    </head>
    <body>

    <video id="myVideo" playsinline class="video-js vjs-default-skin">
      <p class="vjs-no-js">
        To view this video please enable JavaScript, or consider upgrading to     
        a
        web browser that
        <a href="https://videojs.com/html5-video-support/" target="_blank">
      supports HTML5 video.
        </a>
      </p>
    </video>

    <script>
    var options = {
        controls: true,
        width: 320,
        height: 240,
        plugins: {
            record: {
                audio: true,
                video: true,
                maxLength: 10,
                debug: true
            }
        }
    };

    // apply some workarounds for certain browsers
    applyVideoWorkaround();

    var player = videojs('myVideo', options, function() {
        // print version information at startup
        var msg = 'Using video.js ' + videojs.VERSION +
            ' with videojs-record ' + videojs.getPluginVersion('record') +
            ' and recordrtc ' + RecordRTC.version;
        videojs.log(msg);
    });

    // error handling
    player.on('deviceError', function() {
        console.log('device error:', player.deviceErrorCode);
    });

    player.on('error', function(element, error) {
        console.error(error);
    });

    // user clicked the record button and started recording
    player.on('startRecord', function() {
        console.log('started recording!');
    });

    // user completed recording and stream is available
    player.on('finishRecord', function() {
        // the blob object contains the recorded data that
        // can be downloaded by the user, stored on server etc.
        console.log('finished recording: ', player.recordedData);
    });
    </script>

    </body>
    </html>

点击播放器后，我希望能够从网络摄像头进行录制。但是它仅显示播放器，而当我单击播放器时不记录。没有错误消息。

Answer 1

这是我的猜测：在本地计算机上，您的来源是 http://localhost 。由于它是本地的，因此它是一个安全的上下文。当您将其上传到服务器时，它突然变成 http://yourdomain.com 。这是不是安全上下文，因为它不是通过https加载的。尝试使用certbot获取SSL证书并启用它以获取安全上下文。您**需要一个安全的上下文来访问用户的相机

Answer 2

该网站是否有https？在不安全的网站上，Chrome上的音频和视频录制存在问题。另一方面，Firefox在这种情况下可以正常工作。

如果是这种情况，我建议您获得ssl证书，例如，通过加密，它是免费的。

该脚本可以在我的计算机上运行，但是当我将其上传到服务器时不起作用

2 个答案:

该脚本可以在我的计算机上运行，​​但是当我将其上传到服务器时不起作用

2 个答案:

该脚本可以在我的计算机上运行，但是当我将其上传到服务器时不起作用