我正在开发一个显示html/css/javascript代码示例的网站。类似于最佳实践库的东西。
示例可能如下所示:
- 如何实现完整的可点击预告片元素
- 一个好的标题大纲应该是什么样子 的
- 如何在模式对话框中管理键盘焦点
我正在使用 CodePen.io 来创建示例,因此用户可以试用它们并根据自己的意愿使用它们。
每个示例都呈现在一个网页上,每个示例都应该只用 HTML、CSS 和 JavaScript(CodePen.io 提供的东西)编写。
唯一的问题是:我如何模拟(假的?)请求?
- 例如,其中一个示例将演示单击按钮如何触发对服务器的 AJAX 调用,然后在页面上的某处显示信息。在后台,它并不是真正的 AJAX 调用,它只是一个由一些 JavaScript 处理的"假"AJAX 调用。
- 另一个例子是在页面之间导航:URL应该改变(例如
examples/123/#index
,然后在单击链接后examples/123/#some-other-page
),但实际上,它仍然是一次又一次显示的同一页面,但根据 URL 的不同,会显示一些不同的内容。浏览器历史记录也需要正常工作。 - 最后一个示例可能是提交表单并在表单中内联显示输入错误:如何轻松获取 POST 数据,并再次显示表单并显示错误?
这肯定可以使用普通的JavaScript来完成。但我确信有库可以做这样的事情,我只是不知道要搜索什么。
事实上,我所描述的是迷你的 1 页应用程序。但是我不需要像 AngularJS 这样成熟的框架,我想可以处理请求(包括管理浏览器历史记录和 URL)的非常简单的东西足以满足我的目的。
创建一个假服务器来做 AJAX 请求,你可以使用这个 nodejs 模块,例如:
http://www.begeek.fr/starcraft-remastered-lannonce-surprise-de-blizzard-lete-235328?utm_source=facebook&utm_campaign=begeek
使用此模块,您可以执行真正的 GET、POST、PUT 或 DELETE 请求,并将虚假数据发送到您的 JavaScript 应用程序。
另一种方法是简单地使用超时和承诺来伪造发送模拟数据的 AJAX 请求。但是使用这种方法,你永远不会发送真正的HTTP请求,它只是返回数据的函数。
下面是一个函数的示例,该函数创建 Promise 来伪造服务器响应:
function sendFakeUser() {
let user = {
name: 'antoine',
email: 'a@antoine.fr'
};
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(user);
}, 2000);
});
}
你可以像这样调用这个函数:
sendFakeUser()
.then((user) => {
console.info(user);
// console or do stuff with your data
}