# 如何为 Matataki 开发一个第三方 Fan票 空投应用？

前段时间，Matataki 开放了自己的 [API 文档](https://docs.matataki.io/)，虽然这份文档看起来还很不完善[^1]，不过不妨害先实现一些 [简单的应用场景](https://www.matataki.io/p/4292)。根据 Joel Monegro 的理论：Information Capital is more valuable when distributed[^2]，不妨我们先实现空投。

通过本文，你可以了解到：

- Matataki API 简介
- 基于 React 开发 Dapp 的前端
- 基于 Nest.js 开发 Dapp 的后端

目前的前端 👉 [GitHub Repo](https://github.com/NaoMikuOshi/Matataki-Token-AirDropper) 和后端 👉 [GitHub Repo](https)

Demo：
- 生产版 https://matataki-airdrop.netlify.app/
- 测试版（基于 Matataki 测试版） https://matataki-airdrop-testing.netlify.app/

[^1]: > ⚠️警告⚠️
> 与其他成熟的平台不同，你通过 API 获取的用户 `accessToken` 目前是和 Matataki.io 上的用户服务令牌是一样的。获取到用户 `accessToken` 即意味着你是在以用户本人的名义作出 API 操作！
> 个人看法是，Matataki 如果真的要做 Dapp，OAuth 和权限控制是必须要做的
> [OAuth in one picture](https://twitter.com/kamranahmedse/status/1276994010423361540)
> [name=NaoMiku]

[^2]: [WTF is Capital: How to Fix Capitalism, Joel Monegro](https://github.com/carboclan/pm/blob/master/notes/MacroWTF_Archive.md)

# 目录

[toc]

# Step 1 查阅文档

这些 API 是 Matataki 官方给第三方开发者开放的，你可以通过 API 进行 Fan票的操作（查询、转账等），作为一个需要用户使用的 Dapp，你需要有用户的 `accessToken`。目前 Matataki 给第三方 App 提供的只有通过邮箱、密码登录来获得 `accessToken`。

# Step 2 前端 Connect to Matataki

以前端常用的请求库 axios 配合 React 为例，来举例：

{%gist NaoMikuOshi/9ce6febc5a7fe4a1fc4f4e17a81ac2d1%}

然后你就可以利用这个 `client` 去写函数了,以和用户模组为例

{%gist NaoMikuOshi/90d0c8777dddfb62dfdf3f9a4ce7e5be%}

# Step 3 建设一个后端（可选）
> 这里加可选的话，更像是一个 general 的 dapp 开发指南。这篇我们只要介绍 airdroper 本身感觉就好。
> [name=xiaodao]

如果你要做一些更高级的功能，可能 Matataki 现有的 API 不能满足仅在前端开发的需求。这时候就需要你自己去搭建一个后端。这里以 Nest.js + TypeScript 为例。

## Setup Nest
使用 Nest CLI 创建 Nest 项目非常简单. 只需要有 npm 就可以执行以下命令:

npm i -g @nestjs/cli
nest new project-name

后续就是配置你的后端了，这里不再过多赘述，详细可以查阅 [Nest 的文档(英文)](https://docs.nestjs.com/first-steps) 或 [Nest 的文档(中文)](https://docs.nestjs.cn/7/firststeps) 。

## 设置一个中间账户

我们 AirDropper 是一个代币空投的工具，如果使用用户的账户来进行操作存在安全风险。所以我们还得去 Matataki 注册一个账户，给我们的后端使用。

在项目保存私密数据的最佳实践是你把敏感的内容放进环境变量里。node 一般都使用 `dotenv` 作为文件 =输入=> 环境变量的最佳工具。

# 空投中转账号
TEMP_ACCOUNT=[e-mail]
TEMP_PASSWORD=foooobbbbbaaaarrrrr
TEMP_UID=114514

这样我们的后端可以从 `process.env.[环境变量]` 来读取到敏感的数据。

## 创建Airdrop 的实现

{%gist NaoMikuOshi/38efc2ce7cda7a3a8a5c97ac40d7f16a %}

首先用用户的 `accessToken` 来转账到我们的临时账户，然后再去 DB 创建对象。

{%gist NaoMikuOshi/e1173e93f53fc3f30baec95ba5ca536b %}

# Step 4 空投的扩展 —— 手气红包

> // @todo, 争取先让后端也 deploy 上公网，后续再做这个
> [name=NaoMiku]

# 致谢

感谢Matataki 团队的 小岛、@zxplus @Neko 和 @Frank 对AirDrop项目的支持