[譯]WebRTC基礎實踐 - 3. 獲取示例程式碼
下載示例程式碼
如果安裝有git工具, 直接用下面的指令碼, 從GitHub克隆程式碼即可:
git clone https://github.com/googlecodelabs/webrtc-web.git
或者, 點選連結下載 zip 壓縮包: ofollow,noindex" target="_blank">https://github.com/googlecodelabs/webrtc-web/archive/master.zip
如果下載失敗或者本地網路受限, 可通過小工具頁面下載: http://www.cncounter.com/tools/download.php?targetfilename=random.zip&origfileurl=https%3A%2F%2Fgithub.com%2Fgooglecodelabs%2Fwebrtc-web%2Farchive%2Fmaster.zip
下載完成後進行解壓, 裡面是一個自適應的網路資源專案( adaptive-web-media ), 包含多個步驟對應的資料夾, 以及部分資源。
預定的工作目錄是 work 。
類似 step-xx 的資料夾, 則包含了教程中每一個步驟對應的完成狀態。僅供參考。
安裝並驗證 web server
建議使用你比較熟悉的web伺服器, 如 Nginx, Tomcat, NodeJS等等, 只要能以 http://
協議(不能是 file://
協議)訪問到 work 目錄下的檔案即可。
下面的內容, 主要講解的是, 在沒有其他伺服器可選的情況下, 如何使用 Chrome Web Server 擴充套件應用來模擬一個web伺服器。需要從 Chrome Web Store 網站進行安裝。
連結: Install Web Server for Chrome
安裝完成之後, 進入 "更多工具 – 擴充套件程式 " 頁面( chrome://extensions/ ) , 找到這個Chrome 應用, 點選詳細資訊, 並啟用:
接著將此頁面下拉, 在新版本的Chrome中, 可能需要先點選 “在 Chrome 網上應用店中檢視詳情”:
然後在Chrome網上應用店的頁面中, 點選啟動:
啟動完成之後配置相關資訊, 如埠號。
點選 CHOOSE FOLDER 可以配置WebRoot資料夾, 這裡選擇我們解壓後的 /work
目錄。
在配置項 Options 下面, 選中 Automatically show index.html , 則可以自動使用 index 作為預設頁面。
接下來需要停止並重啟一次 server, 通過滑動切換標籤 Web Server: STARTED , (即先滑到左邊, 再滑到到右邊)。
在 Web Server URL(s) 下面會顯示相應的連結。點選其中一個, 預設開啟的就是 work/index.html
檔案。
如下圖所示:
顯然, 現在程式裡什麼都沒有, 只是個空架子, 目的是為了確保web伺服器執行正常. 在接下來的小節中, 我們會逐步新增功能和介面佈局。
如果一切正常, 那麼後面的測試和驗證都可以使用這個 web server 配置。
修改原始檔並儲存之後, 只需要重新整理瀏覽器標籤頁, 就可以檢視最新效果了。
原文連結: https://codelabs.developers.google.com/codelabs/webrtc-web/#0
翻譯人員: 鐵錨 - https://blog.csdn.net/renfufei
翻譯日期: 2018年07月02日