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 ...
随机推荐
- spring 获取url参数
1. usl格式: http://localhost:8080/contact/delete/3 java代码 @RequestMapping(value="/delete/{id}&quo ...
- vue学习笔记（五）— 组件通信
关于vue父子组件通信 作者:狐狸家的鱼 本文链接:vue组件通信 GitHub:sueRimn 如果组件是一个单页面,组件之间存在父子关系,数据传递就需要根据父子不同的地位使用不同的办法. 借助新建 ...
- 工具类Collections、Arrays(传入的是数组)
Collections类: 1. Collections.sort(list) //对list集合进行排序前提是 list里面存储的对象已经实现了 comparable接口 2. Collecti ...
- JavaSE---环境配置
1.概述 1.1 PATH环境变量 a,Java程序 编译.运行时 需要用到java.javac命令,虽然计算机中已经安装了JDK,但是计算机不知道去哪里找这个命令: b,计算机如何查找命令呢 ...
- python3 利用configparser生成和读取配置文件
利用configparser生成和读取配置文件 #Author by Andy #_*_ coding:utf-8 _*_ import configparser ''' 配置文件格式 groupna ...
- Mac上无法使用蓝牙时的7个修复程序
蓝牙是一个很普遍的技术,除非它出现问题,你才会发现它.例如,你听歌很顺利时,直到AirPods突然断连.大多数时候,这是一个相对容易的修复,但有时可能会有些棘手. https://www.macdow ...
- 树莓派GPIO口驱动编写
一.wiringpi写法 #include <wiringPi.h> #include <stdlib.h> int main(int argc,char *argv[]) { ...
- 分布式系统理论基础8：zookeeper分布式协调服务
本文转自 https://www.cnblogs.com/bangerlee/p/5268485.html 本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到 ...
- sync.Once.Do(f func())
sync.Once.Do(f func())是一个挺有趣的东西,能保证once只执行一次,无论你是否更换once.Do(xx)这里的方法,这个sync.Once块只会执行一次. package mai ...
- mongo大数据量更新服务端超时解决： Cursor not found, cursor id: 82792803897
mongodb pymongo.errors.CursorNotFound: Cursor not found, cursor id: 82792803897 默认 mongo server维护连接的 ...