nodejs 静态资源文件与登陆交互
server2.js
var express=require('express');
var expressStatic=require('express-static');
var server=express();
server.listen();
//用户数据
var users={
'mike': '',
'jack': '',
'luci': ''
};
server.get('/login', function (req, res){
var user=req.query['user'];
var pass=req.query['pass'];
if(users[user]==null){
res.send({ok: false, msg: '此用户不存在'});
}else{
if(users[user]!=pass){
res.send({ok: false, msg: '密码错误'});
}else{
res.send({ok: true, msg: '成功'});
}
}
});
server.use(expressStatic('./www'));
a.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="ajax.js" charset="utf-8"></script>
<script type="text/javascript">
window.onload=function (){
var oUser=document.getElementById('user');
var oPass=document.getElementById('pass');
var oBtn=document.getElementById('btn1'); oBtn.onclick=function (){
ajax({
url: '/login',
data: {user: oUser.value, pass: oPass.value},
success: function (str){
var json=eval('('+str+')');
if(json.ok){
alert('登录成功');
}else{
alert('登录失败：'+json.msg);
}
},
error: function (){
alert('不好意思，失败了');
}
});
};
};
</script>
</head>
<body>
用户：<input type="text" id="user" /><br>
密码：<input type="password" id="pass" /><br>
<input type="button" value="登录" id="btn1" />
</body>
</html>
ajax.js
function json2url(json){
var arr=[];
for(var name in json){
arr.push(name+'='+json[name]);
}
return arr.join('&');
}
function ajax(json){
json=json || {};
if(!json.url)return;
json.data=json.data || {};
json.type=json.type || 'get';
var timer=null;
if(window.XMLHttpRequest){
var oAjax=new XMLHttpRequest();
}else{
var oAjax=new ActiveXObject('Microsoft.XMLHTTP');
}
switch(json.type){
case 'get':
oAjax.open('GET',json.url+'?'+json2url(json.data),true);
oAjax.send();
break;
case 'post':
oAjax.open('POST',json.url,true);
oAjax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
oAjax.send(json2url(json.data));
break;
}
oAjax.onreadystatechange=function(){
if(oAjax.readyState==){
clearTimeout(timer);
if(oAjax.status>= && oAjax.status< || oAjax.status==){
json.success && json.success(oAjax.responseText);
}else{
json.error && json.error(oAjax.status);
}
}
};
}
截图：
效果：
nodejs 静态资源文件与登陆交互的更多相关文章
- Spring MVC 处理静态资源文件
摘要: 三个方案: 1.方案一:激活Tomcat的defaultServlet来处理静态文件 2.方案二: 在spring3.0.4以后版本提供了mvc:resources (需要配置annotati ...
- spring mvc静态资源文件的引用
在页面的<title>下 <link rel="stylesheet" href="<%=request.getContextPath()%> ...
- Spring MVC程序中得到静态资源文件css,js,图片文件的路径问题总结
上一篇 | 下一篇 Spring MVC程序中得到静态资源文件css,js,图片 文件的路径 问题总结 作者:轻舞肥羊 日期:2012-11-26 http://www.blogjava.net/fi ...
- SpringMVC+FreeMarker实现静态资源文件自动添加版本号(md5)
近日切换java开发,开始学习springframework.在实现静态资源文件自动计算版本号的实例时,因为不熟悉框架,走了不少弯路,好在最终解决了问题.这里写篇文章记录一下实现,也希望对大家有些用处 ...
- Django使用模板后无法找到静态资源文件
Django使用模板后无法找到静态资源文件 环境配置 Django版本1.11 python版本3.6.2 前言 在编写Django网站的时候,在涉及模板方面,一些简单的例子都没有问题,但这些例子都有 ...
- 关于IDEA每次修改HTML,Css等静态资源文件都需要重启的设置修改
~ ~ ~ ~ ~ 关于IDEA每次修改HTML,Css等静态资源文件都需要重启的设置修改 最近开始使用IDEA进行项目开发,但是对于每次修改HTML文件中css和js文件之后都必须重启服务这件事表示 ...
- linux下配置nginx使用ftp目录作为静态资源文件的目标目录
1.安装ftp服务,可以直接yum install vsftpd. 2.设置随机启动,chkconfig vsftpd on. 3.启动ftp服务,service vsftpd start. 4.配置 ...
- 如何引用GitHub的静态资源文件 js css
参考:引用GitHub的静态资源文件 有些人说直接用 Github Raw 浏览器不执行是因为返回的 content-type 是 text/plain,这么说不准确.实际上浏览器对 MIME 类型并 ...
- IntelliJ IDEA - 热部署插件JRebel ,对静态资源文件进行热部署？javascript、css、vm文件
IntelliJ IDEA - 热部署插件JRebel ,对静态资源文件进行热部署?javascript.css.vm文件https://blog.csdn.net/feng_pump/article ...
随机推荐
- Codeforces 354B 博弈， DP，记忆化搜索
题意:现在有一个字符矩阵,从左上角出发,每个人交替选择一个字符.如果最后字符a数目大于字符b,那么第一个人获胜,否则b获胜,否则平均.现在双方都不放水,问最后结果是什么? 思路:这题需要注意,选择的字 ...
- nginx实现高性能负载均衡的Tomcat集群
1. 安装软件: nginx 两个apache-tomcat 安装过程省略. 2.配置两个tomcat的http端口,第一个为18080,第二个为28080 注意:需要把server.xml文件中所有 ...
- 【Database】MySQL实战45讲
01 | 基础架构:一条SQL查询语句是如何执行的? 1. MySQL 的基本架构图: MySQL可以分成: Server层 和 存储引擎层 两部分. Server层:包含连接器.查询缓存.分析器.优 ...
- Sass--伪类嵌套
其实伪类嵌套和属性嵌套非常类似,只不过他需要借助`&`符号一起配合使用. a { &:link, &:visited { color: blue; } &:hover ...
- java “+”运算
/* 四则运算中加好“+”有常见的三种用法 1.对于数值来说,那就是加法 2.对于字符char来说,在计算之前char会被提升成为int 然后在计算 3.对于字符串String(首字母大写,并不是关键 ...
- java命令-jstat/ javap
jstat命令对应用程序资源和性能进行实时监控 常用参数列举如下: 1. jstat -class pid 显示加载class的数量.所占空间.所耗时间等信息 2.jstat -compiler pi ...
- git 初始化提交项目
Git初始化本地已有项目,并推送到远端Git仓库操作1. 创建本地项目,在项目根目录执行git init命令git init 2. 在git服务器上创建一个仓库,这里使用GitHub创建一个仓库.例如 ...
- sass-loader屡次安装不生效的问题
报错信息: npm WARN sass-loader@8.0.0 requires a peer of webpack@^4.36.0 but none is installed. You must ...
- java基础学习笔记一
一.JAVA访问控制修饰符 用于控制类中成员的可见性 1.public(公有):在任何地方可以访问 2.protected(受保护的):子夫类(即使字父类不在同一包)和本包中可以访问 3.defaul ...
- 《ArcGIS Runtime SDK for .NET开发笔记》 --Hello Word
这里我们将创建第一个用于显示地图的APP. 1.新建一个WPF程序 首先我们打开Visual Studio,选择新建项目. 选择已安装——模板——Windows桌面——WPF应用程序 2.添加Run ...