聊聊No.js 支持 HTTP 模块

开发 前端
No.js 初步支持了 HTTP 能力,目前只是支持解析 HTTP 请求,很多地方还需要慢慢琢磨,本文简单介绍其实现。

[[427158]]

1 HTTP 解析器

No.js 使用 Node.js 的 HTTP 解析器 llhttp 实现 HTTP 协议的解析,llhttp 负责解析 HTTP 报文,No.js 需要做的事情是保存解析的结果并封装具体的能力。看看 No.js 是如何封装 llhttp 的。

  1. class HTTP_Parser { 
  2.     public
  3.         HTTP_Parser(llhttp_type type, parser_callback callbacks = {}) { 
  4.             llhttp_init(&parser, type, &HTTP_Parser::settings); 
  5.             // set data after llhttp_init, because llhttp_init will call memset to fill zero to memory  
  6.             parser.data = this; 
  7.             memset((void *)&callback, 0, sizeof(callback)); 
  8.             callback = callbacks; 
  9.         } 
  10.  
  11.         int on_message_begin(llhttp_t* parser); 
  12.         int on_status(llhttp_t* parser, const charat, size_t length); 
  13.         int on_url(llhttp_t* parser, const charat, size_t length); 
  14.         int on_header_field(llhttp_t* parser, const charat, size_t length); 
  15.         int on_header_value(llhttp_t* parser, const charat, size_t length); 
  16.         int on_headers_complete(llhttp_t* parser); 
  17.         int on_body(llhttp_t* parser, const charat, size_t length); 
  18.         int on_message_complete(llhttp_t* parser); 
  19.         int parse(const char* data, int len); 
  20.         void print(); 
  21.     private:  
  22.         unsigned char major_version; 
  23.         unsigned char minor_version; 
  24.         unsigned char upgrade; 
  25.         unsigned char keepalive; 
  26.         time_t parse_start_time; 
  27.         time_t header_end_time; 
  28.         time_t message_end_time; 
  29.         string url; 
  30.         string status; 
  31.         vector<string> keys; 
  32.         vector<string> values
  33.         string body; 
  34.         llhttp_t parser; 
  35.         parser_callback callback; 
  36.         static llhttp_settings_t settings; 
  37. }; 

HTTP_Parser 是对 llhttp 的封装,主要是注册 llhttp 的钩子,llhttp 在解析 HTTP 报文的时候会回调 HTTP_Parser 的钩子。比较麻烦的是需要在 HTTP_Parser 对象里保存 llhttp 的解析结果,把 HTTP_Parser 类的成员函数转成 c 函数作为 llhttp 的回调非常麻烦,问题在于如何在 llhttp 执行回调的时候找到对应的 HTTP_Parser 对象。比如 llhttp 的 on_message_begin 回调格式是

  1. typedef int (*llhttp_cb)(llhttp_t*); 

我们看到回调里只有 llhttp 相关的数据结构,拿不到 HTTP_Parser 对象,最终发现 llhttp 提供了 data 字段关联上下文。所以在 HTTP_Parser 初始化时关联 llhttp 和 HTTP_Parser 的上下文。

  1. HTTP_Parser(llhttp_type type, parser_callback callbacks = {}) { 
  2.     llhttp_init(&parser, type, &HTTP_Parser::settings); 
  3.     parser.data = this; 

我们在 llhttp 回调时通过 data 字段就可以取得 HTTP_Parser 对象。下面是所有钩子的实现。

  1. llhttp_settings_t No::HTTP::HTTP_Parser::settings = { 
  2.     [](llhttp_t * parser) { 
  3.         return ((HTTP_Parser *)parser->data)->on_message_begin(parser); 
  4.     }, 
  5.     [](llhttp_t * parser, const char * data, size_t len) { 
  6.         return ((HTTP_Parser *)parser->data)->on_url(parser, data, len); 
  7.     }, 
  8.     [](llhttp_t * parser, const char * data, size_t len) { 
  9.         return ((HTTP_Parser *)parser->data)->on_status(parser, data, len); 
  10.     }, 
  11.     [](llhttp_t * parser, const char * data, size_t len) { 
  12.         return ((HTTP_Parser *)parser->data)->on_header_field(parser, data, len); 
  13.     }, 
  14.     [](llhttp_t * parser, const char * data, size_t len) { 
  15.         return ((HTTP_Parser *)parser->data)->on_header_value(parser, data, len); 
  16.     }, 
  17.     [](llhttp_t * parser) { 
  18.         return ((HTTP_Parser *)parser->data)->on_headers_complete(parser); 
  19.     }, 
  20.     [](llhttp_t * parser, const char * data, size_t len) { 
  21.         return ((HTTP_Parser *)parser->data)->on_body(parser, data, len); 
  22.     }, 
  23.     [](llhttp_t * parser) { 
  24.         return ((HTTP_Parser *)parser->data)->on_message_complete(parser); 
  25.     } 
  26. }; 

这样就完成了 llhttp 和 No.js 的关联。解析完 HTTP 协议后,最终还需要回调 No.js 的 JS 层。HTTP_Parser 目前支持三种回调。

  1. struct parser_callback { 
  2.     void * data; 
  3.     p_on_headers_complete on_headers_complete; 
  4.     p_on_body on_body; 
  5.     p_on_body_complete on_body_complete; 
  6. }; 

2 HTTP C++ 模块

完成了 llhttp 的封装后,接着需要把这个能力暴露到 JS 层。看一下 C++ 模块到定义。

  1. class Parser : public BaseObject { 
  2.   public
  3.       Parser(Environment* env, Local<Object> object): BaseObject(env, object) { 
  4.           // 注册到 HTTP_Parser 的回调 
  5.           parser_callback callback = { 
  6.               this, 
  7.               ..., 
  8.               ..., 
  9.               [](on_body_complete_info info, parser_callback callback) { 
  10.                   Parser * parser = (Parser *)callback.data; 
  11.                   Local<Value> cb; 
  12.                   Local<Context> context = parser->env()->GetContext(); 
  13.                   Isolate * isolate = parser->env()->GetIsolate(); 
  14.                   Local <String> key = newStringToLcal(isolate, "onBodyComplete"); 
  15.                   parser->object()->Get(context, key).ToLocal(&cb); 
  16.                   // 回调 JS 层 
  17.                   if (!cb.IsEmpty() && cb->IsFunction()) { 
  18.                       Local<Value> argv[] = { 
  19.                           newStringToLcal(isolate, info.body.c_str()) 
  20.                       }; 
  21.                       cb.As<v8::Function>()->Call(context, parser->object(), 1, argv);   
  22.                   } 
  23.               }, 
  24.           }; 
  25.           httpparser = new HTTP_Parser(HTTP_REQUEST, callback); 
  26.       } 
  27.       void Parse(const char * data, size_t len);  
  28.       static void Parse(const FunctionCallbackInfo<Value>& args);  
  29.       static void New(const FunctionCallbackInfo<Value>& args);  
  30.   private: 
  31.       HTTP_Parser * httpparser; 
  32. }; 

C++ 模块到定义非常简单,只是对 HTTP_Parser 的封装,然后通过 V8 导出能力到 JS 层。

  1. void No::HTTP::Init(Isolate* isolate, Local<Object> target) { 
  2.     Local<FunctionTemplate> parser = FunctionTemplate::New(isolate, No::HTTP::Parser::New); 
  3.     parser->InstanceTemplate()->SetInternalFieldCount(1); 
  4.     parser->SetClassName(newStringToLcal(isolate, "HTTPParser")); 
  5.     parser->PrototypeTemplate()->Set(newStringToLcal(isolate, "parse"), FunctionTemplate::New(isolate, No::HTTP::Parser::Parse)); 
  6.     setObjectValue(isolate, target, "HTTPParser", parser->GetFunction(isolate->GetCurrentContext()).ToLocalChecked()); 

我们看到 C++ 模块导出了 HTTPParser 到 JS 层,并提供一个 parse方法。JS 层拿到 TCP 层的数据后,通过执行 parse 进行 HTTP 协议的解析,我们看看 parse 对应函数 No::HTTP::Parser::Parse 的实现。

  1. void No::HTTP::Parser::Parse(const FunctionCallbackInfo<Value>& args) { 
  2.     Parser * parser = (Parser *)unwrap(args.This()); 
  3.     Local<ArrayBuffer> arrayBuffer = args[0].As<ArrayBuffer>(); 
  4.     std::shared_ptr<BackingStore> backing = arrayBuffer->GetBackingStore(); 
  5.     const char * data = (const char * )backing->Data(); 
  6.     parser->Parse(data, strlen(data)); 

Parse首先通过 args 拿到 C++ 的对象 Parser(熟悉 Node.js 的同学应该很容易明白这个处理方式)。接着调用 HTTP_Parser 的 parse 方法,在解析的过程中,llhttp 就会执行 HTTP_Parser 的回调, HTTP_Parser 就会执行 Parser 对象的回调,Parser 就会执行 JS 回调。比如解析完 body 后执行 JS 层回调。

  1. [](on_body_complete_info info, parser_callback callback) { 
  2.     Parser * parser = (Parser *)callback.data; 
  3.     Local<Value> cb; 
  4.     Local<Context> context = parser->env()->GetContext(); 
  5.     Isolate * isolate = parser->env()->GetIsolate(); 
  6.     Local <String> key = newStringToLcal(isolate, "onBodyComplete"); 
  7.     parser->object()->Get(context, key).ToLocal(&cb); 
  8.     if (!cb.IsEmpty() && cb->IsFunction()) { 
  9.         Local<Value> argv[] = { 
  10.             newStringToLcal(isolate, info.body.c_str()) 
  11.         }; 
  12.         cb.As<v8::Function>()->Call(context, parser->object(), 1, argv);   
  13.     } 
  14. }, 

就是找到 JS 设置的 onBodyComplete 函数并执行。结构如下。

3 JS 层

完成了底层的封装和能力导出,接下来就是 JS 层的实现,首先看看 一个使用例子。

  1. const { 
  2.     console,} = No;const { http } = No.libs; 
  3.  
  4. http.createServer({host: '127.0.0.1', port: 8888}, (req, res) => { 
  5.     console.log(JSON.stringify(req.headers)); 
  6.     req.on('data', (buffer) => { 
  7.         console.log(buffer); 
  8.     }); 
  9. }); 

和 Node.js 很相似,接下来看看具体实现。先看 TCP 层的封装。

  1. class Server extends events { 
  2.     fd = -1; 
  3.     connections = 0; 
  4.     constructor(options = {}) { 
  5.         super(); 
  6.         const fd = tcp.socket(constant.domain.AF_INET, constant.type.SOCK_STREAM); 
  7.         this.fd = fd; 
  8.         tcp.bind(fd, options.host, options.port); 
  9.         tcp.listen(fd, 512, (clientFd) => { 
  10.             this.connections++; 
  11.             const serverSocket = new ServerSocket({fd: clientFd}); 
  12.             this.emit('connection', serverSocket); 
  13.         }); 
  14.     } 

createServer 的时候会监听传入的地址,从而启动一个服务器,listen 回调执行说明有连接到来,我们新建一个 ServerSocket 对象表示和客户端通信的 Socket。并触发 connection 事件到上层。接着看 ServerSocket 的实现

  1. class ServerSocket extends Socket { 
  2.     constructor(options = {}) { 
  3.         super(options); 
  4.         this.fd = options.fd; 
  5.         this.read(); 
  6.     } 
  7.     read() { 
  8.         const buffer = new ArrayBuffer(1024); 
  9.         tcp.read(this.fd, buffer, 0, (status) => { 
  10.             this.emit('data', buffer); 
  11.             this.read(); 
  12.         }) 
  13.     } 

ServerSocket 的实现目前很简单,主要是读取数据并触发 data 事件,因为 TCP 只是负责数据传输,不负责数据解析。有了这个能力后,我们看看 http 层的实现。

  1. function createServer(...arg) { 
  2.     return new Server(...arg);} 
  3.  
  4. class Server extends No.libs.tcp.Server { 
  5.     constructor(options = {}, cb) { 
  6.         super(options); 
  7.         this.options = options; 
  8.         if (typeof cb === 'function') { 
  9.             this.on('request', cb); 
  10.         } 
  11.         this.on('connection', (socket) => { 
  12.             new HTTPRequest({socket, server: this}); 
  13.         }); 
  14.     } 

http 模块继承于 tcp 模块,所以我们调用 http.createServer 的时候,会先执行 tcp 模块启动一个服务器,http 层监听 connection 事件等待连接到来,有连接到来时,http 创建一个 HTTPRequest 对象表示 http 请求。

  1. class HTTPRequest extends No.libs.events { 
  2.     socket = null
  3.     httpparser = null
  4.     constructor({socket, server}) { 
  5.         super(); 
  6.         this.server = server; 
  7.         this.socket = socket; 
  8.         this.httpparser = new HTTPParser(); 
  9.         this.httpparser.onHeaderComplete = (data) => { 
  10.             this.major = data.major; 
  11.             this.minor = data.minor; 
  12.             this.keepalive = data.keepalive; 
  13.             this.upgrade = data.upgrade; 
  14.             this.headers = data.headers; 
  15.             this.server.emit('request', this); 
  16.         } 
  17.         this.httpparser.onBody = (data) => { 
  18.             this.emit('data', data); 
  19.         } 
  20.         this.httpparser.onBodyComplete = (data) => { 
  21.             // console.log(data); 
  22.         } 
  23.  
  24.         socket.on('data', (buffer) => { 
  25.             this.httpparser.parse(buffer); 
  26.         }); 
  27.     } 

HTTPRequest 的逻辑如下 1. 保存底层的 socket 2. 新建一个 HTTPParser 解析 HTTP 协议。3. 监听 data 事件,收到 TCP 层数据后调用 HTTP 解析器解析。4. 注册 HTTP 解析的回调钩子,就是前面讲到的。等到解析完 HTTP header 后,也就是执行 onHeaderComplete 回调后,No.js 就会通过触发 request事件 回调业务层,也就是 createServer 传入的回调。业务层可以监听 HTTPRequest 的 data 事件,当 HTTP 请求有 body 数据时,就会注册 HTTPRequest 的 data 事件回调业务层。

4 总结

 

 

 

虽然目前只是粗糙地实现了 HTTP 模块,但实现的过程中,涉及到的内容还是挺多的,后面有时间再慢慢完善。有兴趣的同学可以到 https://github.com/theanarkh/No.js 了解。

 

责任编辑:武晓燕 来源: 编程杂技
相关推荐

2021-09-16 05:32:31

No.js 模块加载器module1.js

2021-07-09 00:24:10

No.jsNode.js原理

2021-09-26 05:06:04

Node.js模块机制

2024-02-29 18:06:39

HTTP性能优化

2023-03-27 08:49:51

2023-06-30 23:25:46

HTTP模块内存

2021-10-03 15:02:50

HTTPNodejs

2022-05-09 08:34:01

FeignhttpJava

2021-10-05 20:12:57

No.jsV8 编码

2022-09-30 00:03:03

JS断点线程

2022-10-08 00:07:00

JSV8调用栈

2020-10-22 10:43:55

HTTP框架AOP

2016-11-28 09:00:10

浏览器浏览器缓存服务端

2021-09-05 17:46:21

云计算No.jsio_uringJS

2022-05-27 07:01:48

JSGIF总帧数

2021-01-27 05:28:38

工具RestSharpHTTP

2022-06-13 07:36:47

useEffectHooks

2024-05-13 08:04:26

Vue.jsWeb应用程序

2024-04-07 08:23:01

JS隔离JavaScript

2022-04-27 09:28:11

HTTPExpires
点赞
收藏

51CTO技术栈公众号