基于 使用各前沿JS 框架，创建网页手游的各种坑（HTML5+COCOS2D-JS+NODE.JS）

最近自己试着做一个能在微信运行的页面联网游戏，采用 HTML5+cocos2d-js+node.js 技术,
游戏的核心基于cocos2d-js 引擎，因cocos2d-js 目前无法实现或不好实现 调用手机相册和相机 功能，
因此采用游戏注册页（登录页）使用HTML5 方案，登录后，跳转到 基于 cocos2d-js 的核心游戏，
然后使用 node.js 作为服务器端，提供 HTTP的 文件URL 静态文件访问服务，websocket 网络链接服务，
同时 node.js 服务器 使用 redis 提供内存缓存和消息订阅发送、使用MYSQL 作为数据库。
以上技术框架，目前应该说都还不够成熟，不能用来开发大型或企业级应用，因此本人在开发过程中，也遇到各种各样的坑，
其中很多问题是网上很多朋友都遇到并没有实际解决方案的问题，因此在这里，我吧自己曾经遇到的问题，统一收集起来，
以便给遇到同样类似问题或学习初期的朋友提供参考

一、所有开发环境搭建

1、安装cocos2d-js 框架运行环境（WINDOWS 系统）
以下 cocos2d 官网上教程 较为详细并经过实践能成功，详情参考
http://www.cocos.com/doc/tutorial/show?id=139
其中 “4.下载Cocos2d-JS 3.0版本。。。”
这里,cocos2d-js 是指 cocos2d-js 框架（目前版本是 3.6.1），下载地址为：
http://store.cocos.com/stuff/show/126074.html

2、IDE（开发工具）安装
cocos code ide (cocos-js 代码编译器) :目前cocos code IDE 最新版本为 2.0（Bate版本）
以前cocos code IDE 1.X 版本是 eclipse 插件，2.0 版本改成 IntelliJ IDEA 插件。
cocos code ide 2.0 安装 详情参考 官网文档：
http://www.cocos.com/doc/article/index?type=code-ide&url=/doc/cocos-docs-master/manual/code-ide/install-idea-zh.md
按照官网推荐，最好采用 IntelliJ IDEA 插件 方式安装，
IntelliJ IDEA 使用 IntelliJ IDEA Ultimate （收费版本，收费版本代码提示完整），
这里经过本人验证，IntelliJ IDEA Ultimate 目前最新版本为 15.× 版本，但安装后，使用cocos code ide 无法使用DEBUG调试，，
但用 14.* 版本没问题，所以推荐下载 IntelliJ IDEA Ultimate 14.× 版本
注 一个IntelliJ IDEA Ultimate 注册码：
user or company name：o
license key：63625-MQ87K-3SRZ2-8MQYB-6NQZC-2Z8K6

3、WebStorm 安装
如果只是开发网友游戏，用 WebStorm 就可以了，WebStorm 运行速度感觉更快，界面与IntelliJ IDEA 基本一致；IntelliJ IDEA 主要是用来开发androi,iphone 游戏，可以用真机进行连调

二、HTML5 页面(主要是浏览器兼容问题)
1、HTML5 页面打开相机和相册
网上基本资料写法都是"<input type="file" accept="image/*;capture=camera" class="input">",在手机浏览器上基本没问题，
但在微信上，选择文件后，就没反应了，没法获取文件，在微信上 下面写法，就能打开相机和选择相册文件
<input type="file"  accept="image/*” capture="camera" >
2、还是相册问题，手机浏览器上，选择相册文件后，获取的图片是横屏的，这样没法进行载取头像等功能，因此先要把图片转正，
搜索了很多网上的办法，有些无法执行，有些在手机浏览器或微信浏览器，无法执行，根据资料查找，整合各方面资料，
附件完整代码可以运行在手机浏览器上，包括微信浏览器。运行下面HTML ，实现打开相机或相册，然后进行图片缩放、区域选择等完整功能

三、node.js 服务器
1、node.js 服务器框架
node.js 是单线程，因此node 程序里，任何一个地方出错，都会导致整个服务器退出，因
此需要应用运行时捕捉异常处理：uncaughtException，避免程序崩溃。node.js 服务器端主框架如下：

main.js 文件

//domain：domain异常处理模块
var domain=require("domain");
var runDomain=domain.create();
function init(){
   //你的业务处理模块
   
   //设置异常处理器
    exceptionHandler=function(err)
    {
        console.error("[ERROR]:"+err);
    };
}

/*domain捕捉到异常后处理，记录异常信息*/
runDomain.on("error",function(err)
    {
        exceptionHandler(err);
    }
);

/*使用domain捕捉机制执行服务器创建过程方法*/
runDomain.run(init);
/**/
//应用运行时捕捉异常处理：uncaughtException，避免程序崩溃
process.on("uncaughtException",function(e)
{
    exceptionHandler(e);
});

2、node.js 使用MYSQL
node.js 没有多线程概念，因此不能使用一个mysql 链接客户端，否则访问量稍微一大，就会出现链接堵塞，
无法满足业务需求，mysql 链接可使用mysql 模块的createPool，虽然不是真正意义上的链接池，个人感觉是运行一个SQL打开一个链接，
但用完后，链接立即释放。这样不会出现共用一个数据库链接情况

mySqlConnect.js

var mysql=require("mysql");
(function(){
    var mySqlConnect=function(conf) {
        var pool = mysql.createPool(conf);
        this.query=function(sql,args,callback)
        {
            pool.getConnection(function(err,conn){
                if(err){
                    callback(err,null,null);
                }else{
                    conn.query(sql,args,function(qerr,vals,fields){
                        //释放连接
                        conn.release();
                        //事件驱动回调
                        callback(qerr,vals,fields);
                    });
                }
            });
        }.bind(pool);
    }
    //设置开放模块
    module.exports=mySqlConnect;
})();


mySqlConnect 调用：
   sql="update u_user set sex=0 where user_id=? ";
    
    var args=[507];
    mySqlConnect.query(sql, args, function(qerr,vals,fields){
        if(qerr !== null){
            exceptionHandler(qerr);
        }
        else {
            console.log(vals);
            
        }
    });

3、node.js 中 websocket 服务器
node.js 中建立 websocket 服务器，基本网上资料，都是用 socket.io ，用这种方法建立websocket 服务网上资料很多，
但用 socket.io  建立的 websocket 服务器，客户端也只能用 socket.io 包创建websocket 客户端，
如果客户端，用HTML5 原生 websocket 客户端，链接会报错 Connection closed before receiving a handshake response；
不幸的是，cocos-js 中 的 websocket 客户端，就不是用socket.io的，因此无法链接服务器，解决方案：
node.js 中 使用  var WebSocketServer = require('ws').Server 方式建立 websocket 服务器；

    var WebSocketServer = require('ws').Server;
    var  wss = new WebSocketServer({port: 8082});
    wss.on('connection', function(ws) {
        ws.on('message', function(message) {
            console.log('received: %s', message);
            ws.send(message);
        });
        ws.send('something');
    });
 
其中 ws 的安装：npm install -g ws
然后使用 安装好的 ws 库；这样的    WebSocketServer ，使用 cocos-js 里 js-test 中 websocket 样例，就可以链接成功

4、node.js 中利用 express ,建立 静态文件访问http 服务
服务器端，需要提供图片，HTML5 文件的URL 地址访问，使用node.js 中 express可以很方便建立一个 静态文件访问HTTP服务器：
 var app =express();
 app.use('/static', express.static(__dirname + '/static'));
 app.listen(3000);
 这样，通过： http://你服务器地址：端口/static/***,访问你 static 目录下静态文件，如：http://127.0.0.1:3000/static/test.png