json-server使用总结

女爷i 2022-05-28 02:08 165阅读 0赞

作为前端和客户端开发人员，在后端还没有给出对应的api接口时，我们无法做测试。  
这时，我们可以使用json-server快速搭建一个测试的api接口，能在几十秒之内搭建好。

Github地址：[https://github.com/typicode/json-server][https_github.com_typicode_json-server]

--------------------

### 使用前提 ###

*  安装node.js。  
    进入[https://nodejs.org/en/][https_nodejs.org_en]，下载对应的版本安装。  
    然后使用命令node -v 测试安装是否成功。  
    ![这里写图片描述][SouthEast]
 *  安装json-server  
    使用node的npm安装json-server  
    命令：npm install -g json-server
 *  配置  
    新建一个json文件

{
      "posts": [ { "id": 1, "title": "json-server", "author": "typicode" } ],
      "comments": [ { "id": 1, "body": "some comment", "postId": 1 } ],
      "profile": { "name": "typicode" } }
      
       
        1
        2
        3
        4
        5
        6
        7
        8
        9

*  启动json-server  
    进入创建json所在的路径，我在e盘根目录创建的，所以进入e盘。  
    使用命令：json-server –watch json文件名  
    ![这里写图片描述][SouthEast 1]

json-server默认使用的是3000端口，在浏览器中打开[http://localhost:3000/][http_localhost_3000]  
出现以下页面说明访问成功。  
![这里写图片描述][SouthEast 2]

更详细的配置可以阅读json-server的说明文档。

本人在做项目时用的是vue-cli项目需要跨域：解决办法当然是做代理，这里我用的是网上大多数朋友的办法：[https://segmentfault.com/a/1190000011007043][https_segmentfault.com_a_1190000011007043]

不过要注意几个坑，有时候代理配好了但是在访问时却还报404错误 即出现target 明明配置了 但好像没生效一样，解决办法是重启**电脑试试。**

再则就是上线打包的怎么跨域：[https://www.jianshu.com/p/d80b7531ded3][https_www.jianshu.com_p_d80b7531ded3]

以上就是个人今天的总结

[https_github.com_typicode_json-server]: https://github.com/typicode/json-server
[https_nodejs.org_en]: https://nodejs.org/en/
[SouthEast]: /images/20220528/0a2a0a1f633d49529044e84e0daa3165.png
[SouthEast 1]: /images/20220528/a3e3ad49ef364c74932170aaa7616442.png
[http_localhost_3000]: http://localhost:3000/
[SouthEast 2]: /images/20220528/e5a438006943470dbf9ffb367d9c8ae8.png
[https_segmentfault.com_a_1190000011007043]: https://segmentfault.com/a/1190000011007043
[https_www.jianshu.com_p_d80b7531ded3]: https://www.jianshu.com/p/d80b7531ded3