当前位置: 首页 > 工具软件 > let-us-koa > 使用案例 >

koa express_Koa简介-Express的未来

田兴旺
2023-12-01

koa express

Express is one of the most popular Node.js frameworks out there. With about about 4+ million weekly downloads, Express has clearly made its mark in the world of Node.js and JavaScript.

Express是目前最流行的Node.js框架之一。 Express每周大约下载4+百万次,在Node.js和JavaScript的世界中赢得了明显的成功。

Koa is a newly popular web framework created by the team behind Express. It aims to be a modern and more minimalist version of Express. Some of its popular characteristics are its support and reliance on new JavaScript features such as generators and async/await. Koa also does not ship with any middleware though it can easily be extended using custom and existing plugins.

Koa是Express背后的团队创建的一种新流行的Web框架。 它旨在成为Express的现代且更加简约的版本。 它的一些流行特征是它对JavaScript的新功能(例如generatorsasync / await)的支持和依赖。 Koa也没有附带任何中间件,尽管可以使用自定义插件和现有插件轻松对其进行扩展。

In this article, we will examine the Koa framework and build a simple app to get familiar with its functionality and philosophy.

在本文中,我们将研究Koa框架并构建一个简单的应用程序以熟悉其功能和理念。

要求 ( Requirements )

To follow along with this tutorial, you would need the following installed:

要继续学习本教程,您需要安装以下软件:

You also need to have a working knowledge of JavaScript and ES6 syntax.

您还需要掌握JavaScript和ES6语法的使用知识。

设置和配置 ( Setup and Configuration )

Let us get started by setting up our project. First, we will create a new directory for our project. This can be done by copying and running the command below in you terminal:

让我们开始设置我们的项目。 首先,我们将为我们的项目创建一个新目录。 这可以通过在您的终端中复制并运行以下命令来完成:

$mkdir koala

⚠️ Note: You can give your project any name, but in this article we'll be using koala as our project name and directory.

Note️ 注意:您可以给您的项目起任何名字,但是在本文中,我们将使用koala作为我们的项目名和目录。

At this point, we have created our project directory koala. Next, we will initialise our node project from inside the directory. You can do so by running the commands below:

至此,我们已经创建了项目目录koala 。 接下来,我们将从目录内部初始化节点项目。 您可以通过运行以下命令来这样做:

$cd koala
$ npm init koala 

After running the npm init command, follow the prompts and fill in the details of your project. At the end of this, you will have a package.json file with the information you enetered while prompted.

运行npm init命令后,按照提示进行操作并填写项目的详细信息。 最后,您将得到一个package.json文件,其中包含在提示时输入的信息。

? Tip: You can run npm init -y to create a package.json file with default values.

提示:您可以运行npm init -y创建具有默认值的package.json文件。

Next, we will run this command to install Koa:

接下来,我们将运行以下命令来安装Koa:

$npm install koa --save

? Tip: Depending on the version of Node you have running you may not need to add the --save flag. This flag tells older versions of Node to add the installed library (in this case Koa) to the dependencies list in our package.json file. On newer Node versions, you can simply run npm i koa to install Koa.

提示 :根据您所运行的Node的版本,可能不需要添加--save标志。 此标志告诉Node的旧版本将已安装的库(在本例中为Koa)添加到package.json文件中的依赖项列表中。 在较新的Node版本上,您只需运行npm i koa即可安装Koa。

建立我们的应用程序 ( Building Out Our App )

创建Koa服务器 (Creating a Koa Server)

During the initialisation of our project, we were prompted to enter the entry point of our application. In this article, we will use index.js which was the default value as our entry point.

在项目初始化期间,系统提示我们输入应用程序的入口点。 在本文中,我们将使用index.js作为默认值作为入口点。

First, we will create the index.js file, this can be done in several ways. For MacOS and Linux users, this can be done by running the below command in your terminal:

首先,我们将创建index.js文件,这可以通过多种方式完成。 对于MacOS和Linux用户,这可以通过在终端中运行以下命令来完成:

$touch index.js

Using your code/text editor of choice, we will open our project and copy the below snippet into the index.js file:

使用您选择的代码/文本编辑器,我们将打开我们的项目,并将以下代码段复制到index.js文件中:

// index.js

'use strict';

const koa = require('koa')
const app = new koa()

app.use(function *(){
  this.body = "Hello World !!!";
});

app.listen(1234)

In the snippet above, we have created a koa application that runs on port 1234. You can run the application using the command:

在上面的代码段中,我们创建了一个在端口1234上运行的koa应用程序。您可以使用以下命令运行该应用程序:

$ node index.js

And visiting the application on http://localhost:1234.

并访问http:// localhost:1234上的应用程序。

在Koa.js中路由 (Routing In Koa.js)

As mentioned earlier, Koa.js does not ship with any contained middleware and unlike its predecessor, Express, it does not handle routing by default.

如前所述,Koa.js不附带任何包含的中间件,并且不同于其前身Express,它默认情况下不处理路由。

In order to implement routes in our Koa app, we will install a middleware library for routing in Koa, Koa Router. We'll install it by running:

为了在我们的Koa应用程序中实现路由,我们将在Koa Router中安装一个用于在Koa中进行路由的中间件库。 我们将通过运行以下命令进行安装:

$npm install koa-router --save 

To make use of the router in our application, we will amend our index.js file:

为了在我们的应用程序中使用路由器,我们将修改index.js文件:

// index.js

'use strict';
const koa = require('koa')
const koaRouter = require('koa-router')

const app = new koa()
const router = new koaRouter()

router.get('koala', '/', (ctx) => {
  ctx.body = "Welcome! To the Koala Book of Everything!"
})

app.use(router.routes())
  .use(router.allowedMethods())

app.listen(1234, () => console.log('running on port 1234'))

Above, we have defined a route on the base url of our application (http://localhost:1234) and registered this route to our Koa application.

上面,我们在应用程序的基本URL( http:// localhost:1234 )上定义了一条路由,并将此路由注册到了我们的Koa应用程序。

? For more information on route definition in Koa.js applications, visit the Koa Router library documentation here.

? 有关Koa.js应用程序中路由定义的更多信息,请访问此处的Koa Router库文档。

在Koa.js中进行模板 (Templating In Koa.js)

As already established, Koa comes as a very minimalistic framework, therefore, to implement view rendering with a template engine we will have to install a middleware library. There are several libraries to choose from but in this article we will use koa-ejs.

正如已经确立的那样,Koa是一个非常简约的框架,因此,要使用模板引擎实现视图渲染,我们将必须安装中间件库。 有几个库可供选择,但是在本文中,我们将使用koa-ejs

To do so, we will first install the library using:

为此,我们将首先使用以下命令安装该库:

$npm install koa-ejs --save

Next, we will ammend our index.js file to register our templating with the snippet below:

接下来,我们将修改我们的index.js文件,以使用以下代码段注册模板:

// index.js

'use strict';
const koa = require('koa')
const path = require('path')
const render = require('koa-ejs')
const koaRouter = require('koa-router')

const app = new koa()
const router = new koaRouter()

render(app, {
  root: path.join(__dirname, 'views'),
  layout: 'layout',
  viewExt: 'html',
  cache: false,
  debug: true
})

router.get('koala', '/', (ctx) => {
  ctx.body = "Welcome! To the Koala Book of Everything!"
})

app.use(router.routes())
  .use(router.allowedMethods())

app.listen(1234, () => console.log('running on port 1234'))

As seen above, in our template registering, we tell our application the root directory of our view files, the extension of the view files and the base view file (which other views extend).

如上所示,在模板注册中,我们告诉应用程序视图文件的根目录,视图文件的扩展名和基本视图文件(其他视图所扩展的内容)。

Now that we have registered our template middleware, we will amend our route definition to render a template file:

现在我们已经注册了模板中间件,我们将修改路由定义以渲染模板文件:

// index.js

...

router.get('koala', '/', (ctx) => {
  let koala_attributes = [];
  koala_attributes.push({
    meta_name: 'Color',
    meta_value: 'Black and white'
  })
  koala_attributes.push({
    meta_name: 'Native Country',
    meta_value: 'Australia'
  })
  koala_attributes.push({
    meta_name: 'Animal Classification',
    meta_value: 'Mammal'
  })
  koala_attributes.push({
    meta_name: 'Life Span',
    meta_value: '13 - 18 years'
  })
  koala_attributes.push({
    meta_name: 'Are they bears?',
    meta_value: 'no!'
  })
  return ctx.render('index', {
    attributes: koala_attributes
  })
})

...

Above, our base route renders the index.html file found in the views directory. Our index.html file contains some basic HTML to display our koala attributes. See below:

在上方,我们的基本路线将呈现在views目录中找到的index.html文件。 我们的index.html文件包含一些基本HTML来显示我们的考拉属性。 见下文:

<!-- views/index.html -->

<h2>Koala - a directory Koala of attributes</h2>
<ul class="list-group">
  <% attributes.forEach( function(attribute) { %>
    <li class="list-group-item">
      <%= attribute.meta_name %> - <%= attribute.meta_value %>
    </li>
  <% }); %>
</ul>

? Tip: For more options with using the koa-ejs template middleware, view the library documentation here.

提示:有关使用koa-ejs模板中间件的更多选项,请在此处查看库文档。

处理错误和响应 ( Handling Errors and Responses )

错误处理 (Error Handling)

Koa handles errors by defining an error middleware early in our entrypoint file. The error middleware must be defined early because only errors from middleware defined after the error middleware will be caught. Using our index.js file as an example, we'll adjust it to include:

Koa通过在入口点文件中尽早定义错误中间件来处理错误。 错误中间件必须尽早定义,因为只会捕获在错误中间件之后定义的中间件中的错误。 以我们的index.js文件为例,我们将其调整为包括:

// index.js

'use strict';
const koa = require('koa')
const render = require('koa-ejs')
const koaRouter = require('koa-router')

const app = new koa()
const router = new koaRouter()

app.use( async (ctx, next) => {
  try {
    await next()
  } catch(err) {
    console.log(err.status)
    ctx.status = err.status || 500;
    ctx.body = err.message;
  }
})

...

The above block catches any error thrown during the execution of our application. We'll test this by throwing an error in the function body of the route we defined:

上面的块捕获了在执行应用程序期间抛出的所有错误。 我们将通过在定义的路由的函数主体中抛出错误来进行测试:

// index.js

...

router.get('koala', '/', (ctx) => {
  ctx.throw('Test Error Message', 500)
}) 
...

处理回应 (Handling Responses)

The Koa response object is usually embedded in its context object. Using our route definition, we will show an example of setting responses:

Koa响应对象通常嵌入其上下文对象中。 使用路由定义,我们将显示一个设置响应的示例:

// index.js

'use strict';
const koa = require('koa')
const koaRouter = require('koa-router')

const app = new koa()
const router = new koaRouter()

app.use( async (ctx, next) => {
  try {
    await next()
  } catch(err) {
    console.log(err.status)
    ctx.status = err.status || 500;
    ctx.body = err.message;
  }
})

router.get('koala', '/', (ctx) => {
  ctx.status = 200
  ctx.body   = "Well this is the response body"
})

结论 ( Conclusion )

In this article, we had a brief introduction to Koa and how to implement some common functionalities in a Koa project. Koa is a minimalist and designed-to-be-flexible framework that can be extended to more functionality than this article has shown. Because of its futuristic approach and similarity to Express, some have even described it as Express 5.0 in spirit.

在本文中,我们简要介绍了Koa以及如何在Koa项目中实现一些常用功能。 Koa是一个极简主义和灵活设计框架,可以扩展到比本文所示更多的功能。 由于它的未来方法和与Express的相似性,有人甚至在本质上将其描述为Express 5.0。

The entire code from this article is available on Github, and the repository contains some additional concepts not treated here, as they are beyond the scope of the intro. We'd love to hear about what you've done with Koa.js. Please share in the comments below!

Github上提供了本文的全部代码,并且该存储库包含一些此处未介绍的其他概念,因为它们不在本介绍的范围之内。 我们很想听听您对Koa.js所做的事情。 请在下面的评论中分享!

翻译自: https://scotch.io/tutorials/introduction-to-koa-the-future-of-express

koa express

 类似资料: