使用React、Node.js、MongoDB、Socket.IO开发一个角色投票应用的
前篇
原文第十三步,Express API路由第一个路由是用来创建角色的 app.post('/api/characters',(req,res,next) => { let gender = req.body.gender; let characterName = req.body.name; let characterIdLookupUrl = 'https://api.eveonline.com/eve/CharacterId.xml.aspx?names=' + characterName; const parser = new xml2js.Parser(); async.waterfall([ function(callback) { request.get(characterIdLookupUrl,(err,request,xml) => { if(err) return next(err); parser.parseString(xml,parsedXml) => { try { let characterId = parsedXml.eveapi.result[0].rowset[0].row[0].$.characterID; app.models.character.findOne({ characterId: characterId},model) => { if(err) return next(err); if(model) { return res.status(400).send({ message: model.name + ' is alread in the database'}); } callback(err,characterId); }); } catch(e) { return res.status(400).send({ message: ' xml Parse Error'}); } }); }); },function(characterId) { let characterInfoUrl = 'https://api.eveonline.com/eve/CharacterInfo.xml.aspx?characterID=' + characterId; console.log(characterInfoUrl); request.get({ url: characterInfoUrl },parsedXml) => { if (err) return res.send(err); try{ let name = parsedXml.eveapi.result[0].characterName[0]; let race = parsedXml.eveapi.result[0].race[0]; let bloodline = parsedXml.eveapi.result[0].bloodline[0]; app.models.character.create({ characterId: characterId,name: name,race: race,bloodline: bloodline,gender: gender },model) => { if(err) return next(err); res.send({ message: characterName + ' has been added successfully!'}); }); } catch (e) { res.status(404).send({ message: characterName + ' is not a registered citizen of New Eden',error: e.message }); } }); }); } ]); }); 是不是看起来和原文的基本一模一样,只不过把var 变成了let 匿名函数变成了ES6的'=>'箭头函数,虽然我用的是warterline而原文中用的是mongoose但是包括方法名基本都一样,所以我感觉waterline是在API上最接近mongoose
完成了这个API我们就可以往数据库里添加东西了,不知道哪些用户名可以用?相当简单,反正我用的全是一名人的名字(英文名),外国人也喜欢抢注名字,嘿嘿嘿
原文第十三步,Home组件基本保持和原文一样,只是用lodash 替换了 underscore
原文中: ...... import {first,without,findWhere} from 'underscore'; ...... var loser = first(without(this.state.characters,findWhere(this.state.characters,{ characterId: winner }))).characterId; ...... 修改为: ...... import {first,filter} from 'lodash'; ...... let loser = first(filter(this.state.characters,item => item.characterId != winner )).characterId;
第十四步:Express API 路由(2/2)GET /api/characters原文的实现方法 /** * GET /api/characters * Returns 2 random characters of the same gender that have not been voted yet. */ app.get('/api/characters',function(req,next) { var choices = ['Female','Male']; var randomGender = _.sample(choices); Character.find({ random: { $near: [Math.random(),0] } }) .where('voted',false) .where('gender',randomGender) .limit(2) .exec(function(err,characters) { if (err) return next(err); if (characters.length === 2) { return res.send(characters); } var oppositeGender = _.first(_.without(choices,randomGender)); Character .find({ random: { $near: [Math.random(),0] } }) .where('voted',false) .where('gender',oppositeGender) .limit(2) .exec(function(err,characters) { if (err) return next(err); if (characters.length === 2) { return res.send(characters); } Character.update({},{ $set: { voted: false } },{ multi: true },function(err) { if (err) return next(err); res.send([]); }); }); }); }); 可以看到原文中用{ random: { $near: [Math.random(),0] } }做为查询条件从而在数据库里取出两条随机的记录返回给页面进行PK,前文说过random的类型在mysql没有类似的,所以我把这个字段删除了。本来mysql,可以用order by rand() 之类的方法但是,waterline的sort(order by rand())不被支持,所以我是把所有符合条件的记录取出来,能过lodash的sampleSize方法从所有记录中获取两天随机记录。 app.get('/api/characters',next) => { let choice = ['Female','Male']; let randomGender = _.sample(choice); //原文中是通过nearby字段来实现随机取值,waterline没有实现mysql order by rand()返回随机记录,所以返回所有结果,用lodash来处理 app.models.character.find() .where({'voted': false}) .exec((err,characters) => { if(err) return next(err); //用lodash来取两个随机值 let randomCharacters = _.sampleSize(_.filter(characters,{'gender': randomGender}),2); if(randomCharacters.length === 2){ //console.log(randomCharacters); return res.send(randomCharacters); } //换个性别再试试 let oppsiteGender = _.first(_.without(choice,randomGender)); let oppsiteCharacters = _.sampleSize(_.filter(characters,{'gender': oppsiteGender}),2); if(oppsiteCharacters === 2) { return res.send(oppsiteCharacters); } //没有符合条件的character,就更新voted字段,开始新一轮PK app.models.character.update({},{'voted': false}).exec((err,characters) => { if(err) return next(err); return res.send([]); }); }); });
GET /api/characters/search这个API之前还有两个API,和原文基本一样,所做的修改只是用了ES6的语法,就不浪费篇幅了,可以去我的github看 这一个也只是一点mongoose和waterline的一点点小区别 app.get('/api/characters/search',next) { var characterName = new RegExp(req.query.name,'i'); Character.findOne({ name: characterName },function(err,character) { ...... 我改成了 app.get('/api/characters/search',next) => { app.models.character.findOne({name:{'contains':req.query.name}},character) => { ..... 通过contains来查找,其实就是like %sometext%的方法来实现 GET /api/stats这个是原文最后一个路由了, app.get('/api/stats',next) => { let asyncTask = []; let countColumn = [ {},{race: 'Amarr'},{race: 'Caldari'},{race: 'Gallente'},{race: 'Minmatar'},{gender: 'Male'},{gender: 'Female'} ]; countColumn.forEach(column => { asyncTask.push( callback => { app.models.character.count(column,count) => { callback(err,count); }); }) }); asyncTask.push(callback =>{ app.models.character.find() .sum('wins') .then(results => { callback(null,results[0].wins); }); } ); asyncTask.push(callback => { app.models.character.find() .sort('wins desc') .limit(100) .select('race') .exec((err,characters) => { if(err) return next(err); let raceCount = _.countBy(characters,character => character.race); console.log(raceCount); let max = _.max(_.values(raceCount)); console.log(max); let inverted = _.invert(raceCount); let topRace = inverted[max]; let topCount = raceCount[topRace]; callback(err,{race: topRace,count: topCount}); }); }); asyncTask.push(callback => { app.models.character.find() .sort('wins desc') .limit(100) .select('bloodline') .exec((err,characters) => { if(err) return next(err); let bloodlineCount = _.countBy(characters,character => character.bloodline); let max = _.max(_.values(bloodlineCount)); let inverted = _.invert(bloodlineCount); let topBloodline = inverted[max]; let topCount = bloodlineCount[topBloodline]; callback(err,{bloodline: topBloodline,count: topCount}); }); }); async.parallel(asyncTask,results) => { if(err) return next(err); res.send({ totalCount: results[0],amarrCount: results[1],caldariCount: results[2],gallenteCount: results[3],minmatarCount: results[4],maleCount: results[5],femaleCount: results[6],totalVotes: results[7],leadingRace: results[8],leadingBloodline:results[9] }); }) }); 我把要统计数据的字段放入一个数组countColumn通过forEach把push到asyncTask,最后两个统计方法不一样的函数,单独push,最后用async.parallel方法执行并获得结果。
(编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |