2.       Webkit 源代码由三大模块组成:

1). WebCore,

2). WebKit,

3). JavaScriptCore。

WebCore:排版引擎核心,WebCore包含主要以下模块:Loader, Parser(DOM,Render), Layout,Paint。

WebKit:移植层,主要包含: GUI,File System, Thread,Text,图片编解码等与平台相关的函数。

JavaScriptCore:JS虚拟机,相对独立,主要用于操作DOM, DOM是W3C定义的规范,主要用于定义外部可以操作的浏览器内核的接口,而webcore必须实现DOM规范。

(具体的DOM规范可以查w3c.)

3.       WebKit分模块介绍(这里简单列出,后面再具体介绍)

Webkit平台相关

1)       CURL网络库

2)       libPng, LibJpeg图形处理相关

3)       sqlite小型关系数据库

WebCore核心

1)       Loader加载资源及Cache 实现(Curl)

2)       DOM : HTML词法分析与语法分析

3)       DOM : DOM节点与Render节点创建,形成DOM树

4)       Render:Render树介绍,RenderBox

5)       Layout:排版介绍

6)       Css Parser模块

7)       Binding-DOM与JavascriptCore绑定的功能

JavascriptCore-javascript引擎

1)       API-基本javascript功能

2)       Binding与其它功能绑定的功能,如:DOM,C,JNI

3)       DerviedSource自动产生的代码

4)       PCRE-Perl-Compatible Regular Expressions

5)       KJS-Javascript Kernel

4. 页面的整个处理流程—(简单介绍,详细流程在后面笔记中)

1). 用户输入网址后,FrameLoader::load函数会接收到URL。

   2). 把URL 请求传给CURL库。

   3). CURL发出http请求,得到数据后,传给Loader,开始解析。

   4). 通过Dom Builder按W3C的html规范生成Dom树

   5). 如果有javascript,JSEngine就通过ECMA-262标准完善Dom树

   6). 在生成DOM树的同时, 同步生成Render树。

   7). 解析完后, 调用Layout排版

   8). Paint出来

二、libCurl库介绍

前面有说道webkit仅仅是一个页面排版的引擎,所以,对webkit来说,网页数据(html文件,图片,.css,.js文件)的请求与接收都是通过第三方的库:libCurl来处理。

打开webkit开发工程(.sln)即可以看到,libcurl可以被静态或动态链接到主工程中。

Libcurl就是指的curl,只是在webkit工程中,不作为单独的进程存在,而是被编译成动态库。

webkit主要用到curl的以下功能:

1)       Http协议。包含:Get, put, Post, Cookie管理。

2)       https协议。

3)       本地文件缓存。(前进,后退管理)

Webkit具体调用了哪些curl接口,详见后面Loader模块介绍章节。这里简单列举:

1)           curl_global_init(CURL_GLOBAL_ALL);

2)           curl_multi_init()

3)           curl_share_init()

4)           curl_share_setopt()

5)           curl_easy_getinfo()

6)           curl_multi_fdset()

7)           curl_multi_perform()

8)           curl_multi_info_read()

9)           curl_multi_cleanup()

10)       curl_share_cleanup()

11)       curl_global_cleanup();

可以看到,由于webkit要支持同时请求多个http数据,所以用到的是curl的multi接口。

在介绍Loader之前,先介绍一下libcurl,打下基础。

以下附一篇libcurl的介绍:

一、     概念

1.         为什么要使用libcurl

1)        作为http的客户端,可以直接用socket连接服务器,然后对到的数据进行http解析,但要分析协议头,实现代理…这样太麻烦了。

2)        libcurl是一个开源的客户端url传输库,支持FTP,FTPS,TFTP,HTTP,HTTPS,GOPHER,TELNET,DICT,FILE和LDAP,支持Windows,Unix,Linux等平台,简单易用,且库文件占用空间不到200K

2.         get和post方式

客户端在http连接时向服务提交数据的方式分为get和post两种

1)        Get方式将所要传输的数据附在网址后面,然后一起送达服务器,它的优点是效率比较高;缺点是安全性差、数据不超过1024个字符、必须是7位的ASCII编码;查询时经常用此方法。

2)        Post通过Http post处理发送数据,它的优点是安全性较强、支持数据量大、支持字符多;缺点是效率相对低;编辑修改时多使用此方法。

3.         cookie与session

1)        cookie

cookie是发送到客户浏览器的文本串句柄,并保存在客户机硬盘上,可以用来在某个Web站点会话之间持久地保持数据。cookie在客户端。

2)        session

session是访问者从到达某个特定主页到离开为止的那段时间。每一访问者都会单独获得一个session,实现站点多个用户之间在所有页面中共享信息。session在服务器上。

3)        libcurl中使用cookie

保存cookie, 使之后的链接与此链接使用相同的cookie

a)         在关闭链接的时候把cookie写入指定的文件

curl_easy_setopt(curl, CURLOPT_COOKIEJAR, "/tmp/cookie.txt");

b)        取用现在有的cookie,而不重新得到cookie

curl_easy_setopt(curl, CURLOPT_COOKIEFILE, "/tmp/cookie.txt");

b)        http与https的区别

1)        Http是明文发送,任何人都可以拦截并读取内容

2)        Https是加密传输协议,用它传输的内容都是加密过的,https是http的扩展,其安全基础是SSL协议

c)        base64编码

1)        为什么要使用base64编码

如果要传一段包含特殊字符比较多的数据,直接上传就需要处理转意符之类的很多问题,用base64编码,它可以把数据转成可读的字串,base64由a-z, A-Z, +/总计64个字符组成。

2)        传送base64编码的注意事项

由于base64的组成部分有加号,而加号是url中的转意字符,所以无论是get方式还是post,传到服务器的过程中,都会把加号转成空格,所以在传base64之前需要把base64编码后的加号替换成”%2B”,这样就可以正常发送了。

二、  例程

d)        代码

#include <stdio.h>

#include <curl/curl.h>

bool getUrl(char *filename)

{

CURL *curl;

CURLcode res;

FILE *fp;

if ((fp = fopen(filename, "w")) == NULL)  // 返回结果用文件存储

return false;

struct curl_slist *headers = NULL;

headers = curl_slist_append(headers, "Accept: Agent-007");

curl = curl_easy_init();    // 初始化

if (curl)

{

curl_easy_setopt(curl, CURLOPT_PROXY, "10.99.60.201:8080");// 代理

curl_easy_setopt(curl, CURLOPT_HTTPHEADER, headers);// 改协议头

curl_easy_setopt(curl, CURLOPT_URL,   "http://www.google.com/search?hl=en&q=xieyan0811&btnG=Google+Search&aq=f&oq=xieyan081");

curl_easy_setopt(curl, CURLOPT_WRITEDATA, fp);

res = curl_easy_perform(curl);   // 执行

curl_slist_free_all(headers);

curl_easy_cleanup(curl);

}

fclose(fp);

return true;

}

bool postUrl(char *filename)

{

CURL *curl;

CURLcode res;

FILE *fp;

if ((fp = fopen(filename, "w")) == NULL)

return false;

curl = curl_easy_init();

if (curl)

{

curl_easy_setopt(curl, CURLOPT_COOKIEFILE, "/tmp/cookie.txt"); // 指定cookie文件

// curl_easy_setopt(curl, CURLOPT_COOKIEJAR, "/tmp/cookie.txt");

curl_easy_setopt(curl, CURLOPT_POSTFIELDS, "&logintype=uid&u=xieyan&psw=xxx86");    // 指定post内容

curl_easy_setopt(curl, CURLOPT_PROXY, "10.99.60.201:8080");

curl_easy_setopt(curl, CURLOPT_URL, "http://mail.sina.com.cn/cgi-bin/login.cgi");   // 指定url

curl_easy_setopt(curl, CURLOPT_WRITEDATA, fp);

res = curl_easy_perform(curl);

curl_easy_cleanup(curl);

}

fclose(fp);

return true;

}

int main(void)

{

getUrl("/tmp/get.html");

postUrl("/tmp/post.html");

}

e)         编译

g++ main.cpp -o main -lcurl

三、Loader模块介绍

前面说过, webkit只是一个排版引擎,在Webkit排版/渲染一个网页之前, 它肯定需要从网络上、或者本地文件系统中读到网页的http数据,对吧,对webkit来讲,他要的就是数据,不管你是从网络读的还是本地文件读的。

Loader就是这样一个模块,它承上启下,不仅负责为webkit引擎提供数据,还控制着webkit的绘制。另外,它同时还与提供数据的“来源”打交道。

先简单举例说明:

用户输入一个url,这时是Loader接收url请求,它把url传递给curl,设置curl的回调函数,当curl读到数据,loader把数据传递给Parser,开始生成DOM。

一.下面重点介绍一下与Loader相关的数据结构和模块。

Frame:可以看做是浏览器外壳调用Loader的总入口,它就像我们印象中的一个网页,它关注的是页面的显示 (FrameView) 、页面数据的加载(FrameLoader) 、页面内的各种控制器 (Editor, EventHandler, ScriptController, etc.) 等等,它包含以下模块(只列出重点):

Document

Page

FrameView

RenderView

FrameLoader

DOMWindow

下面分别介绍(PS: 必须要了解这些概念,不然后面的东东都无法理解):

1)Document:这个类的爷爷类是 Node ,它是 DOM 树各元素的基类; Document 有个子类是 HTMLDocument ,它是整个文档 DOM 树的根结点,这样就明白了:原来 Document 就是描述具体文档的代码,看一下它的头文件,就更明白了,它的属性与方法就是围绕着各种各样的结点: Text, Comment , CDATASection , Element……

2)Page: 我的理解是,Page与webview外部接口相关, page与frame是一对多的关系,同时Frame与FrameView是一一对应的,Frameview关注UI,Page关注数据与接口。现在的浏览器一般都提供同时打开多个窗口,每一个窗口对应的数据就是这个Page在管理了。

在 page.cpp 文件里,还有个重要的全局指针变量: static HashSet<Page*>* allPages; 这个变量包含了所有的page 实例。

3)FrameView: 可以理解为为一个网页的ViewPort, 它提供一个显示区域,同时包含的有Render根节点、layout排版相关接口、Scroll相关等。FrameView是Layout排版的总入口。

4)RenderView: 与FrameView差不多,只是分工不同,它管理与Render树相关的东东。

5) FrameLoader:重点,FrameLoader类将Documents加载到Frames。当点击一个链接时,FrameLoader创建一个新的处于“policy”状态的DocumentLoader对象,一旦webkit指示FrameLoader将本次加载视为一个导航(navigation),FrameLoader就推动DocumentLoader进入“provisional”状态,(在该状态,DocumentLoader发调用CURL发起一个网络请求,并等待是html还是下载文件。)同时, DocumentLoader会创建一个MainResourceLoader对象(该对象在后面单独介绍)。

6)。DOMWindow: 实现了Dom的一些接口,如CreateNode等。后面可以详细讲讲。

上面介绍的概念比较多,我也不晓得好不好理解,没理解也不怕,多去看看代码,这是必须的。

二、Webkit的Loader有两条加载数据的主线

1. MainResourceLoader: 该模块主要加载主网页请求。后面称为MainResource。

2. DocLoader: 该模块除了主网页外的所有子请求,如:.js文件,图片资源,.css文件。  后面称为SubResource。

MainResource部分:

FrameLoader->DocumentLoader->MainResourceLoader-ResourceHandle DocumentLoader经历状态:1)"policy" 2) "provisional" 3) "commited"分别是等待、作为navigation发送network request、文件下载完毕

Subresource部分:

DocLoader->Cache->[CacheObjects]  CacheImage->SubresourceLoader->ResourceHandle 。当请求一个资源时,首先查看Cache中是否存在该对象,如果存在直接返回;如果不存在,创建该Cache对象(如CacheImage),然后创建一个SubresourceLoader,加载资源。

举例说明:

加载图片时, DocLoader首先询问Cache, 在内存中是否也存在(CachedImage对象),如果已存在,则直接加载,即省了时间又省了流量。如果图片不在Cache中,Cache首先创建一个新的CachedImage对象来代表该图片,然后由CachedImage对象调用Loader对象发起一个网络请求,Loader对象创建SubResourceLoader。后面的流程就一样了,SubResourceLoader也是直接把ResourceHandle打交道的。

http://www.cnblogs.com/bigben0123/archive/2013/06/25/3154890.html

WebKit由三个模块组成-Webkit模块介绍的更多相关文章

  1. [Firefly引擎][学习笔记三][已完结]所需模块封装

    原地址:http://www.9miao.com/question-15-54671.html 学习笔记一传送门学习笔记二传送门 学习笔记三导读:        笔记三主要就是各个模块的封装了,这里贴 ...

  2. 第三十天- 进程 Process模块 空间隔离

    1.进程: 进程(Process)是计算机中的程序关于某数据集合上的一次运行活动,是系统进行资源分配和调度的基本单位,是操作系统结构的基础.在早期面向进程设计的计算机结构中,进程是程序的基本执行实体: ...

  3. Python笔记(三):构建发布模块

      (一)     准备工作 1.   新建一个模块(名称自定义),存放要发布的模块代码. 2.   新建一个setup.py的模块(存放模块的元数据,描述相关信息). 3.   新建一个文件夹(名称 ...

  4. 单页WEB应用(三),Chat聊天模块

    Chat 聊天模块 这个模块应该就是该书全篇的唯一一个模块吧,后面差点儿全部的篇章都环绕这个模块去实现的,只是就通过这一个模块的实现和上线,也能体现单页应用开发到公布上线的整个过程,毕竟后面的数据.通 ...

  5. 「雕爷学编程」Arduino动手做(34)——三色LED交通灯模块

    37款传感器与模块的提法,在网络上广泛流传,其实Arduino能够兼容的传感器模块肯定是不止37种的.鉴于本人手头积累了一些传感器和模块,依照实践出真知(一定要动手做)的理念,以学习和交流为目的,这里 ...

  6. 循序渐进nginx(三):日志管理、http限流、https配置,http_rewrite模块,第三方模块安装,结语

    目录 日志管理 access_log error_log 日志文件切割 自定义错误页 http访问限流 限制请求数 语法 使用 限制连接数 语法 测试 补充: https配置 使用 生成证书 配置ng ...

  7. 第三课:sea.js模块加载原理

    模块加载,其实就是把js分成很多个模块,便于开发和维护.因此加载很多js模块的时候,需要动态的加载,以便提高用户体验. 在介绍模块加载库之前,先介绍一个方法. 动态加载js方法: function l ...

  8. 【python标准库模块三】Os模块和Sys模块学习

    Os模块 导入os模块 import os 获取当前工作目录 os.getcwd() 切换目录,跟linux中的cd一样 os.chdir("文件夹名") 递归生成文件夹 os.m ...

  9. Numpy入门(三):Numpy概率模块和线性代数模块

    Numpy中经常使用到的两个模块是概率模块和线性代数模块,random 和 linalg 两个模块. 概率模块 产生二项分布的随机数:np.random.binomial(n,p,size=-),其中 ...

  10. 三、python学习-常用模块

    一.常用模块 1.math数学模块 在计算机中,所有数值在计算机底层都是约等于机制,并不是精确地 import math #ceil() 向上取整操作 math.ceil(3.1)=>4 #fl ...

随机推荐

  1. laravel数据迁移

    创建数据库迁移: php artisan make:migration create_表名_table 回车后就会创建迁移版本   回滚数据库迁移: php artisan migrate 会将数据按 ...

  2. Angular2-除了自定义标签,你还可以这样配置组件的选择器

    开发应用时,UCD给到我们的样式经常使用子类选择器“>”,如果所有组件都用自定义的标签选择器,开发人员无疑要对很多样式做调整. Angular2组件化除了自定义标签,还可以在selector元数 ...

  3. The following control could not be licensed: TXTextControl.TextControl。。解决方案

    在这篇博客中,下面的控制不能授权:txtextcontrol.textcontrol这意味着,找不到合适的许可证来验证控制.一般情况下,许可证将被自动纳入应用程序,通常不必担心许可证的所有. “许可证 ...

  4. 最近在研究asp.net mvc

    看了很多大牛写的博客,依然对mvc云里雾里. 有一点是毋庸置疑的C应该是一座桥梁建立在model和view之间. 在ASP.NET MVC中,控制器通常是继承System.Web.Mvc.Contro ...

  5. C# 之VS程序打包

    VS2012没有自带打包工具,所以要先下载并安装一个打包工具.我采用微软提供的打包工具:  InstallShield2015LimitedEdition.下载地址:http://pan.baidu. ...

  6. [Telegram X]旧版分享 突破被锁群组

    Telegram X的锁群是由于 App Store 审核时发现Telegram官方并不限制18+.社会舆论等的讨论:在 版本 5.0.2 (版本号825487096)时就已经封禁该类群组 注:可能由 ...

  7. docker 无法启动容器,run容器后状态为restarting

    问题:如题,无法进入容器,docker logs 容器id  发现 哦 ,原来缺少个文件,这些就容易了

  8. UOJ#347. 【WC2018】通道(边分治)

    传送门 就是求两个点 \(a,b\) 使得 \(dis_1(a,b)+dis_2(a,b)+dis_3(a,b)\) 最大 step1 对第一棵树边分治 那么变成 \(d_1(a)+d_1(b)+di ...

  9. word-wrap,word-break,white-space

    这3个属性都与换行有关,看看有啥区别. 语法介绍 [word-wrap] 定义:属性允许长单词或 URL 地址换行到下一行: 语法: word-wrap: normal|break-word; bre ...

  10. JavaWeb学习总结(一):基本概念

    一.基本概念 1.1.WEB开发的相关知识 WEB,在英语中web即表示网页的意思,它用于表示Internet主机上供外界访问的资源. Internet上供外界访问的Web资源分为: 静态web资源( ...