在尋找插件開發資料的過程中找到了一個開發瀏覽器插件的開源項目——firebreath。參考:firebreath主頁。根據其介紹可以實現各種瀏覽器插件的開發。于是我進行了嘗試,并試圖搜索利用firebreath開發插件的中文資料。搜索到的相關中文資料有一個:徐凡的博客。其中有使用firebreath開發瀏覽器插件(一、二、三)三篇關于firebreath開發插件的文章。看完了,但是還是不怎么會。
經過兩周的摸索,基本上掌握了用firebreath開發插件的初步流程,但是沒法熟練運用。主要根據firebreath上的getting started進行,這里記錄一下用firebreath開發插件的基本流程(開發環境我用的是VS2010中文旗艦版)。準備工作
要使用firebreath來開發插件,需要下載以下東西:firebreath的源代碼、python、CMake。安裝python(可以是2.5 2.6 2.7版本,我下載的是2.7版本),注意python最好安裝在firebreath的工程目錄中。安裝CMake(我下載的最新版本),注意安裝過程中請選擇添加到環境變量。Firebreath源代碼可以在github上簽出(需要安裝git bash),也可以直接下載壓縮包文件,我直接下載zip程序包,firebreath 1.6 zip包下載地址。下面是詳細步驟,將源代碼下載下來之后解壓到:D:\Users\zcf\Documents\My Program\2012\FireBreath\中。我將python安裝在D:\Users\zcf\Documents\My Program\2012\FireBreath\Python27\注意即使不安裝在firebreath目錄也 不要安裝在目錄路徑有特殊字符(特別是空格)的路徑下,與firebreath文件夾的相對路徑沒有空格也行。
創建新的plugin
運行cmd(win7請以管理員身份運行)。轉到firebreath的根目錄下:
cd /d D:\Users\zcf\Documents\My Program\2012\FireBreath
運行fbgen.py
Python27\python.exe fbgen.py
運行到此截圖:

輸入需要輸入的東西

完成之后在firebreath根目錄下會產生一個projects文件夾,里面就是剛剛建立的工程的源文件了。這些文件在firebreath的網站上有詳細介紹,看得很模糊,我就不羅嗦了,需要看的自己去看原文說明吧。
創建工程
還是在剛才那個cmd窗口中運行prep2010.cmd,如下圖:
我使用VS2010來開發,因此運行prep2010.cmd、如果你使用其他版本請使用相應的prep文件。另外,如果需要創建給出的兩個例子,則可以運行prep2010.cmd examples。
運行完畢就創建好工程了,在firebreath根目錄下的build文件夾下面會生成很多文件,其中有一個FireBreath.sln就是我們熟悉的VS解決方案文件了。雙擊這個文件就可以用VS打開這個解決方案了。如下圖:

最后一個項目就是我們建立的項目,其他的是自己生成的。當我們新建第二個plugin時就會在這個之后再添加一個項目吧!(不過我還沒試過)。
接下來就在VS中生成解決方案。整個過程完成之后就會在~FireBreath\build\bin\demo\Debug\下面找到npdemo.dll,這就是我們生成的plugin了。在~FireBreath\build\projects\demo\gen\目錄下可以找到FBControl.htm文件,這個文件就是我們這個plugin的測試頁面了,當然你也可以自己編寫測試頁面。
將產生的npdemo.dll復制到用來測試的Firefox profile文件中plugins目錄(沒有的話自己新建吧)下,然后用這個profile運行Firefox,打開FBControl.htm文件。如下圖:(也可以采用其他方式注冊plugin,請參考相關資料)

點擊確定之后:

這樣這個plugin就創建完畢了,還沒看明白呢,就結束了?太快了吧。。。
我剛開始建立完就是這個感覺:我可以創建plugin了,可是我感覺我又什么都不會。一般的有關創建plugin的說明都是到這個地方就結束了,給我的感覺就是還沒開始就結束了。。。
實現一個簡單的功能
其實上面這個例子已經實現了很多比較實用的功能了,可是我比較菜,只能看懂一小部分。我想實現一個用鼠標在plugin窗口上畫線的功能。經過摸索,終于可以實現我想實現的這個功能了。下面是我的步驟:看程序的過程中我發現已經實現了鼠標按下,抬起,移動等事件的函數,但是函數體只有一個return語句,下圖是所有已經實現的函數:

看到這些函數,我想畫線的函數就可以利用這三個鼠標事件來來完成吧。于是我做了如下工作。
1,定義幾個私有成員變量(demo.h文件中):

2,在構造函數中初始化一下(demo.cpp文件中):

3,先寫onMouseDown和onMouseUp兩個函數中的代碼(作用:修改鼠標是否按下的狀態)。如下圖,框住的是添加的內容:

4,再來寫鼠標移動時實現的功能,首先獲取鼠標指針所在的點,與前面一樣:m_mousePosXnew=evt->m_x; m_mousePosYnew=evt->m_y;就搞定了;然后就是畫線的功能了(如果你對windows編程很熟悉就直接看后面的程序截圖吧,因為我不熟悉,所以我將這個過程描述得詳細一點,請理解),從old 的點畫到new這個點。我雖然對windows程序開發不是很熟練,但是還是知道有個LineTo的函數,因此先就假設是LineTo(old,new)吧。于是就接下來寫:
if (b_isDown)
{
LineTo(old, new);
}
最后,將new這一點保存為old的點:
m_mousePosXold= m_mousePosXnew; m_mousePosYold= m_mousePosYnew;
所以這里就剩下搞清楚 LineTo這個函數了,要實現從一個點畫線到另一個點在windows中其實是這樣實現的:
HDC hDC;
hDC=GetDC(hWnd);
MoveToEx(hDC,m_mousePosXold,m_mousePosYold,NULL);
LineTo(hDC,m_mousePosXnew,m_mousePosYnew);
ReleaseDC(hWnd,hDC);
上面這樣實現了,要使用HDC以及MoveToEx和LineTo需要包含頭文件PluginWindowWin.h。還差個HWND,如何得到這個HWND,我也說不清楚,我是看到例子FBTestPlugin中的代碼才知道可以這樣獲取的:FB::PluginWindowWin *wnd = dynamic_cast<FB::PluginWindowWin*>(win); HWND hWnd=wnd->getHWND();下面是FBTestPlugin 的FBTestPlugin.cpp文件中的代碼片段截圖:

經過嘗試,終于完成了我想要實現的這個簡單功能,再次感慨一下開發plugin對windows編程的基礎能力還是有相當需求的。下面是完整的onMouseMove函數代碼截圖,框住的是添加的內容(注意在文件最前面添加頭文件的引用#include "PluginWindowWin.h"):

做完這些修改之后,在demo這個項目上選擇僅用于項目->僅重新生成demo。等生成完畢之后,去前面的位置找到npdemo.dll復制到Firefox相應profile下的plugins目錄,重新啟動Firefox,打開那個測試頁面。
下面是運行效果,請忍受我的涂鴉,\(^o^)/~

差不多了吧,這個簡單的功能就這樣了。或許再添加一個鼠標移出區域的事件,在其中將鼠標按下狀態設為false會更好。
我做插件的目的是要播放瀏覽器不支持的媒體文件,我會繼續慢慢研究,希望研究插件開發的能一起共同交流,交流群:81424441。
http://www.firebreath.org/display/documentation/FireBreath+Home