Table of Contents
Middleware
Error Handling
Koa Instance
Context
Request
Response
Home Web Front-end HTML Tutorial Koa2_html/css_WEB-ITnose

Koa2_html/css_WEB-ITnose

Jun 21, 2016 am 08:49 AM
koa2

Koa 给自己的定位是 HTTP 中间件框架(middleware framework),专注于提供与创建 HTTP 服务器有关的通用方法和属性,本身不捆绑任何中间件,由开源社区根据实际需求开发具体的中间件。

Koa 使用 app.use()方法注册中间件,并按照注入顺序将其添加到 middleware 数组,这些中间件常用于对 HTTP 请求进行加工处理,比如生成缓存、指定代理以及重定向等。

const Koa = require('koa');const app = new Koa();// responseapp.use(ctx => {    ctx.body = 'Hello Koa';});app.listen(3000)
Copy after login

Middleware

Koa2 支持以下三种中间件函数:

// common function app.use((ctx, next) => {    const start = new Date();    return next().then(() => {        const ms = new Date() - start;        console.log(`${ctx.method} ${ctx.url} - ${ms}ms`);    });});// async functionapp.use(async (ctx, next) => {    const start = new Date();    await next();    const ms = new Date() - start;    console.log(`${ctx.method} ${ctx.url} - ${ms}ms`);});// generator function.use(co.wrap(function *(ctx, next) {    const start = new Date();    yield next();    const ms = new Date() - start;    console.log(`${ctx.method} ${ctx.url} - ${ms}ms`);}));
Copy after login

由于 Node.js 尚未支持 async 函数,所以需要使用 Babel 预编译 JS 文件,我的做法是安装依赖 babel-core babel-polyfill babel-preset-es2015 babel-preset-stage-0,然后在真实的入口文件(比如 index.js)前设置一个加载 Babel 的伪入口文件(比如 index.babel.js),将来 Node.js 支持 Async 后删除该文件即可:

require("babel-core/register")({    "presets": [        "es2015",        "stage-0"    ]});require("babel-polyfill");require('./index.js');
Copy after login

中间件固定接收 (ctx, next)两个参数,如果要传入其他参数,可以对中间件重新打包:

function logger(format) {    format = format || ':method ":url"';    return async function (ctx, next) {        const str = format            .replace(':method', ctx.method)            .replace(':url', ctx.url);        console.log(str);        await next();    };}app.use(logger());app.use(logger(':method :url'));
Copy after login

使用中间件 koa-compose可以合并多个中间件:

const compose = require('koa-compose');async function random(ctx, next) {    // ...};async function backwards(ctx, next) {    // ...};async function pi(ctx, next) {    // ...};const all = compose([random, backwards, pi]);app.use(all);
Copy after login

Error Handling

Koa 提供了默认的错误处理机制,包括 try-catch和 Error 事件。自定义 try-catch捕获的推荐方式如下所示:

app.use(async (ctx, next) => {    try {        await next();    } catch (err) {        err.status = err.statusCode || err.status || 500;        throw err;    }});
Copy after login

自定义监听 Error 事件:

app.on('error', (err, ctx) {    // ...});
Copy after login

Koa Instance

Koa 的实例 app包含以下属性:

  • app.name,可选,为应用程序指定名称
  • app.env,默认值为 NODE_ENV 或 “development”
  • app.proxy
  • app.subdomainOffset
  • app.context,Koa 推荐使用该命名空间挂载数据

app.context.db = db();
Copy after login

包含以下方法:

  • app.listen(),设置监听端口
  • app.callback()
  • app.use(),注入中间件
  • app.keys=,设置 Signed Cookie 的密钥

Context

每一个请求都有一个 Context对象,该对象又包含 request和 response两个对象:

app.use(async (ctx, next) => {    // Context    ctx;     // Request    ctx.request;     // Response    ctx.response; });
Copy after login

Context 对象包含的属性:

  • ctx.req,Node.js 的 request 对象
  • ctx.res,Node.js 的 response 对象
  • ctx.request,koa 的 request 对象
  • ctx.response,koa 的 response 对象
  • ctx.state,建议将全局状态挂载在该命名空间下
  • ctx.app,对应用实例的引用

Context 对象包含以下方法:

  • ctx.cookies.get(name, [options]),获取 cookies
  • ctx.cookies.set(name, value, [options]),设置 cookies
  • ctx.throw([msg], [status], [properties]),抛出错误

ctx.throw('name required', 400);// 等同于const err = new Error('name required');err.status = 400;throw err;
Copy after login

Request

该对象是对 Node 原生 Request 对象的再封装,包含以下只读属性:

  • request.href
  • request.stale
  • request.fresh,判断内容是否已经更新
  • request.origin
  • request.secure,检查是否是 HTTPS 协议
  • request.charset
  • request.originalUrl
  • request.type,获取 Content-Type
  • request.header,等同于 request.headers
  • request.length,返回请求头信息中 Content-Length的值,如果不存在,则返回 undefined
  • request.host,包含主机名和端口号,如果 app.proxy的值为 true,则支持 X-Forwarded-Host
  • request.protocol,如果 app.proxy的值为 true,则支持 X-Forwarded-Host
  • request.hostanme,如果 app.proxy的值为 true,则支持 X-Forwarded-Host
  • request.ip,如果 app.proxy的值为 true,则支持 X-Forwarded-Host
  • request.ips,仅当 app.proxy为 true 时返回 X-Forwarded-Host列表,否则返回空数组
  • request.subdomains,根据 app.subdomainOffset返回子域名

包含以下可读写属性:

  • request.url
  • request.path
  • request.method
  • request.search
  • request.querystring
  • request.query

包含以下方法:

  • request.is(type...),判断 Content-Type的类型,如果不存在 request.body,返回 undefined;如果没有符合的类型,返回 false;存在符合的类型则返回响应的字符串
  • request.accepts(types)
  • request.acceptsEncodings(types)
  • request.acceptsCharsets(charsets)
  • request.acceptsLanguages(langs)

// With Content-Type: text/html; charset=utf-8ctx.is('html'); // => 'html'ctx.is('text/html'); // => 'text/html'ctx.is('text/*', 'text/html'); // => 'text/html'// When Content-Type is application/jsonctx.is('json', 'urlencoded'); // => 'json'ctx.is('application/json'); // => 'application/json'ctx.is('html', 'application/*'); // => 'application/json'ctx.is('html'); // => false
Copy after login

Response

该对象是对 Node 原生 Response 对象的再封装,包含以下只读属性

  • response.socket
  • response.header,等同于 response.headers
  • response.headerSent,检查响应头是否已发送

包含以下可读写属性:

  • response.stauts
  • response.message
  • response.length
  • response.body
  • response.type
  • response.lastModified
  • response.etag

tx.response.etag = crypto.createHash('md5').update(ctx.body).digest('hex');
Copy after login

包含以下方法:

  • response.get(field)
  • response.set(fields)
  • response.vary(field)
  • response.set(field, value)
  • response.append(field, value)
  • response.remove(field)
  • response.is(types...)
  • response.flushHeaders()
  • response.redirect(url, [alt])
  • response.attachment([filename]),将 Content-Disposition设为 attachment,并通知客户端下载资源
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Is HTML easy to learn for beginners? Is HTML easy to learn for beginners? Apr 07, 2025 am 12:11 AM

HTML is suitable for beginners because it is simple and easy to learn and can quickly see results. 1) The learning curve of HTML is smooth and easy to get started. 2) Just master the basic tags to start creating web pages. 3) High flexibility and can be used in combination with CSS and JavaScript. 4) Rich learning resources and modern tools support the learning process.

The Roles of HTML, CSS, and JavaScript: Core Responsibilities The Roles of HTML, CSS, and JavaScript: Core Responsibilities Apr 08, 2025 pm 07:05 PM

HTML defines the web structure, CSS is responsible for style and layout, and JavaScript gives dynamic interaction. The three perform their duties in web development and jointly build a colorful website.

Understanding HTML, CSS, and JavaScript: A Beginner's Guide Understanding HTML, CSS, and JavaScript: A Beginner's Guide Apr 12, 2025 am 12:02 AM

WebdevelopmentreliesonHTML,CSS,andJavaScript:1)HTMLstructurescontent,2)CSSstylesit,and3)JavaScriptaddsinteractivity,formingthebasisofmodernwebexperiences.

What is an example of a starting tag in HTML? What is an example of a starting tag in HTML? Apr 06, 2025 am 12:04 AM

AnexampleofastartingtaginHTMLis,whichbeginsaparagraph.StartingtagsareessentialinHTMLastheyinitiateelements,definetheirtypes,andarecrucialforstructuringwebpagesandconstructingtheDOM.

Gitee Pages static website deployment failed: How to troubleshoot and resolve single file 404 errors? Gitee Pages static website deployment failed: How to troubleshoot and resolve single file 404 errors? Apr 04, 2025 pm 11:54 PM

GiteePages static website deployment failed: 404 error troubleshooting and resolution when using Gitee...

How to implement adaptive layout of Y-axis position in web annotation? How to implement adaptive layout of Y-axis position in web annotation? Apr 04, 2025 pm 11:30 PM

The Y-axis position adaptive algorithm for web annotation function This article will explore how to implement annotation functions similar to Word documents, especially how to deal with the interval between annotations...

HTML, CSS, and JavaScript: Essential Tools for Web Developers HTML, CSS, and JavaScript: Essential Tools for Web Developers Apr 09, 2025 am 12:12 AM

HTML, CSS and JavaScript are the three pillars of web development. 1. HTML defines the web page structure and uses tags such as, etc. 2. CSS controls the web page style, using selectors and attributes such as color, font-size, etc. 3. JavaScript realizes dynamic effects and interaction, through event monitoring and DOM operations.

How to use CSS3 and JavaScript to achieve the effect of scattering and enlarging the surrounding pictures after clicking? How to use CSS3 and JavaScript to achieve the effect of scattering and enlarging the surrounding pictures after clicking? Apr 05, 2025 am 06:15 AM

To achieve the effect of scattering and enlarging the surrounding images after clicking on the image, many web designs need to achieve an interactive effect: click on a certain image to make the surrounding...

See all articles