• Stars
    star
    118
  • Rank 299,923 (Top 6 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 4 years ago
  • Updated about 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

webrtc 演示示例

webrtc-demo

webrtc 演示示例,可在预览地址直接使用,或者在https://nashaofu.github.io/webrtc-demo/查看基本显示效果,项目更多介绍可在公众号代码骑行与美食中查看

使用说明

  1. 生成 tls 证书
mkdir tls

cd tls

openssl genrsa -des3 -passout pass:x -out server.pass.key 2048

# writing RSA key
openssl rsa -passin pass:x -in server.pass.key -out server.key

rm server.pass.key

openssl req -new -key server.key -out server.csr

openssl x509 -req -sha256 -days 365 -in server.csr -signkey server.key -out server.crt
  1. 双击tls/server.crt安装 tls 证书到系统,然后信任该证书。具体参考:https://blog.csdn.net/cuk0051/article/details/108319531

  2. 安装依赖启动服务

yarn

yarn start
  1. 在浏览器中打开终端输出的地址,如遇到证书安全问题可参考https://blog.caojun.xyz/posts/macos_trust_ssl/
  2. index.html 是使用复制文本握手的示例,http.html 是使用 http 建立连接的示例,socket.html 是用来演示 socket 建立连接的示例

webRTC 连接建立流程

webrtc.svg

交换 offer 和 iceCandidata 通常通过 socket 来交换,目的是方便对方网络情况变化后能够推送到参与会话的人,其实这个交换过程也可以用其他任何方式,只要能相互交换信息就可以。例如,A 创建会话后,把自己的 offer 和 iceCandidata 通过邮件发送给 B,B 把这些信息设置到自己的会话中,然后把自己的 offer 和 iceCandidata 发送给 A,只要在这期间网络状况没发生变化,就能够正常通话。关于 webRTC,这篇文章讲得比较不错。

MDN webRTC 连接流程介绍

webRTC-mdn.png

More Repositories

1

dingtalk

钉钉桌面版,基于electron和钉钉网页版开发,支持Windows、Linux和macOS
JavaScript
2,836
star
2

screenshots

A screenshot plugin for electron and react
TypeScript
305
star
3

screenshots-rs

A cross-platform screenshots library for MacOS、Windows、Linux(X11、wayland).
Rust
196
star
4

node-screenshots

Zero-dependent. A native nodejs screenshots library for Mac、Windows、Linux.
JavaScript
35
star
5

ydebugger

让你的平板不再吃灰,不再买前生产力,买后爱奇艺。A remote webapp of the Chrome DevTools, you can develop and debug front-end pages on iPad Browser with GitHub codespaces or code-server.
JavaScript
17
star
6

display-info

Cross-platform get display info for MacOS、Windows、Linux, Like electron Display Object.
Rust
12
star
7

talk-is-cheap-show-me-the-code

专治各种疑难杂症的仓库
JavaScript
11
star
8

markdown365-parser

A markdown parser library base vnode
JavaScript
9
star
9

wol

Wol 是 wake on lan 的简写,是一个轻量、简洁的 Wol 管理服务,支持检测设备是否开机成功。
TypeScript
9
star
10

pagination

这是一个基于jQuery的翻页按钮插件!
JavaScript
8
star
11

space-jump

涂鸦跳跃微信小游戏版
JavaScript
5
star
12

webgl-demo

WebGL 学习例子,包含原生 WebGL 与 three.js
JavaScript
4
star
13

koa-parser

a body parser for koa
TypeScript
4
star
14

vue-cli-issue

多页面开发时的性能问题,issues地址:https://github.com/vuejs/vue-cli/issues/3838
Vue
4
star
15

markdown365

a powerful markdown editor
JavaScript
3
star
16

grender

A lightweight canvas library for 2D.
TypeScript
3
star
17

datatable

A datatable component for vue.js
JavaScript
2
star
18

webpack-principle

webpack原理系列文章
JavaScript
2
star
19

learn-java

java学习修炼
Java
2
star
20

garbage-collector

垃圾回收小助手
JavaScript
2
star
21

How-to-win-the-favor-of-rich-women

How to win the favor of rich women?如何套取富婆欢心?
2
star
22

m-tab

a new tab extension for chorme
JavaScript
2
star
23

electron-dev-webpack-plugin

A webpack plugin for electron development
TypeScript
2
star
24

image-wasm

Rust
1
star
25

react-filptimer

基于 react 的翻页时钟效果
JavaScript
1
star
26

vuepress-bug

vuepress 打包后样式丢失 bug
1
star
27

phpmyadmin-desktop

phpMyAdmin 的桌面版本
PHP
1
star
28

estatic

A express static file server for CLI
TypeScript
1
star
29

nodejs-template

nodejs template
JavaScript
1
star
30

ftp

a FTP module for node.js
JavaScript
1
star
31

category

这是一个基于jQuery的分类标签选择列表
JavaScript
1
star
32

fight

Mac黑白人物打斗屏幕保护程序
Objective-C
1
star
33

auto

利用GitHub actions自动执行任务
TypeScript
1
star
34

webrender-demo

Rust
1
star
35

parallel-to-serial

Parallel task based on Promise converted to serial task
TypeScript
1
star
36

nashaofu

嗨! 我是 nashaofu👋, 一个在中国杭州的前端开发工程师。
1
star
37

koa-https-server

https服务器示例
HTML
1
star
38

napi-rs-issue

https://www.electronjs.org/blog/v8-memory-cage
JavaScript
1
star
39

electron-screenshots-issue

用于复现 electron-screenshots issue
JavaScript
1
star
40

vue-cli-plugin-electron-builder-issue

vue-cli-plugin-electron-builder中使用shortcut-capture截图界面出不来的问题解决方案
JavaScript
1
star
41

devtools-frontend

The client-side of the Chrome DevTools, including all JS & CSS to run the DevTools webapp.
JavaScript
1
star