如今市面上有很多为 Node.js 开发的 Web 服务器，很难说哪个更好。工程师们正努力为他们的产品添加新功能，并利用最新的 JS 和 V8 引擎特性，打造更快、更便捷、更高效的解决方案。我也是其中之一，我开发的是Plant。在本文中，我将介绍 Plant 如何在不依赖 Node.js 的情况下运行。
Plant 是一个基于 WebAPI 的 Web 服务器，这意味着它使用与浏览器相同的接口。此外，它与传输协议无关，您可以使用任何协议发送请求：TCP、WebSocket、WebRTC 等。综上所述，它可以在浏览器和服务器上以相同的方式运行。这种能力能给我们带来什么呢？
好，我们开始吧。你只需要创建一个空白页面的简单HTML文件即可。
<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>
要在您的网页中使用 Plant，只需从 unpkg.com 导入即可：
<script src="https://unpkg.com/@plant/plant@2.4.0/dist/plant.js"></script>
将其放入<head>。然后为我们的应用程序创建一个新的<script>元素<body>。
服务器创建与 Express 或 Koa 的服务器创建类似，只有一些细微差别。
// Instantiate server
const plant = new Plant()
// Add handler
plant.use('/index.html', ({req, res}) => {
res.html('<!DOCTYPE html><html><body>Hello</body></html>')
})
就这样。我们创建了一个非常简单的请求处理程序，用于提供 '/index.html' 页面。请注意，路由规则非常严格。它会处理某些请求，/index.html但不会处理其他请求/。
浏览器无法监听请求，我们将自行模拟。这段代码可以用于处理通过 WebSocket 或任何其他传输方式发送的请求，因此任何程序都可以使用它。
这是我们的最终代码，稍后会进行解释：
const handle = plant.getHandler()
const context = createContext('GET', 'https://localhost:8000/index.html')
handle(context)
.then(({res}) => {
res.status // -> 200
res.body // -> '<!DOCTYPE html>...
})
socketPlant context 是一个简单的对象实例。它需要分别将 Socket、Request 和 Response 实例作为req属性传递res。
function createContext(method, url, {headers = {}, body} = {}) {
const req = new Plant.Request({
url: new URL(url),
method,
body,
headers,
})
const res = new Plant.Response({
url: new URL(url),
})
const socket = new Plant.Socket({
peer: new Plant.Peer({
uri: new Plant.URI({
protocol: 'browser',
host: navigator.appName,
})
})
})
return {req, res, socket}
}
套接字需要一个对等实例，它代表连接的另一方。对等实例必须始终提供一个以 URI 形式提供的地址。这里使用 URI 而不是标准 URL，是因为 URL 无法处理自定义协议。之所以需要这样做，是因为我们认为对等实例也可以接收连接，因为 Plant 可以使用支持此功能的传输方式。
为了模拟 POST 请求，我们需要创建一个ReadableStream实例并将其传递给 Request 构造函数。
const body = streamFrom('Hello')
new Request({
method: 'GET',
url: 'https://localhost:8000',
body,
})
function streamFrom(value) {
return new ReadableStream({
start(controller) {
// Encode UTF8 into Uint8Array and push it into the stream
const encoder = new TextEncoder()
controller.enqueue(encoder.encode(value))
controller.close()
},
})
}
该函数createStream创建一个 ReadableStream 实例，并将传递的整个值作为一个整体写入其中。
现在，您可以完全在浏览器中自行完成所有操作并模拟请求，而无需使用 Node.js。或者，您也可以在浏览器中编写和调试 API，然后只需进行少量更改即可将其迁移到 Node.js。而且，相同的代码也可以用于测试。
如果遇到困难或想自行检验，请使用简单示例或更复杂的演示。
Plant 是一个基于 WebAPI 标准的 HTTP/2 Web 服务器，采用模块化架构和功能性设计。此外，它还具有纯净性和低耦合性。
Plant 支持 HTTP 1 和 HTTP 2 协议。但它与传输方式无关，可以直接在浏览器中通过 WebSocket、WebRTC 或 PostMessage 运行。
Hello world，使用 HTTP2 作为传输协议。
⚠️ 请注意，默认的 CSP 标头值为default-src localhost; form-action localhost“这将……”
rumkin / plant-browser-demo这是一个单文件演示型 Web 应用程序。其目的是展示如何仅使用浏览器和代码编辑器，在不使用 Node.js 的情况下，开发一个功能齐全且具有测试覆盖率的 Web 服务器。
#Server和#Spec脚本代码。示例代码被组织成多个脚本。每个脚本包含与特定任务相关的代码。
<script id="Server"></script>
<script id="Spec"></script>
<script id="TestupHelpers"></script>
<script id="PlantHelpers"></script>
<script id="Main"></script>
在哪里：
#Server您的HTTP API代码。#Spec你的测试是……