Question

如果我这样写，视频就不再显示了

navigator.getMedia({
  video: {
    width:300,
    height:300,
    facingMode: "environment"
  }, 
  audio: false 
},

将出现以下视频，但尺寸错误

navigator.getMedia({
  video: {
    facingMode: "environment"
  }, 
  audio: false 
},

如果我在html视频标签中将宽度和高度设置为方形，并为其添加边框，相机仍然按照自己的比例，方形的边将留空。

图片链接： http://m.qpic.cn/psb?/714818507/CGRo3c1MM8BIp1iMvuMp2JxDwz2H0YNzUnWdB26vYvc!/b/dGgBAAAAAAAA&bo=vAKAAgAAAAARFxw!&rf=viewer_4

<video id="video" width="300px" height="300px" autoPlay playsInline></video>

顺便说一下，在iPhone safari浏览器中，写了react.js。非常感谢！

Answer 1

这是错误的：

function Test-ParameterSets1
{
    [CmdletBinding()]
    param (
        [Parameter(Mandatory=$true, ValueFromPipeline=$true, ParameterSetName="Str")] [string] $StringInput,
        [Parameter(Mandatory=$true, ValueFromPipeline=$true, ParameterSetName="Test")] [TestType] $TestInput
    )
    begin {
        $result = New-Object Object | Select-Object –Property @{n='FunctionName';e={$PSCmdlet.MyInvocation.InvocationName}},@{n='BeginParameterSetName';e={$PSCmdlet.ParameterSetName}}
    }
    process {
        $result | Add-Member -MemberType NoteProperty -Name ProcessParameterSetName -Value $PSCmdlet.ParameterSetName -PassThru `
        | Add-Member -MemberType NoteProperty -Name StringInput -Value $StringInput -PassThru `
        | Add-Member -MemberType NoteProperty -Name TestInput -Value $TestInput
    }
    end {
        $result
    }
}
'string' | Test-ParameterSets1
New-Object TestType | Test-ParameterSets1


FunctionName            : Test-ParameterSets1
BeginParameterSetName   : __AllParameterSets
ProcessParameterSetName : Str
StringInput             : string
TestInput               : 

FunctionName            : Test-ParameterSets1
BeginParameterSetName   : __AllParameterSets
ProcessParameterSetName : Test
StringInput             : 
TestInput               : TestType

Square不是标准的，但你可以做到。

让我们试试：

<video id="video" width="300px" height="300px" autoPlay playsInline></video>

将视频播放器看作普通的html元素没什么特别的。只需设置css即可。

您可以使用px介绍样式arg：

<video id="video" width="300" height="300" autoPlay playsInline></video>

另外我建议480宽度和320高度。

Answer 2

您无法从任意宽高比的相机中获得getUserMedia()视频。您将获得的图片通常是4：3或16：9。使用HTML和CSS正确放置它是你的工作。在您的情况下，这意味着放大图像并切掉它的顶部和底部，这样您就只能显示中心的正方形区域。

修改：你去，好看，方正（使用this answer的修正）：https://jsfiddle.net/mp244ptf/8/

webRTC如何在iPhone Safari浏览器中设置视频宽度高度

2 个答案: