03．ネットワークカメラからのビデオストリームを表示する

「ネットワークカメラのスナップショット画像を読み込み、表示する」ことを、連続で行うことで、映像として表示しても、たかだか 2 [FPS] ほどしかでず、映像は滑らではありませんでした。
滑らかな映像表示をするために、ネットワークカメラから送信されるビデオストリームを受信し、映像として表示します。
（使用ネットワークカメラは、9060AK）

使用開発環境はVisual C++ 2005です。

概要

9060AK のビデオストリームのアドレスは、
http://<ipaddress>/cgi-bin/Stream?Video&name=<user>&pass=<password>
<ipaddress>、<user>、<password>は、設定に合わせて入力します。

ビデオストリームの内容としては、JPEGデータが、順次送られてきます。JPEGデータのフォーマットは、イメージ開始が「FFD8」、イメージ終了が「FFD9」となっています。
ビデオストリーム中の「FFD8」から「FFD9」を切り取るとそれは、１枚のJPEGデータになります。

HTTP通信処理により、ビデオストリームの内容をBYTE配列として取得します。
取得したBYTE配列から、「FFD8」から「FFD9」を切り取り、CImageクラスのLoad関数を用いてCImageオブジェクト化します。
CImageオブジェクト化されたならば、CImageクラスのBitBiltを用いて画面に画像を表示します。

画像表示処理およびウインドウメッセージ処理を行うメインスレッドとは別に、HTTP通信処理からCImageオブジェクト化処理を行うビデオストリーム読み込みスレッドを作成して処理します。

プロジェクトの作成

「メニュー／新規作成／プロジェクト」を選択します。

プロジェクトの種類：Win32
テンプレート：Win32 プロジェクト
プロジェクト名：NetworkCameraStreamVideoViewer
場所：適当なフォルダを指定
ソリューションのディレクトリの作成：チェックしない
でOKボタンを押します。

次へボタンを押します。

アプリケーションの種類：Windows アプリケーション
空のプロジェクト：チェックしない
で完了ボタンを押します。

ビルドし、エラー、警告がないことを確認します。

スレッドコントロール列挙型の作成

メインスレッドとスナップショット画像読み込みスレッドとが協調して動作するために必要な、スレッドの状態を表す定数を列挙型として定義します。

「メニュー／プロジェクト／新しい項目の追加」でファイル名「ThreadControlStatus.h」のファイルを作成します。

ThreadControlStatus.h の内容を以下のようにします。

// // ThreadControlStatus.h // #pragma once enum ETHREADCONTROLSTATUS { TCS_IMAGEDRAWN = 0, TCS_IMAGEREADING, TCS_IMAGEREAD, TCS_IMAGEDRAWING, };

ビルドし、エラー、警告がないことを確認します。

スナップショット画像読み込みスレッド関数のヘッダーファイルの作成

「メニュー／プロジェクト／新しい項目の追加」でファイル名「ReadStreamVideoThread.h」のファイルを作成します。

ReadStreamVideoThread.h の内容を以下のようにします。

// // ReadStreamVideoThread.h // #pragma once #include <atlimage.h> // for CImage #include "ThreadControlStatus.h" class CThreadParams { public: CThreadParams(TCHAR* pszUserAgent, TCHAR* pszUrl, TCHAR* pstrParameter, ETHREADCONTROLSTATUS* peThreadControlStatus, CImage* pImage, HWND hWnd, bool* pbThreadQuit ) { _tcscpy_s( m_szUserAgent, 1024, pszUserAgent ); _tcscpy_s( m_szUrl, 1024, pszUrl ); _tcscpy_s( m_szParameter, 1024, pstrParameter ); m_peThreadControlStatus = peThreadControlStatus; m_pImage = pImage; m_hWnd = hWnd; m_pbThreadQuit = pbThreadQuit; } ~CThreadParams(){} public: TCHAR m_szUserAgent[1024]; TCHAR m_szUrl[1024]; TCHAR m_szParameter[1024]; ETHREADCONTROLSTATUS* m_peThreadControlStatus; CImage* m_pImage; HWND m_hWnd; bool* m_pbThreadQuit; }; DWORD ReadStreamVideoThread( CThreadParams* pThreadParams );

ビルドし、エラー、警告がないことを確認します。

スナップショット画像読み込みスレッド関数のソースファイルの作成

「メニュー／プロジェクト／新しい項目の追加」でファイル名「ReadStreamVideoThread.cpp」のファイルを作成します。

ReadStreamVideoThread.cpp の内容を以下のようにします。

ヘッダー部

// // ReadStreamVideoThread.cpp // #include "stdafx.h" #include "ReadStreamVideoThread.h" #include <Wininet.h> #include <assert.h> #include <string> #include <sstream> #include <atlimage.h> // for CImage #include <fstream> // ofstream #include "ThreadControlStatus.h" #pragma comment( lib, "Wininet.lib" ) typedef std::basic_string<TCHAR> tstring; #define URLBUFFER_SIZE (4096) #define READBUFFER_SIZE (4096)

バイト配列をIStreamオブジェクトに変換する関数

// バイト配列をIStreamオブジェクトに変換 bool ByteArray2IStream( HANDLE& rhBuffer, std::string& str, IStream** ppStream ) { SIZE_T sizeBuffer = GlobalSize(rhBuffer); if( sizeBuffer < str.length() ) { GlobalFree(rhBuffer); rhBuffer = GlobalAlloc( GMEM_MOVEABLE, str.length() * 2 ); } char* pBuffer = (char*)GlobalLock( rhBuffer ); memcpy( pBuffer, str.c_str(), str.length() ); GlobalUnlock( rhBuffer ); CreateStreamOnHGlobal( rhBuffer, FALSE, ppStream ); return true; }

ストリーム読み込みループ関数

// ストリーム読み込みループ bool ReadStreamLoop( HINTERNET hInternetRequest, ETHREADCONTROLSTATUS* peThreadControlStatus, CImage* pImage, HWND hWnd, bool* pbThreadQuit) { // 動的に確保するストリーム用のメモリ領域は使い捨てではなく、使いまわす。 HANDLE hBuffer = NULL; // HTTPファイル読み込み std::ostringstream oss_jpeg; char szReadBuffer[READBUFFER_SIZE]; while( 1 ) { if( true == *pbThreadQuit ) { // 外部からのスレッド終了要請 break; } // TCS_IMAGEDRAWN 描画終了⇒読み込み処理する // TCS_IMAGEREADING 読み込み中⇒読み込み処理する // TCS_IMAGEREAD 読み込み完了⇒読み込み処理してはだめ // TCS_IMAGEDRAWING 描画中⇒読み込みしてはだめ if( TCS_IMAGEDRAWN != *peThreadControlStatus && TCS_IMAGEREADING != *peThreadControlStatus ) { // まだ描画が終わってないなら、読み込み処理してはだめ。 continue; } *peThreadControlStatus = TCS_IMAGEREADING; DWORD dwRead = 0; if( !InternetReadFile( hInternetRequest, szReadBuffer, READBUFFER_SIZE, &dwRead ) ) { assert( !"HTTPファイル読み込みに失敗" ); MessageBox( hWnd, _T("HTTPファイル読み込みに失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } if( 0 == dwRead ) { assert( !"aaaa" ); continue; } //assert( READBUFFER_SIZE == dwRead ); assert( 0 == dwRead % 2 ); // jpeg画像の切り取り（イメージ開始「FFD8」からイメージ終了「FFD9」を切り取る） bool bFoundStart = false; bool bFoundEnd = false; unsigned int uiStart = 0; unsigned int uiEnd = dwRead; unsigned int uiStart_forEnd = 0; for( unsigned int ui = 0; ui < dwRead; ) { if( (char)0xFF == szReadBuffer[ui] ) { if( (char)0xD8 == szReadBuffer[ui+1] ) { uiStart = ui; bFoundStart = true; } else if( (char)0xD9 == szReadBuffer[ui+1] ) { uiStart_forEnd = uiStart; uiEnd = ui + 2; bFoundEnd = true; } } ui += 2; } if( bFoundEnd ) { // 終了を発見したときは、まず終了まで処理 assert( uiEnd > uiStart_forEnd ); oss_jpeg.write( &szReadBuffer[uiStart_forEnd], uiEnd - uiStart_forEnd ); // jpeg画像のファイル出力 /*std::ofstream fout; fout.open("aaa.jpg", std::ios::out | std::ios::binary | std::ios::trunc ); fout << oss_jpeg.str(); fout.close();*/ // ostringstreamオブジェクト⇒IStreamオブジェクト IStream* pStream = NULL; if( !ByteArray2IStream( hBuffer, oss_jpeg.str(), &pStream ) ) { assert( !"Byte配列のIStreamオブジェクト化に失敗" ); MessageBox( hWnd, _T("Byte配列のIStreamオブジェクト化に失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } oss_jpeg.str(""); // IStreamオブジェクト⇒CImageオブジェクト pImage->Destroy(); if( FAILED( pImage->Load( pStream ) ) ) { assert( !"ストリームの画像化に失敗" ); MessageBox( hWnd, _T("ストリームの画像化に失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } pStream->Release(); *peThreadControlStatus = TCS_IMAGEREAD; InvalidateRect( hWnd, NULL, FALSE ); } if( std::ios::pos_type(-1) == oss_jpeg.tellp() && bFoundStart // jpegストリームは空のときは、FFD8が見つからないとだめ。 || std::ios::pos_type(-1) != oss_jpeg.tellp() ) // jpegストリームは空でないときは、FFD8が見つからなくてもよい。 { if( bFoundStart ) { // 「FFD8」発見したならば、jpegストリームをからにする。 oss_jpeg.str(""); } if( uiStart < uiEnd ) { // startとendの大小関係が正常な場合は、startからendまでをコピー oss_jpeg.write( &szReadBuffer[uiStart], uiEnd - uiStart ); } else { // startとendの大小関係が逆転してる場合は、startから、読み込んだ最後までをコピー oss_jpeg.write( &szReadBuffer[uiStart], dwRead - uiStart ); } } } if( hBuffer ){ GlobalFree(hBuffer); } return true; LABEL_ERROR: if( hBuffer ){ GlobalFree(hBuffer); } return false; }

HTTPリクエスト関数

// HTTPリクエスト bool HttpRequest( tstring strUserAgent, tstring strUrl, bool bIsHttpVerbGet, tstring strParameter, ETHREADCONTROLSTATUS* peThreadControlStatus, CImage* pImage, HWND hWnd, bool* pbThreadQuit) { // インプットのチェック if( 0 == strUrl.length() ) { assert( !"URLが不正" ); MessageBox( hWnd, _T("URLが不正"), _T(""), MB_OK ); return false; } // 変数 HINTERNET hInternetOpen = NULL; HINTERNET hInternetConnect = NULL; HINTERNET hInternetRequest = NULL; char* pszOptional = NULL; URL_COMPONENTS urlcomponents; tstring strServer; tstring strObject; INTERNET_PORT nPort; tstring strVerb; tstring strHeaders; // URL解析 ZeroMemory( &urlcomponents, sizeof(URL_COMPONENTS) ); urlcomponents.dwStructSize = sizeof(URL_COMPONENTS); TCHAR szHostName[URLBUFFER_SIZE] = _T(""); TCHAR szUrlPath[URLBUFFER_SIZE] = _T(""); urlcomponents.lpszHostName = szHostName; urlcomponents.lpszUrlPath = szUrlPath; urlcomponents.dwHostNameLength = URLBUFFER_SIZE; urlcomponents.dwUrlPathLength = URLBUFFER_SIZE; if( !InternetCrackUrl( strUrl.c_str(), (DWORD)strUrl.length(), 0, &urlcomponents ) ) { // URLの解析に失敗 assert( !"URL解析に失敗" ); MessageBox( hWnd, _T("URL解析に失敗"), _T(""), MB_OK ); return false; } strServer = urlcomponents.lpszHostName; strObject = urlcomponents.lpszUrlPath; nPort = urlcomponents.nPort; // HTTPかHTTPSかそれ以外か DWORD dwFlags = 0; if( INTERNET_SCHEME_HTTP == urlcomponents.nScheme ) { // HTTP dwFlags = INTERNET_FLAG_RELOAD // 要求されたファイル、オブジェクト、またはフォルダ一覧を、キャッシュからではなく、元のサーバーから強制的にダウンロードします。 | INTERNET_FLAG_DONT_CACHE // 返されたエンティティをキャシュへ追加しません。 | INTERNET_FLAG_NO_AUTO_REDIRECT; // HTTP だけで使用され、リダイレクトが HttpSendRequest で処理されないことを指定します。 } else if( INTERNET_SCHEME_HTTPS == urlcomponents.nScheme ) { // HTTPS dwFlags = INTERNET_FLAG_RELOAD // 要求されたファイル、オブジェクト、またはフォルダ一覧を、キャッシュからではなく、元のサーバーから強制的にダウンロードします。 | INTERNET_FLAG_DONT_CACHE // 返されたエンティティをキャシュへ追加しません。 | INTERNET_FLAG_NO_AUTO_REDIRECT // HTTP だけで使用され、リダイレクトが HttpSendRequest で処理されないことを指定します。 | INTERNET_FLAG_SECURE // 安全なトランザクションを使用します。これにより、SSL/PCT を使うように変換され、HTTP 要求だけで有効です。 | INTERNET_FLAG_IGNORE_CERT_DATE_INVALID // INTERNET_FLAG_IGNORE_CERT_DATE_INVALID、INTERNET_FLAG_IGNORE_CERT_CN_INVALID | INTERNET_FLAG_IGNORE_CERT_CN_INVALID; // は、証明書に関する警告を無視するフラグ } else { assert( !"HTTPでもHTTPSでもない" ); MessageBox( hWnd, _T("HTTPでもHTTPSでもない"), _T(""), MB_OK ); return false; } // GETかPOSTか if( bIsHttpVerbGet ) { // GET strVerb = _T("GET"); strHeaders = _T(""); if( 0 != strParameter.length() ) { // オブジェクトとパラメータを「?」で連結 strObject += _T("?") + strParameter; } } else { // POST strVerb = _T("POST"); strHeaders = _T("Content-Type: application/x-www-form-urlencoded"); if( 0 != strParameter.length() ) { // パラメータを、送信するオプションデータに変換する //pszOptional = NhT2M( strParameter.c_str() ); // char文字列に変換 } } // WinINetの初期化 hInternetOpen = InternetOpen( strUserAgent.c_str(), INTERNET_OPEN_TYPE_PRECONFIG, NULL, NULL, 0 ); if( NULL == hInternetOpen ) { assert( !"WinINetの初期化に失敗" ); MessageBox( hWnd, _T("WinINetの初期化に失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } // HTTP接続 hInternetConnect = InternetConnect( hInternetOpen, strServer.c_str(), nPort, NULL, NULL, INTERNET_SERVICE_HTTP, 0, 0 ); if( NULL == hInternetConnect ) { assert( !"HTTP接続に失敗" ); MessageBox( hWnd, _T("HTTP接続に失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } // HTTP接続を開く hInternetRequest = HttpOpenRequest( hInternetConnect, strVerb.c_str(), strObject.c_str(), NULL, NULL, NULL, dwFlags, NULL ); if( NULL == hInternetRequest ) { assert( !"HTTP接続を開くに失敗" ); MessageBox( hWnd, _T("HTTP接続を開くに失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } // HTTP要求送信 if( !HttpSendRequest( hInternetRequest, strHeaders.c_str(), (DWORD)strHeaders.length(), (LPVOID)((char*)pszOptional), pszOptional ? (DWORD)(strlen(pszOptional) * sizeof(char)) : 0 ) ) { assert( !"HTTP要求送信に失敗" ); MessageBox( hWnd, _T("HTTP要求送信に失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } // HTTP要求に対応するステータスコードの取得 DWORD dwStatusCode; DWORD dwLength = sizeof(DWORD); if( !HttpQueryInfo( hInternetRequest, HTTP_QUERY_STATUS_CODE | HTTP_QUERY_FLAG_NUMBER, &dwStatusCode, &dwLength, 0 ) ) { assert( !"HTTP要求に対応するステータスコードの取得に失敗" ); MessageBox( hWnd, _T("HTTP要求に対応するステータスコードの取得に失敗"), _T(""), MB_OK ); goto LABEL_ERROR; } if( HTTP_STATUS_OK != dwStatusCode ) { assert( !"ステータスコードがOKでない" ); MessageBox( hWnd, _T("ステータスコードがOKでない"), _T(""), MB_OK ); goto LABEL_ERROR; } // ストリーム読み込みループ if( !ReadStreamLoop( hInternetRequest, peThreadControlStatus, pImage, hWnd, pbThreadQuit ) ) { assert( !"ストリーム読み込みループ内でエラー発生" ); MessageBox( hWnd, _T("ストリーム読み込みループ内でエラー発生"), _T(""), MB_OK ); goto LABEL_ERROR; } if( pszOptional ){ free( pszOptional ); } InternetCloseHandle(hInternetRequest); InternetCloseHandle(hInternetConnect); InternetCloseHandle(hInternetOpen); return true; LABEL_ERROR: if( pszOptional ){ free( pszOptional ); } InternetCloseHandle(hInternetRequest); InternetCloseHandle(hInternetConnect); InternetCloseHandle(hInternetOpen); return false; }

ビデオストリーム読み込みスレッドエントリ関数

// ビデオストリーム読み込みスレッドエントリ関数 DWORD ReadStreamVideoThread( CThreadParams* pThreadParams ) { if( !HttpRequest( pThreadParams->m_szUserAgent, pThreadParams->m_szUrl, true, pThreadParams->m_szParameter, pThreadParams->m_peThreadControlStatus, pThreadParams->m_pImage, pThreadParams->m_hWnd, pThreadParams->m_pbThreadQuit) ) { MessageBox( pThreadParams->m_hWnd, _T("HttpRequest失敗"), _T(""), MB_OK ); return -1; } return 0; }

ビルドし、エラー、警告がないことを確認します。

メインファイルのヘッダー部の編集

メインファイルのヘッダー部に、
・スナップショット画像読み込みスレッド関数のヘッダーファイルのインクルード
・FPS計測用のインクルードおよびライブラリリンクプラグマ
HTTP通信のパラメータ定数の定義
を追加します。

// NetworkCameraStreamVideoViewer.cpp : アプリケーションのエントリポイントを定義します。 // #include "stdafx.h" #include "NetworkCameraStreamVideoViewer.h" // ---↓↓↓追加↓↓↓--- #include "ReadStreamVideoThread.h" #include <mmsystem.h> // for timeGetTime() #pragma comment( lib, "winmm.lib" ) #define STRING_USERAGENT (_T("HttpRequestTest")) #define STRING_URL (_T("http://192.168.1.101/cgi-bin/Stream")) #define STRING_PARAMETER (_T("Video&name=admin&pass=12345678") ) // ---↑↑↑追加↑↑↑--- #define MAX_LOADSTRING 100 （・・・以下略・・・）

ビルドし、エラー、警告がないことを確認します。

ビデオストリーム読み込みスレッドの作成関数

メインファイルのWndProc関数の定義のすぐ上に、ビデオストリーム読み込みスレッドの作成関数の定義を追加します。

（・・・以上略・・・） // ---↓↓↓追加↓↓↓--- // ビデオストリーム読み込みスレッドの作成 HANDLE RunReadStreamVideo(ETHREADCONTROLSTATUS* peThreadControlStatus, CImage* pImage, HWND hWnd, bool* pbThreadQuit) { static CThreadParams s_threadparams = CThreadParams( STRING_USERAGENT, STRING_URL, STRING_PARAMETER, peThreadControlStatus, pImage, hWnd, pbThreadQuit ); DWORD threadID; return CreateThread(NULL, 0, (LPTHREAD_START_ROUTINE)ReadStreamVideoThread, &s_threadparams, 0, &threadID ); } // ---↑↑↑追加↑↑↑--- // // 関数: WndProc(HWND, UINT, WPARAM, LPARAM) // // 目的: メインウィンドウのメッセージを処理します。 // // WM_COMMAND - アプリケーションメニューの処理 // WM_PAINT - メインウィンドウの描画 // WM_DESTROY - 中止メッセージを表示して戻る // // LRESULT CALLBACK WndProc(HWND hWnd, UINT message, WPARAM wParam, LPARAM lParam) （・・・以下略・・・）

ビルドし、エラー、警告がないことを確認します。

ウィンドウプロシージャー関数の静的変数

ウィンドウプロシージャー関数に静的変数を追加します。

（・・・以上略・・・） LRESULT CALLBACK WndProc(HWND hWnd, UINT message, WPARAM wParam, LPARAM lParam) { // ---↓↓↓追加↓↓↓--- static ETHREADCONTROLSTATUS s_eThreadControlStatus = TCS_IMAGEDRAWN; // 画像読み込みスレッドと描画スレッドの協調用 static bool s_bThreadQuit = false; // 画像読み込みスレッドの終了要請用 static CImage* s_pImage = NULL; // 画像 static HANDLE s_hThread = NULL; // 画像読み込みスレッドハンドル static DWORD dwTime_prev = 0; // fps計測用 // ---↑↑↑追加↑↑↑--- int wmId, wmEvent; （・・・以下略・・・）

ビルドし、エラー、警告がないことを確認します。

ウィンドウプロシージャー関数の WM_CREATE ケース

ウィンドウプロシージャー関数の WM_CREATE ケースを追加し、FPS計測用の分解能設定処理、CImageオブジェクトの作成処理、ビデオストリーム読み込みスレッドの作成関数呼び出し処理、を追加します。

（・・・以上略・・・） switch (message) { // ---↓↓↓追加↓↓↓--- case WM_CREATE: timeBeginPeriod(1); // fps計測用のtimeGetTime()の分解能を1[ms]にする。 s_pImage = new CImage(); s_hThread = RunReadStreamVideo(&s_eThreadControlStatus, s_pImage, hWnd, &s_bThreadQuit); break; // ---↑↑↑追加↑↑↑--- （・・・以下略・・・）

ビルドし、エラー、警告がないことを確認します。

ウィンドウプロシージャー関数の WM_PAINT ケース

ウィンドウプロシージャー関数の WM_PAINT ケースに、描画処理、FPS計測処理、を追加します。

（・・・以上略・・・） case WM_PAINT: hdc = BeginPaint(hWnd, &ps); // TODO: 描画コードをここに追加してください... // ---↓↓↓追加↓↓↓--- if(TCS_IMAGEREAD == s_eThreadControlStatus ) { // 描画 s_eThreadControlStatus = TCS_IMAGEDRAWING; s_pImage->BitBlt( hdc, 0, 0, SRCCOPY ); s_eThreadControlStatus = TCS_IMAGEDRAWN; // fps計測 DWORD dwTime_current = timeGetTime(); DWORD dwTime_diff = dwTime_current - dwTime_prev; TCHAR szBuffer[256]; if( 0 != dwTime_diff ) { _stprintf_s( szBuffer, _T("%5.2lf[fps]"), 1.0 / dwTime_diff * 1000.0 ); } CRect rect_client; GetClientRect(hWnd, &rect_client); CRect rect; DrawText(hdc, szBuffer, -1, &rect, DT_CALCRECT ); rect.OffsetRect( rect_client.right - rect.right, rect_client.bottom - rect.bottom ); DrawText(hdc, szBuffer, -1, &rect, 0 ); dwTime_prev = dwTime_current; } // ---↑↑↑追加↑↑↑--- EndPaint(hWnd, &ps); break; （・・・以下略・・・）

ビルドし、エラー、警告がないことを確認します。

ウィンドウプロシージャー関数の WM_DESTROY ケース

ウィンドウプロシージャー関数の WM_DESTROY ケースに、スナップショット画像読み込みスレッドの終了要請、終了待ち、クローズ、CImageオブジェクトの削除処理、を追加します。

（・・・以上略・・・） case WM_DESTROY: // ---↓↓↓追加↓↓↓--- s_bThreadQuit = true; WaitForSingleObject(s_hThread, INFINITE); CloseHandle(s_hThread); if(NULL != s_pImage) { delete s_pImage; } // ---↑↑↑追加↑↑↑--- PostQuitMessage(0); break; （・・・以下略・・・）

ビルドし、エラー、警告がないことを確認します。

実行

表示は非常になめらかです。
FPSは、だいたい 25 [FPS] から 30 [FPS] ほどで、表示されました。

実行結果

ダウンロード

ソースファイルダウンロード (NetworkCameraStreamVideoViewer.zip)