文章轉(zhuǎn)載于微信公眾號: 小白學(xué)視覺
作者：努比

很多小伙伴都不會在家里或者辦公室安裝網(wǎng)絡(luò)攝像頭或監(jiān)視攝像頭。但是有時，大家又希望能夠隨時隨地觀看視頻直播。
大多數(shù)人會選擇使用IP攝像機(jī)（Internet協(xié)議攝像機(jī)）而不是CCTV（閉路電視），因為它們具有更高的分辨率并降低了布線成本。在本文中，我們將重點介紹IP攝像機(jī)。IP攝像機(jī)是一種數(shù)字?jǐn)z像機(jī)，可以通過IP網(wǎng)絡(luò)接收控制數(shù)據(jù)并發(fā)送圖像數(shù)據(jù)，并且不需要本地記錄設(shè)備。大多數(shù)IP攝像機(jī)都是基于RTSP（實時流協(xié)議）的，因此Internet瀏覽器本身“不支持”它。

01.如何使用Web瀏覽器查看實時流媒體

計算機(jī)視覺是一個跨學(xué)科領(lǐng)域，涉及如何制作計算機(jī)以從數(shù)字圖像或視頻獲得高層次的理解。為了實現(xiàn)計算機(jī)視覺部分，我們將使用Python中的
OpenCV模塊，并在Web瀏覽器中顯示實時流，我們將使用FlaskWeb框架。在進(jìn)入編碼部分之前，讓我們首先簡要地了解這些模塊。如果您已經(jīng)熟悉這些模塊，則可以直接跳到下一部分。
根據(jù)Wikipedia的說法，F(xiàn)lask是用Python編寫的微型Web框架。它被歸類為微框架，因為它不需要特定的工具或庫。它沒有數(shù)據(jù)庫抽象層，表單驗證或任何其他現(xiàn)有的第三方庫提供公用功能的組件。
根據(jù)GeeksForGeeks的說法，OpenCV是用于計算機(jī)視覺，機(jī)器學(xué)習(xí)和圖像處理的巨大開放源代碼庫，現(xiàn)在它在實時操作中起著重要作用，這在當(dāng)今的系統(tǒng)中非常重要。

02.操作步驟
第1步-安裝Flask和OpenCV：
可以使用“_pip install_flask”和“_pip install opencv-python_”命令。我使用PyCharm IDE開發(fā)flask應(yīng)用程序。
第2步-導(dǎo)入必要的庫，初始化flask應(yīng)用程序：
現(xiàn)在，我們將導(dǎo)入必要的庫并初始化我們的flask應(yīng)用程序。

#Import necessary libraries

第3步-使用OpenCV捕獲視頻：
創(chuàng)建一個VideoCapture（）對象以觸發(fā)相機(jī)并讀取視頻的第一個圖像/幀。我們可以提供視頻文件的路徑，也可以使用數(shù)字來指定本地網(wǎng)絡(luò)攝像頭的使用。要觸發(fā)網(wǎng)絡(luò)攝像頭，我們將“ 0”作為參數(shù)傳遞。為了從IP攝像機(jī)捕獲實時源，我們提供RTSP鏈接作為參數(shù)。

camera = cv2.VideoCapture(0)

第4步-添加窗口并從相機(jī)生成幀：

gen/_frames（）函數(shù)進(jìn)入一個循環(huán)，在該循環(huán)中，它不斷從相機(jī)返回幀作為響應(yīng)塊。該函數(shù)要求攝像機(jī)提供一個幀，然后將其格式化為內(nèi)容類型為的響應(yīng)塊，并使其屈服image/jpeg，如上所示。代碼如下所示：

def gen_frames():  

*第5步-為網(wǎng)絡(luò)應(yīng)用的默認(rèn)頁面定義應(yīng)用路由*：
路由指的是應(yīng)用程序的URL模式（例如myapp.com/home或myapp.com/about）。@app.route("/")是Flask提供的Python裝飾器，用于在我們的應(yīng)用中分配URL以便輕松運行。

@app.route('/')

裝飾器告訴我們@app，只要用戶訪問給定的應(yīng)用程序域（_本地服務(wù)器的localhost：5000）_.route()，就執(zhí)行該index()功能。Flask使用Jinja模板庫渲染模板。在我們的應(yīng)用程序中，我們將使用模板來呈現(xiàn)HTML，這些HTML將顯示在瀏覽器中。
*第6步-定義視頻供稿的應(yīng)用路由：*

@app.route('/video_feed')

“ / video/_feed”路由返回流式響應(yīng)。由于此流返回要在網(wǎng)頁中顯示的圖像，因此路由的URL在image標(biāo)記的“ osrc”屬性中（請參見下面的“ index.html”）。瀏覽器將通過在其中顯示JPEG圖像流來自動更新圖像元素，因為大多數(shù)/所有瀏覽器都支持多部分響應(yīng)
讓我們看一下我們的index.html文件：

第7步-啟動Flask服務(wù)器：

if __name__ == "__main__":

調(diào)用app.run（）并將Web應(yīng)用程序本地托管在[localhost：5000]上。
“ debug = True”可確保我們不需要在每次進(jìn)行更改時都運行應(yīng)用程序，只需在服務(wù)器仍在運行時刷新網(wǎng)頁即可查看更改。
項目結(jié)構(gòu)：

該項目保存在名為“攝像機(jī)檢測”的文件夾中。我們運行“ app.py”文件。運行此文件后，我們的應(yīng)用程序?qū)⑼泄茉诒镜胤?wù)器的端口5000上。

只需在運行“ app.py”后在網(wǎng)絡(luò)瀏覽器中鍵入“ localhost：5000”即可打開您的網(wǎng)絡(luò)應(yīng)用程序

app.py —這是我們在上面創(chuàng)建的Flask應(yīng)用程序

模板-此文件夾包含我們的“ index.html”文件。在渲染模板時，這在Flask中是必需的。所有HTML文件都放在此文件夾下。

讓我們看看當(dāng)我們運行'app.py'時會發(fā)生什么：

在單擊提供的URL時，我們的Web瀏覽器將打開實時供稿。由于我使用了上面的VideoCapture（0），因此網(wǎng)絡(luò)攝像頭摘要會顯示在瀏覽器中：

中有來自IP攝像機(jī)/網(wǎng)絡(luò)攝像機(jī)的實時視頻流，可用于安全和監(jiān)視目的。

代碼鏈接：https://github.com/NakulLakhotia/Live-Streaming-using-OpenCV-Flask

審核編輯 黃昊宇