API 正变得越发的标准化，因此，Mirage 引入了 路由缩写 shoorthands 的概念来替代许多自定义路由处理器的编写，从而可以更轻松的编写，也极大地简化了路由处理器的定义。

例如，这个非常标准的函数式路由，它将返回一个与路径同名的数据集合：

1
2
3

this.get('/movies', (schema, request) => {
  return schema.movies.all()
})

同时，也可以使用路由缩写来完成相同的工作：

1

this.get('/movies')

这是一个完整的路由。它能从路径的最后一部分推断模型名称，并返回同名的数据集合。

如果通过查询 ID 得到单条数据，也是非常简单的：

1

this.get('/movies/:id')

使用路由缩写同样可以完成新建或者编辑数据。这也是一个标准的路由，它使用请求体中的一个属性 movie 来创建一条新的数据：

1
2
3
4
5

this.post('/movies', (schema, request) => {
  let attrs = JSON.parse(request.requestBody).movie

  return schema.movies.create(attrs)
})

同样的工作也可以使用缩写来完成：

1

this.post('/movies')

路由缩写使用基于 HTTP 动词的默认状态码:

• GET, PATCH/PUT, DEL 200
• POST 201

阅读更多

路由处理器（Route handlers）

前一章节已经快速了解过路由处理器的工作模式，这一节着重了解路由处理器中一些参数的意义。先从路由的两个定义方法开始。

路由处理器的定义（Define route handlers）

最简单的方法是直接在路由的第二个参数返回一个对象作为响应的数据，为了便于记忆，可以称之为对象式：

1

this.get("/movies", { movies: ["Interstellar", "Inception", "Dunkirk"] })

接下来是平时比较常用的函数式路由：

1
2
3

this.get("/movies", (schema, request) => {
  return ["Interstellar", "Inception", "Dunkirk"]
})

函数式路由可以灵活方便的访问 Mirage 的数据层和请求对象。大多数时候都使用函数式路由。

你可以使用任何 HTTP 动词来定义路由，它们的定义方法都是一样的，第一个参数表示 API URL，第二个参数通常是一个用来返回响应数据的函数。

1
2
3
4
5
6
7

// this.[HTTP verbs].(API_URL, () => {})
this.get('/movies', () => { ... });
this.post('/movies', () => { ... });
this.patch('/movies/:id', () => { ... });
this.put('/movies/:id', () => { ... });
this.del('/movies/:id', () => { ... });
this.options('/movies', () => { ... });

阅读更多

最近在项目中使用了 Mirage ,看着官方文档，做了一些笔记。文中的内容都来自于官方文档，包括例子，并没有完整翻译官方文档，结合自己的使用体会做了增删，就是翻译了又没完全翻译。

简介

Mirage 是一个让前端开发人员模拟后端 API 的 JavaScript 库。用人话说就是：Mirage 是一个 Mock 服务器。

Mirage 在浏览器中运行。它能拦截 Javascript 应用程序发出的任何 XMLHttpRequest 或 fetch 请求，并允许模拟这些请求所对应的响应结果。

Mirage 除了拦截 HTTP 请求外，还提供了一个模拟数据库和一系列辅助函数，可以轻松模拟后端服务。

Mirage 借鉴了典型的 API 服务端框架的概念，拥有例如：

• 处理 HTTP 请求的路由（routes）
• 数据库（database）和数据模型（models），用于存储数据和定义数据之间的关系
• factories(模型工厂) and fixtures for stubbing data(数据填充)
• 用于格式化 HTTP 响应的序列化函数（serializers）

安装

Mirage 很容易可以集成到现有项目中。

1
2
3

npm install --save-dev miragejs
# or
yarn add --dev miragejs

概览

Mirage 可以通过 路由处理器（route handlers）轻易的模拟一个 API 请求的响应结果。

阅读更多

最近因为沉迷游戏，长期在游戏本上出生入死，手里那台用来聊天的 Mac 就晾在边上好久没掀开过了。想着手里几个小项目换电脑搞来搞去也挺麻烦的，所以决定在 windows 本上还原一下在 Mac 上的工作环境。

在 Mac 上或者远程服务器上，我们的开发、部署环境基本都是类 Unix 的，所以接下来我们需要把 WSL2 安装上，并且给系统安装一个不太拉胯的终端，以及配置 wsl 中系统的使用环境。

选择在 wsl 中开发，还有一个重要的原因，就是 windows 和 Unix 的换行符是不一样的，可能会带来一些编码方面的问题，比如 git 冲突。

安装 WSL

微软把 WSL 叫做 适用于 Linux 的 Windows 子系统 ，我们只要知道这是一个跨操作系统的 linux 环境就好了，详细的说法还是看 wsl 的文档。从 windows 10 开始，系统提供了 WSL 集成，发展到现在的 windows 版本，已经有了 WSL 2 ，推荐升级到 WSL 2，现在能与系统更好的结合工作并且提供了完整的 Linux 内核，docker desktop 现在也与 WSL2 高度适配。

安装 WSL 2 需要满足 windows 10 的系统版本要求，X64 系统需要版本 1903 或更高版本，采用 内部版本 18362.1049 或更高版本。

为了避免一些麻烦，以下命令均在管理员身份的 PowerShell 中运行。

阅读更多