Chia Sẻ Khóa Học Làm Chủ WebRTC - Real-Time Video Và Screen-Share [Khóa 6864 A]
Làm việc với MediaStreams, mic, camera và screen. Kết nối các browser - PeerConnection & Signaling, với React.
Bạn sẽ học được gì:
- ✓ Kết nối hai hoặc nhiều audio/video stream của máy tính.
- ✓ Thiết lập một signaling server làm trung gian đàm phán kết nối.
- ✓ Cách tích hợp webRTC vào một Ứng dụng React với Redux.
- ✓ Tổ chức Code để giảm thiểu sự nhầm lẫn khi ứng dụng của bạn phát triển.
- ✓ Quản lý 4 async source khác nhau để tạo một ứng dụng web đáng kinh ngạc.
TL;DR - bạn sẽ học WebRTC trong khóa học này - cách nhận một video feed và thiết lập một video chat giữa các trình duyệt chỉ bằng JavaScript. Phần đầu tiên và một số dự án sau này chỉ dành cho front-end, phần kết nối và các dự án sau này yêu cầu Node.js và Socketio.
Bây giờ là năm 2023. Cho dù vì đại dịch, chat bot hay tiết kiệm chi phí, làm việc từ xa là một vấn đề. Y học từ xa là một chuyện. Nói chuyện với những người cách xa 6 múi giờ là một chuyện. Bạn có thể trừu tượng hóa người dùng từ ứng dụng của mình sang Zoom vì nó luôn hoạt động nhưng bạn mất toàn bộ quyền kiểm soát và theo dõi tương tác.
Nhập webRTC.
WebRTC là một trong những trình duyệt phải chú ý đến apis. Nó cho phép truy cập vào mic, camera, thậm chí cả màn hình VÀ chia sẻ chúng TRỰC TIẾP qua một network socket với một trình duyệt khác. Không có server (hầu hết) hoặc người trung gian khác để thêm băng thông, lỗi và sự hỗn loạn.
Cùng với websockets, webRTC trình bày khía cạnh video của giao tiếp thời gian thực của trình duyệt, thu hẹp một trong những lỗ hổng cuối cùng trong giao tiếp giữa con người và dựa trên web. Rất có thể nếu bạn đang đọc bài viết này thì bạn đã nghe nói về webRTC. Thậm chí có thể thực hiện một hướng dẫn về nó. Nhưng bạn đã đi được bao xa? Theo kinh nghiệm của tôi, phần lớn tài liệu trên web không đi xa hơn một zoom clone, bắt đầu nhanh. Bạn không học cách mọi thứ hoạt động, không bao giờ nhìn vào tài liệu và cuối cùng bị mắc kẹt trong việc tự hỏi phải làm gì bây giờ. Đó có phải là tất cả những gì webRTC có thể làm được không? Việc webRTC được phát hành cùng thời điểm với websocket API và hầu hết các nhà phát triển vẫn không biết cách sử dụng nó là bằng chứng về khoảng cách.
Khóa học này là bước đầu tiên để giảm bớt điều đó! Đây không phải là hướng dẫn quick start về webRTC. Có rất nhiều thứ như vậy trên Internet. Bạn chắc chắn nên tìm nơi khác nếu muốn có phần giới thiệu dài 10 phút về 3-4 điều bạn cần biết để tạo một zoom clone cơ bản. Mặt khác, nếu bạn đang muốn thực sự tìm hiểu một trong những JavaScript API tuyệt vời nhất mà dường như không ai biết, bạn nên tiếp tục. Giống như Express và các phần JavaScript/Node khác, nó đang bị bỏ qua trong làn sóng chỉ học vừa đủ để đạt được thuật ngữ "full-stack developer". Mục tiêu chính của tôi là giúp bạn tìm ra cách đi từ một nhà phát triển giỏi trở thành một nhà phát triển tuyệt vời. Hiểu... không chỉ biết một vài phương pháp... WebRTC là một phần trong đó!
Lần đầu tiên tôi sử dụng webRTC vào năm 2015 cho một công ty khởi nghiệp tương tự như y học từ xa. Tôi đã theo dõi kể từ đó và cảm thấy thất vọng vì nó không nhận được nhiều thông báo chính thống hơn do sự hỗ trợ miễn cưỡng của Apple, nhưng chủ yếu là do các nhà phát triển không biết điều đó. Nó mở đường cho rất nhiều cải tiến cho các ứng dụng hiện có và nền tảng rõ ràng cho những ứng dụng mới. Hãy thay đổi điều đó :) Hãy chuẩn bị để có cái nhìn chi tiết về webRTC và bắt đầu video/screen chat thời gian thực trong ứng dụng.
Những gì chúng tôi bao gồm:
Phần chỉ dành cho Front-end:
- ✓ getUserMedia() - truy cập mic và camera trong trình duyệt.
- ✓ Phát nguồn cấp dữ liệu trong một <video />.
- ✓ MediaStream và MediaStreamTrack - yếu tố tạo nên video feed.
- ✓ Constraints - getSupportedConstraints() và getCapabilities() - xem trình duyệt này có thể làm gì.
- ✓ applyConstraints - thay đổi nguồn cấp dữ liệu một cách nhanh chóng.
- ✓ Ghi video/audio và phát lại.
- ✓ Chụp màn hình để chia sẻ màn hình và ghi lại.
- ✓ Thay đổi thiết bị input/output trong nguồn cấp dữ liệu của bạn.
Yêu cầu Back-End (node, socketio):
- ✓ RTCPeerConnection - trái tim của webRTC.
- ✓ Tạo một offer và một answer.
- ✓ Setting RTCSessionDescription.
- ✓ Signaling Process.
- ✓ Xây dựng một signaling server với socketio.
- ✓ Gathering ICE Candidates.
- ✓ Xây dựng một React app với redux sử dụng webRTC.
Mục lục:
- ✓ 1 - Giới thiệu về webRTC.
- ✓ 2 - Project - getUserMedia playground - (lame) project dạy cho bạn những điều cơ bản.
- ✓ 3 - rtcPeerConnection - Stream video, peer to peer.
- ✓ 4 - webRTC và React - TeleLegal site.
- ✓ 5 - Triển khai ứng dụng lên AWS.
Khóa học này dành cho ai:
- ✓ Bất kỳ ai quen thuộc với JavaScript và Node mới làm quen với webRTC!
- ✓ Bất cứ ai quen thuộc với browser webRTC api, nhưng dường như không thể kết nối trình duyệt.
- ✓ Bất cứ ai muốn đưa video conferencing vào ứng dụng web của họ miễn phí (không cần bên thứ 3)!
NHẬN GET EBOOK TRÊN AMAZON THEO YÊU CẦU