心得技巧
ajax 第八节 网络延时与超时回调--异常回调
发布时间：2022-07-01 发布网站：脚本宝典
脚本宝典收集整理的这篇文章主要介绍了ajax 第八节 网络延时与超时回调--异常回调，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ server.js 设置网络延时时间＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
//引用 express
const { request, response, json } = require('express');
const express = require('express');
//创建应用对象
const app = express();
//创建路由规则，
// request 是对请求报文的封装
// response 是对响应报文的封装
//app.all 可以接收任意类型的请求头
app.get('/cache', (request, response) => {
//设置响应头，设置充许跨域
response.setHeader('Access-Control-Allow-Origin', '*');
setTimeout(() => {
response.send('延时响应3秒.....');
}, 3000);
})
// 监听端口启动服务
app.listen(8000, () => {
console.log('服务已经启动,8000端口监听中.......');
})
============================index.html 设置超时时间与延时回调===============================
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#result {
width: 200px;
height: 100px;
border: solid 1px red;
}
.abc {
width: 200px;
height: 100px;
border: solid 1px pink;
}
</style>
</head>
<body>
<button>点我发送请求</button>
<div class="abc"></div>
<div id="result"></div>
</body>
<script>
const btn = document.getElementsByTagName('button')[0];
const result = document.getElementById('result');
btn.addEventListener('click', function () {
const xhr = new XMLHttpRequest();
xhr.timeout = 2000;
xhr.ontimeout = function () {
alert('网络导常，请稍后重试！！');
}
xhr.open('GET', 'http://127.0.0.1:8000/cache?t=' + Date.now());
xhr.send();
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
if (xhr.status >= 200 && xhr.status < 300) {
result.innerHTML = xhr.response;
}
}
}
})
</script>
</html>
脚本宝典总结
以上是脚本宝典为你收集整理的ajax 第八节 网络延时与超时回调--异常回调全部内容，希望文章能够帮你解决ajax 第八节 网络延时与超时回调--异常回调所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。
猜你在找的心得技巧相关文章
- clion结合vcpkg以及GTest的使用 2022-07-07
- EGF 2022-06-06
- ExtJS 布局-Column布局（Column layout） 2022-06-05
- 颜色之ARGB与RGB、RGBA的区别与介绍 2022-04-15
- rgba中的a是什么意思 CSS之RGBA颜色指南 2022-04-15
- rootfs -根文件系统制作 2022-07-07
- 网页简单布局之结构与表现原则分享 2022-04-15
- 小项目中怎么防止Vue的闪现画面效果 2022-04-15
- 隐藏 Web 中的元素方法及优缺点教程详解 2022-04-15
- 告别硬编码让你的前端表格自动计算的实例代码 2022-04-15
全站导航更多
html5HTML/XhtmlCSSXML/XSLTDreamweaver教程Frontpage教程心得技巧JavaScriptASP.NETPHP编程正则表达式AJAX相关ASP编程JSP编程编程10000问CSS/HTMLFlexvbsDOS/BAThtahtcpythonperl游戏相关VBA远程脚本ColdFusionMsSqlMysqlmariadboracleDB2mssql2008mssql2005SQLitePostgreSQLMongoDB星外虚拟主机华众虚拟主机Linuxwin服务器FTP服务器DNS服务器Tomcatnginxzabbix云和虚拟化bios系统安装系统系统进程Windows系列LINUXRedHat/CentosUbuntu/DebianFedoraSolaris红旗Linux建站经验微信营销网站优化网站策划网络赚钱网络创业站长故事alexa域名photoshop教程摄影教程Fireworks教程CorelDraw教程Illustrator教程Painter教程Freehand教程IndesignSketch笔记本主板内存CPU存储显卡显示器光存储鼠标键盘平板电脑安全教程杀毒防毒安全设置病毒查杀脚本攻防入侵防御工具使用业界动态Exploit漏洞分析
最新心得技巧教程