阅读 2611

Deno上手教程,做一个简单的聊天服务

Deno1.0

他来了来了,他带着成吨的知识走来了

Deno

Deno的1.0版本出来以后可以预见一大波的:

  • 学不动了
  • 再不学就被淘汰了
  • Denoxx实现原理
  • PHP最牛逼

......

创造Deno的原因

Deno Ryan Dahl 在2017年创立的。这位巨佬同时也是 Node.js 的创始人,从2007年一直到2012年,他后来把 Node.js 移交给了其他开发者之后,就跑去搞研究人工智能了。但是相传他不是很喜欢 Python,所以时间久了就想搞一个 JavaScript 的人工智能开发框架。等到他再回过头捡起 Node.js,发现这个项目已经背离了他的初衷,有一些无法忽视的问题。

​ 巨佬的说法是:

But why!? Isn't this exactly what Node does? JavaScript & the web have changed significantly since Node was designed in 2009:

  • Promises. async functions

Async iterators/generatos

  • ES Modules

  • Typed Arrays Node has problems:

  • Problems with its module system. with centralized distribution

  • Lots of legacy APIs that must be supported

  • No security model

  • An explosion of tooling (grunt, gulp, webpack, babel, parcel, typescript, is-node, ...)

​ 简单来说ES6 标准引入了大量新的语法特性。其中,影响最大的语法有两个:Promise 接口(以及 async 函数)和 ES 模块。Node.js 对这两个新语法的支持,都不理想。由于历史原因,Node.js 必须支持回调函数(callback),导致异步接口会有 Promise 和回调函数两种写法;同时,Node.js 自己的模块格式 CommonJS ES 模块不兼容,导致迟迟无法完全支持 ES 模块。

​ 其次就是众所周知的npm问题:)npm

​ 再次,Node.js 的功能也不完整,导致外部工具层出不穷,初始化一个项目先来一吨依赖:webpackbabeltypescripteslintprettier......

​ 由于上面这些原因,巨佬决定放弃 Node.js,从头写一个替代品,彻底解决这些问题。deno 这个名字就是来自 Node 的字母重新组合,表示"拆除 Node.js"(de = destroy, no = Node.js)

##### 根据[官网](https://deno.land/)的说明:
复制代码

Deno是使用V8并内置于RustJavaScriptTypeScript的简单,现代且安全的运行时。

  1. 默认为安全。除非明确启用,否则没有文件,网络或环境访问权限。
  2. 开箱即用地支持TypeScript
  3. 仅发送一个可执行文件。
  4. 具有内置的实用程序,例如依赖项检查器(deno info)和代码格式化程序(deno fmt)
  5. 拥有一组保证能与Deno一起使用的经过审查(审核)的标准模块:deno.land/std

安装

DenoNode.js不同的是Deno只有一个可执行文件,所有操作都通过这个文件完成,同时也是跨平台的。所以可以直接在GitHub release上下载对系统的二进制文件或利用官方提供的脚本进行下载安装:

使用 PowerShell:

iwr https://deno.land/x/install/install.ps1 -useb | iex
复制代码

使用 Chocolatey:

choco install deno
复制代码

使用 Scoop:

scoop install deno
复制代码

注意

Deno 具有安全控制,默认情况下脚本不具有读写权限。如果脚本未授权,就读写文件系统或网络,会报错。必须使用参数,显式打开权限才可以。

Deno 只支持 ES 模块,跟浏览器的模块加载规则一致。没有 npm,没有 npm_modules 目录,没有require()命令(即不支持 CommonJS 模块),也不需要package.json文件。

​ 所有模块通过 URL 加载,比如import { bar } from "https://foo.com/bar.ts"(绝对 URL)或import { bar } from './foo/bar.ts'(相对 URL)。因此,Deno 不需要一个中心化的模块储存系统,可以从任何地方加载模块。

​ 但是,Deno 下载模块以后,依然会有一个总的目录,在本地缓存模块,因此可以离线使用。

​ 首先可以尝试官方的Hello world

deno run https://deno.land/std/examples/welcome.ts
复制代码

会输出:Welcome to Deno 🦕

尝试创建一个简单的http server

新建hello world.ts ,写入内容:

import { serve } from "https://deno.land/std@0.50.0/http/server.ts";
const s = serve({ port: 1927 });
console.log("http://localhost:1927/");
for await (const req of s) {
  req.respond({ body: "Hello World\n" });
}
复制代码

如果直接像node一样去执行:

deno run .\welcome.ts
复制代码

那么会得到一个错误:

error: Uncaught PermissionDenied: network access to "0.0.0.0:1927", run again with the --allow-net flag
    at unwrapResponse ($deno$/ops/dispatch_json.ts:43:11)
    at Object.sendSync ($deno$/ops/dispatch_json.ts:72:10)
    at Object.listen ($deno$/ops/net.ts:51:10)
    at listen ($deno$/net.ts:152:22)
    at serve (https://deno.land/std@0.50.0/http/server.ts:261:20)
    at file:jiu bu gei ni kan
复制代码

因为 Deno 的安全限制这里需要加上参数--allow-net允许脚本联网:

deno run --allow-net .\welcome.ts
复制代码

打开http://localhost:1927/你会看到熟悉的Hello World!

利用Deno实现上亿的Ai算法

​ 我知道你进来就是馋我的算法,以后靠这个融到资了别忘了请我喝冰阔落。

  1. 首先新建一个index.html作为展示用

内容:

<dl></dl>
<textarea id="msg" rows="10"></textarea>
<button>发送</button>
复制代码

加上点样式是我对UI最后的倔强:

textarea,
dl {
    width: 300px;
}
dl {
    height: 400px;
    border: 1px solid #000;
    overflow: hidden auto;
}
dd {
    margin-inline-start: 50%;
    background-color: #9eea6a;
    border: 1px solid #9eea6a;
}
dt {
    width: 50%;
    border: 1px solid #e7e7e7;
}
dd,
dt {
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 2px;
    padding: 0 3px;
}
复制代码

实现简单的逻辑:

点击发送与炒鸡AI进行对话

const msgDom = document.querySelector("#msg");
const dl = document.querySelector("dl");
document.querySelector("button").addEventListener("click", () => {
    const { value } = msgDom;
    const dd = document.createElement("dd");
    dd.innerText = value;
    dl.appendChild(dd);
    msgDom.value = "";
    fetch("http://localhost:1927/ask", {
        method: "post",
        headers: {
            "Content-Type": "application/json",
        },
        body: JSON.stringify({ msg: value }),
    })
        .then((res) => res.json())
        .then((data) => {
        const dt = document.createElement("dt");
        dt.innerText = data.msg;
        dl.appendChild(dt);
    });
});
复制代码
  1. 新建server.ts作为后端:

引入serverrouter

import { Application, Router } from "https://deno.land/x/oak/mod.ts";
复制代码

设置编码格式:

const decoder = new TextDecoder("utf-8");
复制代码

读取index.html作为模板:

const body = decoder.decode(await Deno.readFile("./index.html"));
复制代码

在这可以看到Deno异步返回的都是Promise,并且允许在async外使用await

新建服务:

const app = new Application();
const router = new Router();
复制代码

对于不同路由进行处理:

  • 首页直接加载index.html

    router
      .get("/", ({ response }) => {
        response.body = body;
      })
    复制代码
  • 实现价值上亿的自然语言处理:

    post("/ask", async ({ response, request }) => {
        const { value } = await request.body();
        response.body = JSON.stringify({
            msg: value.msg.replace(/(吗|我|?|\?)/gi, (str: string) => {
                if (/(吗|么)/.test(str)) {
                    return "";
                } else if (/(?|\?)/.test(str)) {
                    return "!";
                } else if (str === "我") {
                    return "你";
                }
            }),
        });
    });
    复制代码

应用路由并:

app.use(router.routes());
await app.listen(`localhost:1927`);
复制代码

启动脚本:

在这注意,因为用到了读取文件的功能,所以需要显示的指定允许Deno读物文件,添加启动参数--allow-read

# 允许网络以及文件读取权限
deno run --allow-net --allow-read .\server.ts
复制代码

在页面中打开http://localhost:1927/查看效果:

运行效果

个人感受

​ 相对Node.js来讲作为前端使用起来没有太大区别,至于该不该使用Ryan Dahl 已经把主要的优缺点都讲了。其实最主要的问题就是生态可不可以建立起来,如果社区的生态建立出来了到时候不用也得用了。

社区

Deno本身是Ryan Dahl 想替代Python而制作的,希望JavaScript可以蚕食PythonAI的份额,切图仔摇身一变变成调参仔,想到自己以后有可能成为一名 人工智能开发工程师 真是吹牛逼都有劲了:)。

原文链接

文章分类
前端
文章标签