前言

關(guān)鍵詞：NodeJs、express、http服務(wù)器

一、搭建一個(gè)http的服務(wù)器

1. 什么是弱聯(lián)網(wǎng)

游戲的主體，不需要網(wǎng)絡(luò)就能游戲 → 單機(jī)游戲。

但是為了優(yōu)化游戲體驗(yàn)，培養(yǎng)用戶黏性，通常會(huì)設(shè)計(jì)好友排行、得分、道具、抽獎(jiǎng)等環(huán)節(jié)需要聯(lián)網(wǎng)，這些就需要用弱聯(lián)網(wǎng)技術(shù)來(lái)做。

弱聯(lián)網(wǎng)技術(shù)一般需要訪問(wèn)服務(wù)器，通常采用http服務(wù)器 ，也就是web服務(wù)器+數(shù)據(jù)庫(kù)。

用什么技術(shù)？

主流的服務(wù)器開(kāi)發(fā)語(yǔ)言，都有http的技術(shù)，成熟的應(yīng)用。Java：Tomcat，Python：tornado，C#：IIS; Node.js中有個(gè) express模塊，是輕量級(jí)http服務(wù)器。使用JavaScript開(kāi)發(fā)。

2. 搭建http服務(wù)器

(1)安裝Node.js:?www.baidu.com?--> Node.js --> node -v -->打印出來(lái)Node.js版本;

(2)安裝express: express基于Node.js http框架。

百度搜索進(jìn)入GitHub官網(wǎng)，點(diǎn)擊進(jìn)入，搜索express，如上圖。然后，點(diǎn)擊進(jìn)入。在磁盤新建一個(gè)文件夾webserver，進(jìn)入此文件夾，按住Shift鍵同時(shí)，右擊，選擇【在此處打開(kāi)命名窗口】，之后執(zhí)行命令：npm install express，安裝express。參照https://github.com/expressjs/express

(3)搭建一個(gè)http server --> 6行代碼; 在文件夾webserver中新建main.js文件，修改文件內(nèi)容如下：

1. ?`var express = require('express'); // creatorApplication: 幫助我們創(chuàng)建一個(gè)web app實(shí)例;`3. ?`var app = express(); // app 的實(shí)例;`5. ?`// 百度新聞：國(guó)內(nèi)http://news.baidu.com/guoji ? --->一個(gè)站點(diǎn)里面不同地址;`6. ?`// 百度欣慰：國(guó)際http://news.baidu.com/guonei`7. ?`// http://news.baidu.com/: 站點(diǎn): ?IP(服務(wù)器IP + 域名解析) + 端口;`8. ?`// 域名 ---》DNS服務(wù)器---》解析得到IP地址;`9. ?`// http://news.baidu.com/ ---> http://news.baidu.com:80/`10. ?`// 站點(diǎn)IP: 127.0.0.1, 端口: 服務(wù)器指定: 8080;`11. ?`// http://127.0.0.1:8080/`12. ?`// 地址的響應(yīng)請(qǐng)求, --->處理函數(shù);`13. ?`// 地址：響應(yīng)請(qǐng)求`14. ?`// http://127.0.0.1:8080/lucky ---> ?funtion()`15. ?`// req 客戶端發(fā)過(guò)來(lái)的請(qǐng)求對(duì)象，數(shù)據(jù)都再里面;`16. ?`// res: 服務(wù)端會(huì)數(shù)據(jù)給客戶端的 對(duì)象;`18. ?`app.get('/lucky', function(req, res) {`19. ?`var ret = 1+ Math.random() * 7;`20. ?`ret = Math.floor(ret);`21. ?`res.send(""+ ret);`22. ?`});`

app.listen(8080); // 站點(diǎn)端口; 如下圖，在webserver目錄下打開(kāi)命令窗口，輸入node .\main.js啟動(dòng)抽獎(jiǎng)游戲的后臺(tái)服務(wù)。然后在瀏覽器地址欄輸入localhost:8080/lucky，效果如下：

二、客戶端向http服務(wù)器發(fā)送請(qǐng)求，并展示數(shù)據(jù)

1. 抽獎(jiǎng)客戶端發(fā)送請(qǐng)求

在scripts中新建gamemgr.js，添加onsendhttpclick方法，當(dāng)點(diǎn)擊開(kāi)始按鈕的時(shí)候調(diào)用此方法。將gamemgr用戶自定義腳本綁定到Canvas上，選中start按鈕節(jié)點(diǎn)，修改start開(kāi)始按鈕節(jié)點(diǎn)上的Button組件的Click Events屬性值為1，回車，然后將Canvas拖入，選中g(shù)amemgr，選中onsendhttp_click方法。如此，單擊開(kāi)始按鈕就會(huì)調(diào)用此方法。

1. ?`var http = require("http");`2. ?`var lucky_anim = require("lucky_anim");`3. ?`cc.Class({`4. ?`extends: cc.Component,`5. ?`properties: {`6. ?`disk: {`7. ?`type: lucky_anim,`8. ?`default: null,`9. ?`},`10. ?`},`11. ?`// 點(diǎn)擊 開(kāi)始 按鈕，先后臺(tái)發(fā)送http請(qǐng)求調(diào)用服務(wù)`12. ?`on_send_http_click(){`13. ?`// http標(biāo)準(zhǔn)庫(kù) -- > H5標(biāo)準(zhǔn) 查看http.js源碼`14. ?`http.get("http://127.0.0.1:8080", "/lucky", null, function(err, ret){`15. ?`if(err){`16. ?`return;`17. ?`}`18. ?`ret = parseInt(ret);`19. ?`this.show_anim(ret); // 顯示抽獎(jiǎng)動(dòng)畫(huà)`20. ?`}.bind(this));`21. ?`},`22. ?`show_anim(ret) { // 顯示抽獎(jiǎng)動(dòng)畫(huà)`23. ?`// 抽獎(jiǎng)盤 開(kāi)始繪制`24. ?`this.disk.start_lucky_draw(ret);`25. ?`},`26. ?`});`

將luckyanim.js綁定到disk節(jié)點(diǎn)上（左下圖），設(shè)置Canvas綁定的用戶自定義腳本gamemgr的disk屬性值為disk節(jié)點(diǎn)。

2. 跨域訪問(wèn)問(wèn)題

跨域訪問(wèn):網(wǎng)頁(yè)所在地址:?http://localhost:7456/;可能不安全的外部網(wǎng)頁(yè); -->服務(wù)器，跨域訪問(wèn)的問(wèn)題，服務(wù)器的地址http://127.0.0.1:8080;出于安全考慮，拒絕訪問(wèn); -- >收到這個(gè)錯(cuò)誤; 跨域訪問(wèn)問(wèn)題。

復(fù)制blog代碼，在main.js中的var app = express();后、發(fā)送請(qǐng)求前，添加如下代碼：//設(shè)置跨域訪問(wèn)

1. ?`app.all('*', function(req, res, next) {`2. ?`res.header("Access-Control-Allow-Origin", "*");`3. ?`res.header("Access-Control-Allow-Headers", "X-Requested-With");`4. ?`res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");`5. ?`res.header("X-Powered-By", ' 3.2.1');`6. ?`res.header("Content-Type", "application/json;charset=utf-8");`7. ?`next();`8. ?`});`

三、小結(jié)

1、下載Node.js，GitHub搜索express，使用nodejs安裝express（npm install express）。
2、參考GitHub搭建一個(gè)httpserver。
3、客戶端調(diào)用http.js中的get方法發(fā)送http請(qǐng)求，請(qǐng)求服務(wù)器，得到一個(gè)隨機(jī)數(shù)。