easymock 图片_用easymock来mock数据

用线上的平台去mock数据：

easymock。

rapapi阿里的。功能更强大些，用起来更复杂。

搜索easymock,进入页面。

还是写那个网易云音乐作为演示。

注册或登录账号，然后创建项目。

点确定就可以了。

music的域名可能用掉了，加个/hunger的后缀。点进去看下。

现在可以建立接口啦，如图

+号表示创建接口，点它。

写好内容后，确定，如图

这时候输入数据，如何输入？看图片操作那有编辑的按钮，点进去，编辑：

点刷新。然后再在操作那里点复制链接的按钮。打开链接，如图

为什么会是这种展示呢？浏览器对这个特殊处理造成的，用终端打开，输入curl 那串复制的链接。如图

curl相当于就是去发请求了。

这时候，我们在本地也可以做个测试：

JS Bin

var xhr = new XMLHttpRequest()

xhr.open('GET','http://easy-mock.com/mock/59c0da5fe0dc663341aff877/hunger/getType',true) //URL注意，变了，但是本意是对的指向目标数据

xhr.send()

xhr.onload = function(){

console.log(xhr.status)

if((xhr.status >=200 && xhr.status<300 )||xhr.status===304){

var date = xhr.responseText

console.log(date)

}else{

console.log('error')

}

然后启动终端,在静态服务器中打开这个页面，然后看：

数据就到了。

跟上次在ajax的事例差不多，只是把后端的端口变了，然后代码的端口指向的参数必须也要变，剩下的就是对于网上的端口平台的熟悉应用了。

这里有个缺陷就是mock数据是死的，我不能根据我的一些条件做一些模拟。

比如我想模拟用户的登录状态，如何模拟用户成功或者失败的情况，这就模拟不了了。

后续如何利用这些数据做DOM呢？

var xhr = new XMLHttpRequest()

xhr.open('GET', '端口URL', true)

xhr.send()

xhr.onload = function(){

render(JSON.parse(xhr.responseText)) //把拿到的JSON格式的字符串转化成对象类型的数据就可以用JS编辑啦。

console.log(JSON.parse(xhr.responseText))

}

function render(Data){

for(var i = 0; i

var node = document.createElement('div')

node.classList.add('item') //提前在css中把.item的style设置好，直接加class。

node.innerText = Data[i]

document.querySelector('.目标父元素的类').appendChild(node)

}

easymock 图片_用easymock来mock数据相关推荐

easymock 图片_数据模拟神器 easy-mock 正式开源
开源公告由大搜车无线团队出品的 easy-mock 在线数据模拟服务上线至今已经有几个月时间了,近期网站刚更新了焕然一新的 2.0 版本,与此同时,我们还带来一个更重磅的消息: 今天正式将整个服务的 ...
easymock 图片_如何使用EasyMock?
在前后端分离的概念中,前端脱离与后端工作,在对好接口之后,以及后端没有假数据的情况下,可以先采用折衷的办法来请求假数据,这就有了Mock.js,可以随机生成数据,拦截ajax请求.Easy Mock ...
easymock 图片_easy-mock的使用
上一节我们讲了如何使用mockjs来生成模拟数据,这一节我们来介绍另外一个实用的mock工具 - easy-mock,它是一个简单.高效.可视化的在线mock工具.相对于我们上节的 mockjs主要用 ...
python docx 合并文档图片_使用python抓取大量简历文档内数据(word:docx;pdf;图片等）输出表格文件...
1. 文章背景描述: 近期公司有员工离职了,技术岗位的. 让HR招人,招聘进度也太慢了,实在等不及,就撸起袖子自己上.(之前从来没招聘过) 自己在某招聘网站注册后,花了若干人民币,短时间收到大量求职者 ...
easymock 图片_EasyMock的使用
1.Mock 方法是单元测试中常见的一种技术,它的主要作用是模拟一些在应用中不容易构造或者比较复杂的对象,从而把测试与测试边界以外的对象隔离开.同时也可以当调用别人的模块,而该模块又没有实现时(只提供 ...
vue前端用服务器上路径的图片展示_5分钟教你用nodeJS手写一个mock数据服务器
对于前端开发者而言,javascript正扮演着越来越重要的地位,它不仅能为浏览器端赋能,在web服务器方面也有很大的价值(我们可以用nodeJS来写服务端代码,启动web服务器),因此本文所要描述的 ...
mock如何为空_如何 mock 数据
mock 数据的好处团队可以并行工作有了Mock,前后端人员只需要定义好接口文档就可以开始并行工作,互不影响,只在最后的联调阶段往来密切:后端与后端之间如果有接口耦合,也同样能被Mock解决:测试 ...
前端mock数据详细讲解
在实际的项目研发过程中,我们经常会遇到如下的尴尬场景: 前端开发依赖于后端接口数据,但是后台人员不足或者无法立即到位,前端迟迟不能开工,或者前端小伙子自己参照ui设计图,完成对应的静态页面(没有数据交 ...
前端mock数据(超级详细)
在实际的项目研发过程中,我们经常会遇到如下的尴尬场景: 前端开发依赖于后端接口数据,但是后台人员不足或者无法立即到位,前端迟迟不能开工,或者前端小伙子自己参照ui设计图,完成对应的静态页面(没有数据交 ...

easymock 图片_用easymock来mock数据

easymock 图片_用easymock来mock数据相关推荐

最新文章

热门文章