小编spa*_*ote的帖子

HTML5/Javascript - DataURL到Blob和Blob到DataURL

我有一个显示我的网络摄像头的画布的DataURL.我使用Matt的答案将此dataURL转换为blob:如何在javascript中将dataURL转换为文件对象?

如何将此blob转换回相同的DataURL?我花了一天的时间研究这个问题并且我很震惊,除非我失明,否则没有更好的记录.

编辑:有

var urlCreator = window.URL || window.webkitURL; 
var imageUrl = urlCreator.createObjectURL(blob); 
Run Code Online (Sandbox Code Playgroud)

但它只返回一个看似指向本地文件的非常短的URL,但我需要通过网络发送网络摄像头数据.

javascript html5 blob

27
推荐指数
3
解决办法
4万
查看次数

将<video>元素的大小调整为父div

有没有人能够成功地将video元素调整为父div?

我的视频元素包含一个带有的网络摄像头流ratio of 4:3.我想打破比率并将其调整为div大小.我尝试过以下方法:

  • 设置width and height 100%>这没有做任何事情,4:3仍然存在
  • 设置min-height and min-width 100%>这使视频调整大小到溢出div的东西
  • position:absolute, bottom, top, left and right: 0px 父母div也有巨大的流量
  • 使用javascript获取父div的高度和宽度,然后为视频设置:无效,4:3比率保持不变,没有大小变化.

怎么做?

编辑:感谢Gaurav的详细回复.看起来不错,我希望它对我有用.

.parentDiv // Results in around 400x400 pixels for me
{
    position: absolute;
    top: 11px;
    right: 10px;
    left: 10px;
    height: -webkit-calc(50% - 18px);
    height: calc(50% - 18px); 
    display: block;
} 
Run Code Online (Sandbox Code Playgroud)

我的视频元素在那里,我给了你的CSS解决方案.不幸的是它只变白了.我的parentDiv css可以与此有关吗?

编辑2:这是HTML:

<div class="parentDiv"> 
    <video class="cam_video" autoplay></video>                      
</div>
Run Code Online (Sandbox Code Playgroud)

这主要是它.视频的src属性设置为我的网络摄像头流.

编辑3:

如果我右键单击并检查此屏幕截图https://s22.postimg.cc/th4ha8nmp/ratio2.png中的白色(现为红色潦草)部分,Chrome会向我显示白色也属于流.

似乎网络摄像头的流在顶部和底部都带有白色条纹.这太烦人了.

css video html5

24
推荐指数
4
解决办法
6万
查看次数

WebRTC - 我需要指定多少个STUN/TURN服务器?

我遇到的麻烦NAT traversalWebRTC.视频流可以与某些人合作,但与在学生宿舍路由器后面的人不同.

我认为这应该通过使用TURN服务器来解决.我已经这样做了,它仍然无法工作,现在我想知道TURN服务器是否正常工作.因此,我想知道我是否可以或应该设置多个TURN服务器,如果是,如何.

在另一个线程中找到了这个STUN/TURN服务器列表.现在我正在设置它们

var STUN = {
    'url': 'stun:stun.l.google.com:19302',
};

var TURN = {
    url: 'turn:homeo@turn.bistri.com:80',
    credential: 'homeo'
};

var iceServers = 
{
    iceServers: [STUN, TURN]
};

var pc = new RTCPeerConnection(iceServers);
Run Code Online (Sandbox Code Playgroud)

所以我的问题基本上是:是否可以设置几个STUN/TURN服务器?如果可能,我应该这样做,那代码会是什么样的?

javascript stun webrtc

21
推荐指数
3
解决办法
2万
查看次数

RTCPeerConnection初学者教程?

有谁知道任何好的RTCPeerConnection教程?

我想从浏览器到浏览器直播网络摄像头.我有websocket从我的服务器到所有客户端的连接,所以它应该相当容易 - 但到目前为止我在这个主题上找到的内容非常令人困惑.

我不太了解它.我可以编写自己的信令服务器,如何确定客户端的可用端口等.

简而言之:请求良好的链接.

是的,我发现了这一点,但没有发现它非常连贯(可能是因为其中没有一个代码样本没有至少5个无法解释的变量或函数).

webrtc

5
推荐指数
1
解决办法
5318
查看次数

如何读取javascript中的前4个字节,将其转换为整数并删除其余部分?

我需要通过互联网将网络摄像头数据从一个浏览器传输到另一个浏览器。

网络摄像头显示在中HTML5 canvas。然后,我得到它的dataUrl,并将其变成一个blob。然后,将此Blob发送到我的服务器。

据我了解,blob本质上是一个byte array。我已经将其转换为服务器端的字节数组,它的长度blob.size与浏览器中的长度相同,所以看起来还不错。我需要向其添加一个发件人ID,因此我将一个整数转换为的数组,4 bytes并将其添加到字节数组的前面。

现在,我需要将此修改后的Blob发送到其他浏览器。这就是我感到困惑的地方。

  1. 如何读取javascript中的前4个字节,然后再次将其变为整数?
  2. 我如何切断其余的斑点?

javascript html5 bytearray

1
推荐指数
1
解决办法
2607
查看次数

Java - if语句是否是线程安全的?

这可能是一个愚蠢的问题但是..让我们假设我有一个类ContainerClass,如果包含一个HashSet,它可以从几个添加并删除元素的线程访问..在其中一个线程中,让我们称之为线程1,我执行以下代码:

if(ContainerClass.hashSet.containsKey(keyId))
    int number = ContainerClass.hashSet.get(keyId);
Run Code Online (Sandbox Code Playgroud)

是否保证在第二行执行时,具有键keyId的元素仍然存在?或者这个线程可以在if语句中进行检查,然后暂停,然后另一个线程改变HashSet,并且线程1获得NullPointerException?

java multithreading thread-safety

0
推荐指数
1
解决办法
1056
查看次数

标签 统计

html5 ×3

javascript ×3

webrtc ×2

blob ×1

bytearray ×1

css ×1

java ×1

multithreading ×1

stun ×1

thread-safety ×1

video ×1