前言

前一篇文章介紹過CEF在WIN32程式中嵌入chrome核心瀏覽器的例子：http://blog.csdn.net/mfcing/article/details/43973377

這裡介紹的是嵌入瀏覽器後，網頁的JS指令碼函式與C++程式碼的互動，這個很多地方都用得到。比如：音樂播放器裡網頁上的播放，客戶端資源中心裡的資源下載……

JS呼叫C++函式

首先需要重寫CefRenderProcessHandler的OnContextCreated介面，為什麼呢？學習CEF庫的使用必須仔細閱讀他的標頭檔案裡的注視部分：

  // Called immediately after the V8 context for a frame has been created. To
  // retrieve the JavaScript 'window' object use the CefV8Context::GetGlobal()
  // method. V8 handles can only be accessed from the thread on which they are
  // created. A task runner for posting tasks on the associated thread can be
  // retrieved via the CefV8Context::GetTaskRunner() method.
  ///
  /*--cef()--*/
  virtual void OnContextCreated(CefRefPtr<CefBrowser> browser,
                                CefRefPtr<CefFrame> frame,
                                CefRefPtr<CefV8Context> context) {}
 

這個介面實在chrome的V8引擎建立後呼叫的，在這裡我們需要將JS裡面呼叫的函式和C++的執行函式關聯起來，這樣JS就可以“執行”C++程式碼了。

我們的函式都是定義在window物件中的（不知道JS中這個是不是叫物件），根據注視我們需要GetGlobal獲取這個物件。

我的程式碼是這樣的：

CefRefPtr<CefV8Value> window = context->GetGlobal();
		CefRefPtr<CefV8Accessor> myV8Acc = new CCefV8Accessor;
		CefRefPtr<CefV8Value> val = CefV8Value::CreateString(L"Application");
		CefString cefException;
		myV8Acc->Set(L"name", window, val, cefException);
		CefRefPtr<CefV8Value> pObjApp = CefV8Value::CreateObject(myV8Acc);
		window->SetValue(L"Application", pObjApp, V8_PROPERTY_ATTRIBUTE_NONE);

		CefRefPtr<CefV8Handler> myV8handle = new CCefV8Handler();
		CefRefPtr<CefV8Value> myFun = CefV8Value::CreateFunction(L"SetAppState", myV8handle);
		static_cast<CCefV8Handler*>(myV8handle.get())->AddFun(L"SetAppState", &CChromeJsCallback::JsSetAppState);
		pObjApp->SetValue(L"SetAppState", myFun, V8_PROPERTY_ATTRIBUTE_NONE);

		myFun = CefV8Value::CreateFunction(L"OneClickInstall", myV8handle);
		static_cast<CCefV8Handler*>(myV8handle.get())->AddFun(L"OneClickInstall", &CChromeJsCallback::JsOneKeyInstall);
		pObjApp->SetValue(L"OneClickInstall", myFun, V8_PROPERTY_ATTRIBUTE_NONE);

		myFun = CefV8Value::CreateFunction(L"DownLoadFile", myV8handle);
		static_cast<CCefV8Handler*>(myV8handle.get())->AddFun(L"DownLoadFile", &CChromeJsCallback::JsDownloadFile);
		pObjApp->SetValue(L"DownLoadFile", myFun, V8_PROPERTY_ATTRIBUTE_NONE);
 

所有的JS函式都是在window.Application上的，因此需要在window 物件上面建立Application 物件，CefV8Value::CreateObject用來建立物件。CefV8Value這個類在JS處理中至關重要，要必要好好看看標頭檔案裡面的注視，CEF的注視是相當詳細的。

建立函式物件，並將JS函式繫結到C++函式指標上面的過程是重點詳細介紹下

CefRefPtr<CefV8Handler> myV8handle = new CCefV8Handler();
		CefRefPtr<CefV8Value> myFun = CefV8Value::CreateFunction(L"SetAppState", myV8handle);
		static_cast<CCefV8Handler*>(myV8handle.get())->AddFun(L"SetAppState", &CChromeJsCallback::JsSetAppState);
		pObjApp->SetValue(L"SetAppState", myFun, V8_PROPERTY_ATTRIBUTE_NONE);
 

AddFun是自己新增的一個函式，用來把一個函式和氣對應的回撥地址儲存到這個V8物件中，因此用了一個成員變數typedef map<CefString, JS_CALLBACK_FUN> FunctionMap，呼叫函式時V8引擎有一個介面Execute，在這裡我們呼叫函式的名稱到map中去查詢，找到了其對應的回撥地址呼叫函式，這就是JS呼叫C++的過程了。

最上面那段程式碼中，我們又添加了三個函式 SetAppState、OneClickInstall、DownLoadFile到window.application物件上面。

C++程式碼中，這三個函式是這樣寫的：

//JS函式，在其他程序中呼叫
	static bool	JsSetAppState(const CefV8ValueList& argList, CefRefPtr<CefV8Value>& retValue);
	static bool	JsOneKeyInstall(const CefV8ValueList& argList, CefRefPtr<CefV8Value>& retValue);
	static bool	JsDownloadFile(const CefV8ValueList& argList, CefRefPtr<CefV8Value>& retValue);

vCefV8ValueList是一個引數列表，看它的定義typedef std::vector<CefRefPtr<CefV8Value> > CefV8ValueList，retValue當然就是函式的返回值了，有的JS需要根據返回值做相應的處理的。

這裡要注意：CEF可以使用單程序和多程序模式，我程式裡使用的是多程序模式，因此V8引擎的執行是在渲染引擎裡的，不要嘗試在這裡直接去對介面進行處理。介面程序和渲染程序是分開的，資料的話用共享記憶體來做，介面更新發訊息來做。

C++呼叫JS函式

C++呼叫JS函式相對簡單多了，因為CEF有介面可以直接使用CefFrame::ExecuteJavaScript，看看註釋：

  // Execute a string of JavaScript code in this frame. The |script_url|
  // parameter is the URL where the script in question can be found, if any.
  // The renderer may request this URL to show the developer the source of the
  // error.  The |start_line| parameter is the base line number to use for error
  // reporting.
  ///
  /*--cef(optional_param=script_url)--*/
  virtual void ExecuteJavaScript(const CefString& code,
                                 const CefString& script_url,
                                 int start_line) =0;

首先需要獲取到我們的瀏覽器裡的主框架物件，code是JS函式和傳入引數的字串，URL可以直接忽略。

void CChromeBrowserUI::ExecuteJavascript( const wstring& strCode )
{
	if ( m_pWebBrowser.get() )
	{
		CefRefPtr<CefFrame> frame = m_pWebBrowser->GetMainFrame();
		if ( frame.get() )
		{
			CefString strCode(strCode.c_str()), strUrl(L"");
			frame->ExecuteJavaScript(strCode, strUrl, 0);
		}
	}
}

注意：函式名和引數名需要用單引號分隔。

我的字串格式化部分：

CString strJsCode;
	strJsCode.Format(L"setInstallStatus('%s','%s','%d');", lpData->strId.c_str(), strStatus, nPercent);

這樣，C++就可以呼叫JS的函式並傳入對應的引數了。

總結

要想使用CEF，最好還是仔細閱讀標頭檔案裡面的註釋，很詳細。 執行程式