從零開始基於ARM 交叉編譯開源瀏覽器webkit
出發點: 我想看免費的國內外網路電視,所以基於ARM板DIY一個Internet TV, 需要做的工作主要有:
1) 編譯瀏覽器webkit
2) 移植clutter webkit實現類似apple介面
3) 移植Morphine.tv
設定環境變數和編譯配置
set cross compile environment firstly
export ARCH=arm
export CC=arm-none-linux-gnueabi-gcc
export CXX=arm-none-linux-gnueabi-g++
export BUILD_ROOT=$BUILD_ROOT
export PATH=$PATH:/opt/toolchains/arm-2007q3/bin/:$BUILD_ROOT/usr/bin
export PKG_CONFIG_PATH=$BUILD_ROOT/usr/lib/pkgconfig
1) zlib-1.2.3
./configure --prefix=$BUILD_ROOT/usr --shared && make && make install
2) libpng-1.2.10
./configure --prefix=$BUILD_ROOT/usr --host=arm-none-linux-gnueabi CFLAGS=-I$BUILD_ROOT/usr/include LDFLAGS=-L$BUILD_ROOT/usr/lib
make &&make install
3)tiff-3.8.2
./configure --prefix=/$BUILD_ROOT//usr --host=arm-none-linux-gnueabi
make &&make install
4) jpeg-6b
./configure --prefix=/$BUILD_ROOT/usr --host=arm-none-linux-gnueabi
make &&make install
5)freetype-2.1.10
./configure --prefix=/$BUILD_ROOT/usr --host=arm-none-linux-gnueabi
make &&make install
6)libxml2-2.6.30
./configure --prefix=/$BUILD_ROOT//usr --host=arm-none-linux-gnueabi
make &&make install
7)fontconfig-2.4.2
./configure --prefix=$BUILD_ROOT/usr/ --host=arm-none-linux-gnueabi --target=arm-none-linux-gnueabi --includedir=$BUILD_ROOT/usr/include/ --libdir=$BUILD_ROOT/usr/lib --with-arch=arm
make && make install
8) xfree86 4.8.0
9)libXft-2.1.10
./configure --prefix=$BUILD_ROOT/usr/X11R6_SGX/ --includedir=$BUILD_ROOT/usr/include --libdir=$BUILD_ROOT/usr/lib --with-x --host=arm-none-linux-gnueabi --x-includes=$BUILD_ROOT/usr/X11R6_SGX/include/ --x-libraries=$BUILD_ROOT/usr/X11R6_SGX/lib/ LDFLAGS=-L$BUILD_ROOT/usr/X11R6_SGX/lib
make && make install
10)glib-2.14.0
add these lines into configure file
ac_cv_type_long_long=yes
glib_cv_long_long_format=ll
glib_cv_stack_grows=no
glib_cv_uscore=no
ac_cv_func_posix_getpwuid_r=yes
./configure --prefix=$BUILD_ROOT/usr/ --host=arm-none-linux-gnueabi --target=arm-none-linux-gnueabi --includedir=$BUILD_ROOT/usr/include/ --libdir=$BUILD_ROOT/usr/lib --with-arch=arm
make && make install
11)atk-1.20.0
./configure --prefix=$BUILD_ROOT/usr --build=i686-pc-linux-gnu --target=arm-none-linux-gnueabi --host=arm-none-linux-gnueabi
make && make install
12) cairo-1.4.2
./configure --host=arm-none-linux-gnueabi --disable-nls --with-x --prefix=$BUILD_ROOT/usr --x-includes=$BUILD_ROOT/usr/include --x-libraries=$BUILD_ROOT/usr/lib
make && make install
13) pango-1.20.0
export FREETYPE_CONFIG=$BUILD_ROOT/usr/bin/freetype-config
export LDFLAGS="-L$BUILD_ROOT/usr/lib -Wl,-rpath=$BUILD_ROOT/usr/lib"
export CFLAGS="`pkg-config --cflags glib-2.0 cairo` -I$BUILD_ROOT/usr/include/freetype2"
./configure --host=arm-none-linux-gnueabi --disable-nls --with-x --prefix=$BUILD_ROOT/usr --x-includes=$BUILD_ROOT/usr/include --x-libraries=$BUILD_ROOT/usr/lib
14)gtk+-2.10.1
./configure --disable-cups --disable-nls --enable-xim=no --disable-xim-inst --with-xinput=no --prefix=$BUILD_ROOT/usr --host=arm-none-linux-gnueabi CFLAGS="`pkg-config --cflags cairo pango pangoft2 pangocairo` -I$BUILD_ROOT/usr/include -I$BUILD_ROOT/usr/include/freetype2" CPPFLAGS="`pkg-config --cflags cairo pango pangoft2 pangocairo` -I$BUILD_ROOT/usr/include -I$BUILD_ROOT/usr/include/freetype2"
make && make install
15) tar zxvf icu4c-3_6-src.tgz and cd icu
CC=gcc
./configure --enable-static --disable-shared
make
cp -r bin bin.linux
cp -r data data.linux
cp -r tools tools.linux
make distclean
CC=arm-none-linux-gnuabi-gcc
./configure --enable-static --enable-shared --host=arm-none-linux-gnueabi --prefix=$BUILD_ROOT/usr/
make
#will fail: /bin/sh: ../bin/icupkg: cannot execute binary file
cp -r bin bin.$ARCH
cp -r data data.$ARCH
cp -r bin.linux/* bin
cp -r data.linux/* data
make
rm bin/uconv
make
cp bin/uconv bin.$ARCH
cp bin.$ARCH/* bin
cp bin.linux/pkgdata bin
rm lib/*so*
make install
16)libxslt-1.1.22
./configure --prefix=$BUILD_ROOT/usr --build= i686-pc-linux-gnu --target=arm-none-linux-gnueabi --host=arm-none-linux-gnueabi –without-crypto --with-libxml --with-libxml-prefix=$BUILD_ROOT/usr
make && make install
17) sqlite-3.6.13
./configure --enable-releasemode --prefix=$BUILD_ROOT/usr --build= i686-pc-linux-gnu --target=arm-none-linux-gnueabi --host=arm-none-linux-gnueabi
make && make install
18) curl-7.19.2
./configure --prefix=$BUILD_ROOT/usr --with-zlib=$BUILD_ROOT/usr/ --build= i686-pc-linux-gnu --target=arm-none-linux-gnueabi --host=arm-none-linux-gnueabi
make && make install
19) WebKit-r29711
export LDFLAGS="-L$BUILD_ROOT/usr/lib -Wl,-rpath=$BUILD_ROOT/usr/lib"
./configure --prefix=$BUILD_ROOT/usr --host=arm-none-linux-gnueabi CFLAGS=-I$BUILD_ROOT/usr/include CPPFLAGS=-I$BUILD_ROOT/usr/include icu_config=$BUILD_ROOT/usr/
if there are errors like “u_charType_3_6 undefined” , link the depend library via adding -licui18n to dependency_libs in WebKit-r29711/libJavaScriptCore.la file
dependency_libs=' -lpthread -licui18n '
實踐結果:
由於webkit編譯完後只產生一個動態庫,需要再編譯個帶有操作介面的瀏覽器,原始碼和Makefile如下:
#include <gtk/gtk.h>
#include <WebKit/webkit.h>
static GtkWidget* main_window;
static GtkWidget* uri_entry;
static GtkStatusbar* main_statusbar;
static WebKitWebView* web_view;
static gchar* main_title;
static gint load_progress;
static guint status_context_id;
static gboolean
show_web_view_cb (WebKitWebView* web_view)
{
GtkWidget* window = gtk_widget_get_toplevel(GTK_WIDGET(web_view));
gtk_widget_show_all(window);
return TRUE;
}
static WebKitWebView*
create_web_view_cb (WebKitWebView* web_view, WebKitWebFrame* web_frame)
{
GtkWidget* new_window;
GtkWidget* scrolled_window;
GtkWidget* new_web_view = webkit_web_view_new();
g_signal_connect (G_OBJECT (new_web_view), "web-view-ready", G_CALLBACK (show_web_view_cb), NULL);
new_window = gtk_window_new(GTK_WINDOW_TOPLEVEL);
scrolled_window = gtk_scrolled_window_new(NULL, NULL);
gtk_widget_show(scrolled_window);
gtk_container_add(GTK_CONTAINER(new_window), scrolled_window);
gtk_container_add(GTK_CONTAINER(scrolled_window), new_web_view);
return WEBKIT_WEB_VIEW(new_web_view);
}
static void
activate_uri_entry_cb (GtkWidget* entry, gpointer data)
{
const gchar* uri = gtk_entry_get_text (GTK_ENTRY (entry));
g_assert (uri);
webkit_web_view_open (web_view, uri);
}
static void
update_title (GtkWindow* window)
{
GString* string = g_string_new (main_title);
g_string_append (string, " - WebKit Launcher");
if (load_progress < 100)
g_string_append_printf (string, " (%d%%)", load_progress);
gchar* title = g_string_free (string, FALSE);
gtk_window_set_title (window, title);
g_free (title);
}
static void
link_hover_cb (WebKitWebView* page, const gchar* title, const gchar* link, gpointer data)
{
/* underflow is allowed */
gtk_statusbar_pop (main_statusbar, status_context_id);
if (link)
gtk_statusbar_push (main_statusbar, status_context_id, link);
}
static void
title_change_cb (WebKitWebView* web_view, WebKitWebFrame* web_frame, const gchar* title, gpointer data)
{
if (main_title)
g_free (main_title);
main_title = g_strdup (title);
update_title (GTK_WINDOW (main_window));
}
static void
progress_change_cb (WebKitWebView* page, gint progress, gpointer data)
{
load_progress = progress;
update_title (GTK_WINDOW (main_window));
}
static void
load_commit_cb (WebKitWebView* page, WebKitWebFrame* frame, gpointer data)
{
const gchar* uri = webkit_web_frame_get_uri(frame);
if (uri)
gtk_entry_set_text (GTK_ENTRY (uri_entry), uri);
}
static void
destroy_cb (GtkWidget* widget, gpointer data)
{
gtk_main_quit ();
}
static void
go_back_cb (GtkWidget* widget, gpointer data)
{
webkit_web_view_go_back (web_view);
}
static void
go_forward_cb (GtkWidget* widget, gpointer data)
{
webkit_web_view_go_forward (web_view);
}
static GtkWidget*
create_browser ()
{
GtkWidget* scrolled_window = gtk_scrolled_window_new (NULL, NULL);
gtk_scrolled_window_set_policy (GTK_SCROLLED_WINDOW (scrolled_window), GTK_POLICY_AUTOMATIC, GTK_POLICY_AUTOMATIC);
web_view = WEBKIT_WEB_VIEW (webkit_web_view_new ());
gtk_container_add (GTK_CONTAINER (scrolled_window), GTK_WIDGET (web_view));
g_signal_connect (G_OBJECT (web_view), "create-web-view", G_CALLBACK (create_web_view_cb), NULL);
g_signal_connect (G_OBJECT (web_view), "title-changed", G_CALLBACK (title_change_cb), web_view);
g_signal_connect (G_OBJECT (web_view), "load-progress-changed", G_CALLBACK (progress_change_cb), web_view);
g_signal_connect (G_OBJECT (web_view), "load-committed", G_CALLBACK (load_commit_cb), web_view);
g_signal_connect (G_OBJECT (web_view), "hovering-over-link", G_CALLBACK (link_hover_cb), web_view);
return scrolled_window;
}
static GtkWidget*
create_statusbar ()
{
main_statusbar = GTK_STATUSBAR (gtk_statusbar_new ());
status_context_id = gtk_statusbar_get_context_id (main_statusbar, "Link Hover");
return (GtkWidget*)main_statusbar;
}
static GtkWidget*
create_toolbar ()
{
GtkWidget* toolbar = gtk_toolbar_new ();
gtk_toolbar_set_orientation (GTK_TOOLBAR (toolbar), GTK_ORIENTATION_HORIZONTAL);
gtk_toolbar_set_style (GTK_TOOLBAR (toolbar), GTK_TOOLBAR_BOTH_HORIZ);
GtkToolItem* item;
/* the back button */
item = gtk_tool_button_new_from_stock (GTK_STOCK_GO_BACK);
g_signal_connect (G_OBJECT (item), "clicked", G_CALLBACK (go_back_cb), NULL);
gtk_toolbar_insert (GTK_TOOLBAR (toolbar), item, -1);
/* The forward button */
item = gtk_tool_button_new_from_stock (GTK_STOCK_GO_FORWARD);
g_signal_connect (G_OBJECT (item), "clicked", G_CALLBACK (go_forward_cb), NULL);
gtk_toolbar_insert (GTK_TOOLBAR (toolbar), item, -1);
/* The URL entry */
item = gtk_tool_item_new ();
gtk_tool_item_set_expand (item, TRUE);
uri_entry = gtk_entry_new ();
gtk_container_add (GTK_CONTAINER (item), uri_entry);
g_signal_connect (G_OBJECT (uri_entry), "activate", G_CALLBACK (activate_uri_entry_cb), NULL);
gtk_toolbar_insert (GTK_TOOLBAR (toolbar), item, -1);
/* The go button */
item = gtk_tool_button_new_from_stock (GTK_STOCK_OK);
g_signal_connect_swapped (G_OBJECT (item), "clicked", G_CALLBACK (activate_uri_entry_cb), (gpointer)uri_entry);
gtk_toolbar_insert (GTK_TOOLBAR (toolbar), item, -1);
return toolbar;
}
static GtkWidget*
create_window ()
{
GtkWidget* window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
gtk_window_set_default_size (GTK_WINDOW (window), 1280, 720);
gtk_widget_set_name (window, "GtkLauncher");
g_signal_connect (G_OBJECT (window), "destroy", G_CALLBACK (destroy_cb), NULL);
return window;
}
int
main (int argc, char* argv[])
{
gtk_init (&argc, &argv);
GtkWidget* vbox = gtk_vbox_new (FALSE, 0);
gtk_box_pack_start (GTK_BOX (vbox), create_toolbar (), FALSE, FALSE, 0);
gtk_box_pack_start (GTK_BOX (vbox), create_browser (), TRUE, TRUE, 0);
gtk_box_pack_start (GTK_BOX (vbox), create_statusbar (), FALSE, FALSE, 0);
main_window = create_window ();
gtk_container_add (GTK_CONTAINER (main_window), vbox);
gchar* uri = (gchar*) (argc > 1 ? argv[1] : "http://www.google.com/");
webkit_web_view_open (web_view, uri);
gtk_widget_grab_focus (GTK_WIDGET (web_view));
gtk_widget_show_all (main_window);
gtk_main ();
return 0;
}
Makefile:
CC=arm-none-linux-gnueabi-gcc
CXX=arm-none-linux-gnueabi-g++
LDFLAGS=-L$BUILD_ROOT/usr/lib -Wl,-rpath=$BUILD_ROOT/usr/lib
CFLAGS=-I$BUILD_ROOT/usr/include/WebKit
SOURCE=webkit.c
all:
$(CC) $(SOURCE) -o webkittest `pkg-config --cflags --libs gtk+-2.0` $(LDFLAGS) $(CFLAGS) –lWebKitGtk
配置x11執行環境:
export FONTCONFIG_PATH=/etc/fonts
export PANGO_RC_FILE=/etc/pango/pangorc
export LD_LIBRARY_PATH=/usr/lib
Xfbdev &
export DISPLAY=:0
export LANG=zh_CN.gbk
export LC_ALL=zh_CN.gbk
export G_BROKEN_FILES=1
export LC_COLLATE=C
開啟sina網站
./webkittest http://www.sina.com
結論:
沒有優化的webkit在beagleboard(600MHZ)執行sina網站需要接近一分鐘。