移動電子商務(wù)及應(yīng)用-移動商務(wù)應(yīng)用開發(fā)案例

移動商務(wù)應(yīng)用開發(fā)案例學(xué)習(xí)目標掌握移動商務(wù)網(wǎng)站后端開發(fā)技術(shù)能夠?qū)崿F(xiàn)移動商務(wù)網(wǎng)站的后端數(shù)據(jù)庫連接學(xué)習(xí)內(nèi)容網(wǎng)站后端開發(fā)技術(shù)函數(shù)與函數(shù)傳遞Express應(yīng)用框架后臺數(shù)據(jù)庫訪問學(xué)習(xí)進度

Web后端開發(fā)技術(shù)一個簡單的網(wǎng)站基于模塊的應(yīng)用設(shè)計方法Web開發(fā)的前端與后端網(wǎng)站開發(fā)按適用范圍可分成前端開發(fā)和后端開發(fā)：前端開發(fā)負責(zé)網(wǎng)頁內(nèi)容的設(shè)計和可視化展示，包括需求分析、詳細設(shè)計、美工設(shè)計、靜態(tài)與動態(tài)網(wǎng)頁編程等后端開發(fā)負責(zé)網(wǎng)站后臺邏輯設(shè)計、數(shù)據(jù)處理模型的構(gòu)建等網(wǎng)站前端與后端技術(shù)的分離也是MVC設(shè)計模式的直接反映前端與后端分離的Web開發(fā)方式Web后端的構(gòu)成Web后端可能會采取多種不同的形式，然而其基本原理均是由應(yīng)用程序、文件、數(shù)據(jù)庫三個部分：應(yīng)用程序部分一般包括網(wǎng)頁與Web服務(wù)器文件部分包括各類網(wǎng)頁資源文件數(shù)據(jù)庫提供數(shù)據(jù)的存儲和檢索等能力Web后端開發(fā)編程語言Web前端開發(fā)主要涉及HTML5、JavaScript等，后端開發(fā)可有多種選擇：PHPNode.jsRubyonRailsASP.NETJavaEEPythonNode.js簡介基于ChromeV8引擎（GoogleChrome內(nèi)核）的JavaScript編程語言和運行時環(huán)境使用事件驅(qū)動、非阻塞式I/O的模型Node.js使得服務(wù)端可以像瀏覽器端一樣采用JavaScript進行開發(fā)Node.js應(yīng)用程序運行于單線程中，用戶請求處理無需新建線程Node.js軟件的安裝可訪問http:///download/下載安裝也可直接使用課程資源中的安裝包進行安裝平臺支持：Windows,MacOS,LinuxNode.js軟件的安裝Node.js軟件的安裝完成安裝后，在命令行窗口運行node–v,npm–v能夠獲取版本號則表示安裝成功Node.js應(yīng)用開發(fā)工具有多種用于Node.js的開發(fā)工具WebstormEclipseVisualStudioCodeVisualStudioSublimeTextNotepad++（課程資源中提供安裝包）Windows記事本學(xué)習(xí)進度

Web后端開發(fā)技術(shù)之Node.js

一個簡單的網(wǎng)站基于模塊的應(yīng)用設(shè)計方法一個簡單的Node.js網(wǎng)站創(chuàng)建并保存為hello.js文件一個簡單的Node.js網(wǎng)站可以在命令行窗戶運行nodehello.js（按下Ctrl-C可終止運行）首次運行若防火墻詢問，

選擇允許node應(yīng)用一個簡單的Node.js網(wǎng)站打開瀏覽器，輸入localhost:8888或:8888即可看到結(jié)果簡單網(wǎng)站的構(gòu)成varhttp=require("http");functiononRequest(request,response){

response.writeHead(200,{"Content-Type":"text/plain"});

response.write("HelloWorld");

response.end();}http.createServer(onRequest).listen(8888);//終端打印如下信息console.log('Serverrunningat:8888/');導(dǎo)入http模塊通過http模塊創(chuàng)建http服務(wù)器，監(jiān)控的端口為8888獲取http的請求（request）和響應(yīng)（response），利用response發(fā)送網(wǎng)站對于瀏覽器端的響應(yīng)內(nèi)容Console.log()函數(shù)可用戶打印輸出日志信息學(xué)習(xí)進度

Web后端開發(fā)技術(shù)

一個簡單的網(wǎng)站基于模塊的應(yīng)用設(shè)計方法Node.js模塊系統(tǒng)模塊是Node.js應(yīng)用程序的基本組成部分之前的案例中通過引入http模塊獲得創(chuàng)建Web服務(wù)器的功能

var

http=require("http");

http.createServer(onRequest).listen(8888);一般而言，Node.js文件與模塊直接對應(yīng)這個文件可能是JavaScript代碼、JSON或者編譯過的C/C++擴展基于模塊的應(yīng)用設(shè)計方法程序要加載外部的函數(shù)、對象，就需要引入對應(yīng)的模塊對模塊的使用：引入系統(tǒng)模塊 require(‘系統(tǒng)模塊名’) 引入自定義模塊 require(‘自定義模塊的路徑’)文件內(nèi)的函數(shù)、對象等需要導(dǎo)出才能作為模塊被外部訪問

module.exports=

function()

{

...

...

}

模塊的案例//person.jsfunction

Person()

{

this.setName=

function(theName)

{

this.name=theName;

};

this.sayName

=

function()

{

console.log('Hello'

+

this.name);

};

};

module.exports=

Person;

模塊的案例//

main.jsvar

Person=

require('./person');

var

person=

new

Person();

person.setName('Mike');

person.sayName();console.log(person.name);小結(jié)Node.js采用JavaScript編程語言，是網(wǎng)站后端開發(fā)的利器Node.js依靠模塊來加載各種外部的函數(shù)和對象學(xué)習(xí)內(nèi)容網(wǎng)站后端開發(fā)技術(shù)函數(shù)與函數(shù)傳遞Express應(yīng)用框架后臺數(shù)據(jù)庫訪問學(xué)習(xí)進度函數(shù)與函數(shù)對象

函數(shù)傳遞與匿名函數(shù)重新認識函數(shù)Node.js本質(zhì)是一種JavaScript運行環(huán)境Node.js遵循JavaScript的ECMAScript（ES6）規(guī)范在JavaScript中一切皆對象用function關(guān)鍵字定義函數(shù)，可通過函數(shù)名調(diào)用該函數(shù)在JavaScript解釋執(zhí)行時，函數(shù)實際會被處理為函數(shù)對象（Function）問題的提出在JavaScipt中一切皆對象，這里的對象指的是Object類，所有其它對象的類都繼承自O(shè)bject類要進一步理解函數(shù)與函數(shù)對象，思考以下幾個問題：Node.js、JavaScript中是否就沒有一般意義上的函數(shù)?如果函數(shù)就是面向?qū)ο罄锏念?，是否必須要new這種Function類?重新審視案例代碼此處能否不去new這個Person()?Person()看起來像是一個類的初始化方法，是否它就不是函數(shù)了？Person是引入了外部模塊，它到底是個函數(shù)還是一個類，還是說是一種函數(shù)對象？//person.jsfunction

Person()

{

this.setName=

function(theName)

{

this.name=theName;

};

this.sayName

=

function()

{

console.log('Hello'

+

this.name);

};

};

module.exports=

Person;

//

main.jsvar

Person=

require('./person');

var

person=

new

Person();

person.setName('Mike');

person.sayName();console.log(person.name);二者有區(qū)別嗎？函數(shù)=函數(shù)對象？將案例修改如下//person.jsfunction

Person()

{

this.name='Anonymous';

this.setName=

function(theName)

{

this.name=theName;

};

this.sayName

=

function()

{

console.log('Hello'

+

this.name);

};

console.log(‘thisnameis'+);

};

module.exports=

Person;

//

main.jsvar

Person=

require('./person');Person();console.log('----------------------------------');

console.log(Person);

var

person=

new

Person();

console.log(person);

console.log('----------------------------------');

person.setName('Mike');person.sayName();運行結(jié)果對照//

main.jsvar

Person=

require('./person');Person();console.log(Person);

console.log('----------------------------------');

var

person=

new

Person();

console.log(person);

console.log('----------------------------------');person.setName('Mike');person.sayName();作為函數(shù)運行的時候，Person為Function實例作為函數(shù)對象來運行的時候，Person為對象實例結(jié)果分析兩種運行方式作為函數(shù)（Person()）創(chuàng)建函數(shù)對象（newPerson()）

二者的本質(zhì)都是Function對象this的含義function中this指定的是實例化對象的可訪問屬性通過new創(chuàng)建函數(shù)實例以后，this指定的屬性或方法為公有的public未被this指定的變量屬于局部變量或方法，可以看作是私有的private//person.jsfunction

Person()

{

this.name='Anonymous';

this.setName=

function(theName)

{

this.name=theName;

};

this.sayName

=

function()

{

console.log('Hello'

+

this.name);

};

};

函數(shù)對象小結(jié)引入外部模塊時本質(zhì)上引入的是函數(shù)對象（Function）作為函數(shù)運行時僅僅執(zhí)行了過程，沒有創(chuàng)建函數(shù)對象的實例通過new方法可創(chuàng)建函數(shù)對象的實例函數(shù)中由this引導(dǎo)的變量和方法屬于實例變量和實例方法最初的兩個問題大家現(xiàn)在可自行回答：Node.js、JavaScript中是否就沒有一般意義上的函數(shù)?如果函數(shù)就是面向?qū)ο罄锏念?，是否必須要new這種Function類?學(xué)習(xí)進度深入理解函數(shù)與函數(shù)對象函數(shù)傳遞與匿名函數(shù)函數(shù)傳遞函數(shù)可以作為其它函數(shù)的參數(shù)，稱為函數(shù)傳遞也可以在傳遞參數(shù)時直接定義函數(shù)functionsay(words){console.log(words);}functionexecute(func,value){func(value);}execute(say,“Hello”); //運行結(jié)果：Hello匿名函數(shù)不必先定義函數(shù)，而是直接在另一個函數(shù)中定義和傳遞此函數(shù)functionexecute(func,value){ func(value);}execute(function(words){console.log(words)},"Hello“);//運行結(jié)果：

HelloHTTP服務(wù)器中的函數(shù)傳遞——利用匿名函數(shù)varhttp=

require("http");

http.createServer(function(request,response)

{

response.writeHead(200,

{"Content-Type":

"text/plain"});

response.write("HelloWorld");

response.end();

}).listen(8888);

HTTP服務(wù)器中的函數(shù)傳遞——利用函數(shù)名varhttp=

require("http");

functiononRequest(request,response)

{

response.writeHead(200,

{"Content-Type":

"text/plain"});

response.write("HelloWorld");

response.end();

}http.createServer(onRequest).listen(8888);

函數(shù)傳遞與匿名函數(shù)小結(jié)JavaScript會將函數(shù)處理為函數(shù)對象（Function）引入外部模塊時本質(zhì)上引入的是函數(shù)對象通過new方法創(chuàng)建的是函數(shù)對象的實例函數(shù)中this用于引導(dǎo)實例變量和實例方法函數(shù)傳遞時可以傳遞有名函數(shù)也可傳遞匿名函數(shù)學(xué)習(xí)內(nèi)容網(wǎng)站后端開發(fā)技術(shù)函數(shù)與函數(shù)傳遞Express應(yīng)用框架后臺數(shù)據(jù)庫訪問Express簡介Express是一個簡潔而靈活的Node.jsWeb應(yīng)用框架使用Express可以快速地搭建完整的網(wǎng)站應(yīng)用Express框架提供了路由表處理和動態(tài)HTML頁面渲染等功能安裝Express——安裝指令在命令行窗口中執(zhí)行以下命令來安裝Express框架。安裝前可以將npm的網(wǎng)址換為國內(nèi)鏡像以提高下載效率npmconfigsetregistry

在全局環(huán)境中安裝express-generator即完成Express安裝npminstall-gexpress-generator安裝Express——安裝過程Express開發(fā)案例——項目參數(shù)Express框架的使用可以極大簡化Web應(yīng)用的開發(fā)下面利用Express開發(fā)一個Web應(yīng)用案例，具體參數(shù)設(shè)置如下Web應(yīng)用的目錄

C:\workspaceWeb應(yīng)用的名稱

myapp頁面模板引擎 ejsExpress開發(fā)案例——創(chuàng)建Web應(yīng)用框架的過程在命令行窗口中進行以下操作即可實現(xiàn)Web應(yīng)用框架的構(gòu)建首先進入要創(chuàng)建項目的目錄

cdC:\workspace執(zhí)行命令完成Web應(yīng)用框架的構(gòu)建

expressmyapp進入項目目錄myapp cdmyapp安裝項目的依賴軟件

npminstall啟動演示項目

npmstart

Express開發(fā)案例——創(chuàng)建Web應(yīng)用框架的過程Express開發(fā)案例——運行演示程序完成ExpressWeb應(yīng)用框架的創(chuàng)建后，即可運行其自帶的演示程序Express應(yīng)用框架的構(gòu)成│app.js│package.json│├─bin│www│├─node_modules│├─public│├─images│├─javascripts│└─stylesheets│style.css│├─routes│index.js│users.js│└─viewserror.ejsindex.ejsExpress創(chuàng)建的Web應(yīng)用框架是一種確定模式的文件目錄，其中的子目錄和文件如右圖所示Express應(yīng)用框架的構(gòu)成Express應(yīng)用框架由以下幾個主要模塊構(gòu)成package.json

用于描述項目信息及項目所依賴的庫文件bin/www

用于創(chuàng)建http服務(wù)器并指定訪問端口app.js

用于指定網(wǎng)址的路由、靜態(tài)文件路徑、錯誤處理等信息views/

存放網(wǎng)址路由所對應(yīng)的網(wǎng)頁模板文件public/ 存放CSS、JavaScript、圖片等各類靜態(tài)文件路由技術(shù)Express框架通過URL網(wǎng)址的路由技術(shù)實現(xiàn)對客戶端瀏覽器請求的處理這里指定了兩個路由：/和/users，其中/為網(wǎng)站的默認地址varindexRouter=require('./routes/index');varusersRouter=require('./routes/users');varapp=express();app.use('/',indexRouter);app.use('/users',usersRouter);這種路由的指定告訴我們該網(wǎng)站提供了哪些可訪問的網(wǎng)址:3000 或 localhost:3000:3000/users

或

localhost:3000/users路由技術(shù)通過路由技術(shù)，還可以根據(jù)HTTP請求的GET、POST方法進一步處理復(fù)雜URL地址中的各種參數(shù)以下是默認的Express演示網(wǎng)站中提供的兩個可訪問網(wǎng)址案例設(shè)計下面以Express演示網(wǎng)站為基礎(chǔ)進行案例設(shè)計，需要作出以下調(diào)整。增加一個登錄頁面，網(wǎng)址為:3000/login.html將網(wǎng)站的默認訪問網(wǎng)頁設(shè)置為登錄頁面添加一個系統(tǒng)用戶（用戶名：admin，口令：123456）在網(wǎng)站系統(tǒng)中驗證如果為合法用戶則進入Express歡迎頁面:3000/index.html，否則返回登錄頁面案例開發(fā)為實現(xiàn)以上案例設(shè)計要求，需要調(diào)整以下文件views/login.ejs（新增）routes/login.js

（新增）app.js案例開發(fā)——views/login.ejs案例開發(fā)——routes/login.js案例開發(fā)——app.js案例執(zhí)行登錄頁面若輸入口令錯誤會返回本頁面，正確的用戶名和口令則進入歡迎界面ejs模板的使用案例中的views/login.ejs采用了ejs模板，其設(shè)計方式與正常顯示的網(wǎng)頁相同，但引入了ejs表達式<%=

variable%> <title><%=

title

%></title>routes/login.js文件在頁面渲染時送入該ejs變量title的值 res.render('login',{title:'網(wǎng)站應(yīng)用演示系統(tǒng)'});ejs模板的使用為網(wǎng)站后端服務(wù)器的開發(fā)提供了動態(tài)網(wǎng)頁的支持Express應(yīng)用框架小結(jié)Express應(yīng)用框架可以簡化Web網(wǎng)站應(yīng)用的開發(fā)路由處理及頁面渲染是網(wǎng)站服務(wù)器端實現(xiàn)動態(tài)網(wǎng)頁的基礎(chǔ)ejs模板的設(shè)計以網(wǎng)頁為基礎(chǔ)，增加了ejs表達式路由處理過程應(yīng)根據(jù)需要分別處理HTTPGET和POST請求學(xué)習(xí)內(nèi)容網(wǎng)站后端開發(fā)技術(shù)函數(shù)與函數(shù)傳遞Express應(yīng)用框架后臺數(shù)據(jù)庫訪問網(wǎng)站后臺數(shù)據(jù)庫網(wǎng)站系統(tǒng)往往需要連接后臺數(shù)據(jù)庫，以提供對數(shù)據(jù)的存儲和更新應(yīng)用較多的網(wǎng)站后臺數(shù)據(jù)庫包括MySQL、PostgreSQL、MongoDB等PostgreSQL具有功能強大、方便易用等特點，在網(wǎng)站和系統(tǒng)中得以廣泛應(yīng)用安裝PostgreSQL案例設(shè)計本次案例側(cè)重于演示在Node.js網(wǎng)站中如何使用數(shù)據(jù)庫連接之前的程序在代碼中通過常量保存用戶名與密碼if(req.body['user_name']=='admin'&&req.body['password']=='123456'){r