zoukankan      html  css  js  c++  java
  • node.js模拟qq漂流瓶

     (文章是从我的个人主页上粘贴过来的,大家也可以访问我的主页 www.iwangzheng.com)

    node.js模拟简易漂流瓶,页面有扔瓶子和捡瓶子的功能,一个瓶子只能被捡到一次,阅读完就置状态位,如果没有瓶子,提示无瓶子,等等,功能很丰富哦,let‘s   go

    (1)安装python,node,由于这是很久之前装的了,此次不再重复。

    (2)下载sqlite3数据库,网址为http://www.sqlite.org/download.html,

    选择:Precompiled Binaries for Windows,下载完别忘记把这个文件放在c盘的windows下的sysytem32文件夹里。

    (3)新建项目文件夹,打开终端,进入文件夹目录,先安装一下必要的插件,命令如下,npm install cryptojs,npm install sqlite3

    开始建数据库,sqlite3  bottle.db就可以建新的bottle数据库啦,然后建表
    CREATE TABLE message(
    id Integer primary key autoincrement,
    nick_name varchar(20),
    content varchar(4096),
    is_read boolean,
    create_time datetime,
    update_time datetime
    );

    整个项目的代码就是html文件和js文件组成的,非常和谐的,

    前端html建立XMLHttpRequest,在onreadystatechange这个回调函数里判断状态,用的是最原始的ajax异步调用,get方式,这决定了漂流瓶不能内容太多,url传值有数量限制,最大是4k。

    核心代码如下:都是毫无悬念的东西,原生的,求大神指点框架版本的怎么破。

    xhr.onreadystatechange=function(){
    if(xhr.readyState == 4){
    if(xhr.status == 200){
    alert(xhr.responseText);
    var returnValue = JSON.parse(xhr.responseText);
    alert(returnValue.result);
    }
    else if(xhr.status == 500){
    alert("出错了");
    }
    }
    }
    xhr.open('get','/send?content='+encodeURIComponent(c)+"&name="+encodeURIComponent(nickName),true);
    xhr.send(null);

    server部分核心代码:

    var url = require("url")        类似的方法进行请求

    var db = new sqlite.Database("bottle.db");  把咱们建好的数据库用起来

    http.createServer(........).listen(8080); 监听端口8080,

    最后别忘记退出的时候关闭数据库连接
    process.on("SIGINT",function(){
    console.log("program will exit.");
    db.close();
    process.exit(1);
    })

    好叻,把node跑起来吧,在终端输入node  bottle_server.js

    这个就是咱们刚写好的js的名字,现在可以在浏览器中输入localhost:8080

    重定向到了html页面,现在就可以扔瓶子捞瓶子了,哈哈,很有趣啊,虽然捞到的都是自己扔的瓶子

  • 相关阅读:
    WCF里几个基本知识点
    MVC3+EntityFramework实践笔记
    一些vim的插件和配置
    Web API工作方式
    计算机中的异常
    Glusterfs之nfs模块源码分析
    ASP.NET Windows身份认证
    Sql Server表结构及索引辅助查看工具
    sql server批量插入与更新两种解决方案
    如何在ViewModel中正确地使用Timer(定时器)
  • 原文地址:https://www.cnblogs.com/iwangzheng/p/3578008.html
Copyright © 2011-2022 走看看