代理json数据的三种方法

mock数据的方式有许多中这里介绍三种我自己常用的方式，其中方法一和方法二代理的接口电脑和手机浏览器可以访问，但是但是类似于rn这种项目是无法访问到。所以需要方法三进行代理接口。

方法一：charles代理接口

首先打开charles的Tools的Map Local Settings
在这里插入图片描述
点击添加

在local path中添加需要代理的数据
点击确定即可

方法二：json-server模拟服务器接口

安装json-server

$ npm install -g json-server

启动服务（在需要mock数据的目录下）：

$ json-server --watch data.json --port 9000 --host 123.57.64.123

注：–watch：是否启动监听（默认启动，布尔值）

–static：指定静态文件路径（用于配置web服务器，一般不指定，web服务器使用nginx搭建）

–port：指定访问端口号（默认3000）

–host：指定访问ip地址（默认localhost）

如果需要代理的数据比较多可以建立一个routes文件来进行代理

//mock/route.json
{
  "/api/study": "/study",
  "/api/maylike":"/maylike",
}

//mock/mock.josn
const study=require('./study.json')
const maylike=require('./maylike.json')
module.exports = function() {
  return {
    study,
    maylike,
  }
}

$ json-server ./mock/mock.js --routes ./mock/route.json --watch --port 9000 --host 123.57.64.123

方法三：使用express在服务器上部署静态JSON文件的线上接口

在进行前端调试的时候常常出现需要mock数据的时候，但是开发手机应用的时候使用charles或者json-server模拟的接口都无法使用，这是最好是自己在服务器上搭建一个接口。

步骤一：前期准备工作

首先需要有一个服务器，服务器上必须安装nodejs

$ npx express -e 项目名称

其他方式

$ npm i express-generator -g
$ cnpm i express-generator -g
$ yarn add express-generator global

创建完成文件夹会有以下文件：

bin ( www 启动了一个静态服务器（ web服务器 ）)
node_modules 真个项目的依赖包
public 静态资源文件
routes 路由文件夹
view（xxx.ejs 项目的模板）
app.js 整个项目的入口文件
package.json 整个项目的依赖配置文件

把需要的json文件放在pubilc文件夹下

在package.json进行下列修改

 "scripts": {
  	"start": "nodemon ./bin/www"
 }

在app.js文件中编写代码

//app.js
var mockRouter = require('./routes/mock');
app.use('/mock',mockRouter)

在routes文件夹下新建mock.js文件

//routes/mock.js
var express = require('express');
var router = express.Router();

const fs = require('fs')
const path = require('path')

const GetData = (url)=>(req, res, next) => {
  res.set('Content-Type', 'application/json;charset=utf-8');
  let data = fs.readFileSync(path.resolve(__dirname, url))
  List = JSON.stringify(data.toString())
  let result = JSON.parse(List)
  res.send(result)
}

router.get('/study', GetData('../public/mock/study.json'));
router.get('/maylike', GetData('../public/mock/maylike.json'));

module.exports = router;