json-server

前端开发中,想通过异步请求服务端json数据,但是服务端还没有开发完,此时可以快速启动一个server服务

1,安装json-server插件

npm -g add json-server

2,创建一个json文件 test.json

{
"posts": [
{ "id": 1, "title": "json-server", "author": "typicode" }
],
"comments": [
{ "id": 1, "body": "some comment", "postId": 1 },
{ "id": 2, "body": "some comment", "postId": 1 }
],
"profile": { "name": "typicode" }
}

3,启动server服务

json-server --watch data.json  --port   /*指定端口启动启动*/

4,son-server默认的静态资源(HTML,CSS,JS等)是在与json数据文件同级目录下的public文件夹中,你只需要创建一个名为public的文件夹,把静态资源放到public目录下,然后直接运行以下命令启动即可:

json-server data.json 

5,假如我们需要指定静态资源文件夹的位置,则可以通过指定目录来启动json-server即可,如指定静态资源为 json 数据同级目录的source文件夹下,则:

json-server data.json --static ./source

  

son-server模拟http mock数据的更多相关文章

  1. 前端模拟(mock)接口数据(koa)

    在前后端分离开发项目时,经常会有前后端进度不一致,可能前端界面开发已经完成,就等接口了,如果等接口出来再联调的话时间可能会来不及. 这个时候,前端就可以根据制定好的接口规范和接口文档来mock接口数据 ...

  2. Mock(模拟后端接口数据)配合Vuex的使用

    1.下载Mock  cnpm install Mockjs -S 2.新建一个data.js存放新生成的mock文件 编辑mock  并导出 const Mock = require('mockjs' ...

  3. mock数据(模拟后台数据)

    mock数据(模拟后台数据) - Emily恩 - 博客园 https://www.cnblogs.com/enboke/p/vue.html Mock.js http://mockjs.com/ 前 ...

  4. json-server模拟接口获取mock数据

    转载:http://blog.csdn.net/stevennest/article/details/76167343 安装json-server 运行以下命令 cnpm install json-s ...

  5. mock模拟接口返回数据

    mock,是python中模拟接口返回数据 1.安装 pip install mock import unittest from mock import Mock def add(a,b): pass ...

  6. 使用node.js + json-server + mock.js 搭建本地开发mock数据服务

    在开发过程中,前后端不论是否分离,接口多半是滞后于页面开发的.所以建立一个REST风格的API接口,给前端页面提供虚拟的数据,是非常有必要的.对比过多种mock工具后,我最终选择了使用 json se ...

  7. vue模拟后端获取数据——json-server与express

    转载自: https://blog.csdn.net/weixin_39728230/article/details/80293892 https://blog.csdn.net/lxkll/arti ...

  8. vue-cli 本地开发mock数据使用方法

    vue-cli 中可以通过配置 proxyTable 解决开发环境的跨域问题,具体可以参考这篇文章: Vue-cli proxyTable 解决开发环境的跨域问题 如果后端接口尚未开发完成,前端开发一 ...

  9. ajax 和 mock 数据

    ajax ajax是一种技术方案,但并不是一种新技术.它依赖的是现有的CSS/HTML/Javascript,而其中最核心的依赖是浏览器提供的XMLHttpRequest对象,是这个对象使得浏览器可以 ...

随机推荐

  1. (生鲜项目)05. RESTful api, 和 VUE

    第一步: 什么是 RESTful api 总结: 使用http协议作为介质, 达到客户端修改服务器端资源的目的, 服务器只需要提供指定的api接口, 客户端根据http协议中的post/get/put ...

  2. web api 2.0 上传文件超过4M时,出现404错误

    客户端代码 string path = "C:\\text.txt"; WebClient client = new WebClient(); Uri _address = new ...

  3. 虚拟变量和独热编码的区别(Difference of Dummy Variable & One Hot Encoding)

    在<定量变量和定性变量的转换(Transform of Quantitative & Qualitative Variables)>一文中,我们可以看到虚拟变量(Dummy Var ...

  4. Cocos Creator开发hello World

    若本号内容有做得不到位的地方(比如:涉及版权或其他问题),请及时联系我们进行整改即可,会在第一时间进行处理. 请点赞!因为你们的赞同/鼓励是我写作的最大动力! 欢迎关注达叔小生的简书! 这是一个有质量 ...

  5. 最大子段和(洛谷 P1115)

    题目描述 给出一段序列,选出其中连续且非空的一段使得这段和最大. 输入格式 第一行是一个正整数NNN,表示了序列的长度. 第二行包含NNN个绝对值不大于100001000010000的整数AiA_iA ...

  6. mysql 根据日期时间查询数据

    mysql> select * from table1; +----------+------------+-----+---------------------+ | name_new | t ...

  7. CTF PHP反序列化

    目录 php反序列化 一.序列化 二.魔术方法 1.构造函数和析构函数 2.__sleep()和__wakeup() 3.__toString() 4.__set(), __get(), __isse ...

  8. 解读 | 你真正理解什么是Cloud Native吗?

    你能做到每周.每天甚至每个钟头向客户发布新特性吗?新加入的开发者能够在他们工作的第一天甚至面试阶段就能部署代码吗?部署新员工的代码后,你能因为确信应用程序运行正常而安然入睡吗?建立快速发布机制,包括支 ...

  9. GPU性能越来越强大,为何直到现在还是不能取代CPU?

      从思路上说,GPU相当于火车,一个车头带几十节车厢,一下子把成千上万吨货全给你拉目的地:CPU相当于汽车,拉货旅游样样能干.因此,如果单纯比运力,一列火车比得过成百上千辆汽车:但如果几百人有几百个 ...

  10. 如何SpringBoot项目改为外置Tomcat启动

    正常情况下,我们开发 SpringBoot 项目,由于内置了Tomcat,所以项目可以直接启动,部署到服务器的时候,直接打成 jar 包,就可以运行了 (使用内置 Tomcat 的话,可以在 appl ...