Transcript DataSnap Thin Client Development

DataSnap XE
開發分散式，
精簡型(Thin Client)
應用系統
Gordon Li
AGENDA
從桌上型, 主從架構到分散式和精簡型應用架構
DataSnap REST 介面
•REST 和 JSON
開發DataSnap XE應用系統
開發分散式客戶端
開發精簡型客戶端
DataSnap認證/授權功能
DataSnap XE伺服器和分散式,精簡型客戶端互動
結論
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
從桌上型, 主從架構到分散式和精簡型應用架構
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
•桌上型應用程式!
•點選即可執行, 沒有系統架構的問題
•仍然需要安裝,
•仍然有許多複雜的檔案
•沒有考慮多人使用的問題
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
•主從架構
•從單純世界進入到複雜世界的代表
•開始出現需要考慮系統架構的問題
•開始出現複雜安裝的問題
•開始出現複雜的系統維護的問題
•開始失去”點選即可執行”的優點
•複雜的系統維護和安裝困擾導致
分散式系統的出現和大量應用
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
•分散式應用系統
•開始於重複使用資訊投資
•打開連結全世界的大門
•開始出現複雜的系統部署問題
•仍然無法”點選即可執行”
•仍然產生複雜的系統維護和安裝困擾
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
• 想想您如何使用Google的?
您搜尋資料, 使用搜尋到的資料. 沒有安裝, 沒有部署, 沒有維護的複雜工作
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
• 記得DOS程式嗎? 真正的精簡型應用架構?
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
Delphi
C++Builder
Build
搜尋, 使用和結束
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
•精簡型應用架構
•第1階 : 精簡型客戶端
•第2階 : 整合移動式客戶端
•第3階 : 像DOS程式一樣, Click and Go, 沒有複雜的安裝問題
•第4階 :像使用Google服務一樣, 搜尋, 使用, 結束,沒有複雜的
安裝問題,沒有複雜的部署問題
Embarcadero Technologies
DataSnap REST 介面
REST 和 JSON
Embarcadero Technologies
JSON (JavaScript Object Notation)
Embarcadero Technologies
JSON (JavaScript Object Notation)
Embarcadero Technologies
JSON (JavaScript Object Notation)
Embarcadero Technologies
JSON (JavaScript Object Notation)
Embarcadero Technologies
Embarcadero Technologies
Embarcadero Technologies
Embarcadero Technologies
Embarcadero Technologies
DataSnap REST 介面
• JSON範例1
Embarcadero Technologies
開發DataSnap XE應用系統
Embarcadero Technologies
開發DataSnap XE應用系統
•DataSnap XE提供了許多重要的新功能
• 可傳遞任何從TObject繼承下來的物件
• 提供Heavy Weight和Light Weight的回叫功能
• 提供認證和授權功能
• 提供JavaScript Framework允許使用JavaScript和DataSnap
Server互動
• 由於支援JavaScript Framework, 因此DataSnap XE可支持
精簡型客戶端的開發
Embarcadero Technologies
開發DataSnap XE應用系統
企業內
主從架構
使用DBX
Android移動手機
使用Android SDK
+JavaScript
移動架構
使用REST/JavaScript
DataSnap/REST
伺服器
企業內/外
主從架構
使用Delphi/BCB REST
Embarcadero Technologies
Web系統
HTTP/HTTPS
REST
開發DataSnap XE應用系統
Java
客戶端
PHP
客戶端
Delphi
客戶端
RoR
客戶端
.NET
客戶端
DataSnap/REST
伺服器
HTML
客戶端
C++Builder
客戶端
Embarcadero Technologies
開發DataSnap XE應用系統
主從架構
Midas/DataSnap
分散式架構
RESTful
分散式架構
精簡型架構
DataSnap/REST
伺服器
Web架構
Embarcadero Technologies
開發DataSnap XE應用系統
• 開發範例DataSnap/REST伺服器
Embarcadero Technologies
開發DataSnap XE應用系統
• 開發範例DataSnap/REST伺服器
Embarcadero Technologies
開發DataSnap XE應用系統
•
•
•
•
•
•
•
•
•
•
•
•
public
{ Public declarations }
destructor Destroy; override;
function EchoString(Value: string): string;
function ReverseString(Value: string): string;
function GetDateInfo : String;
function QuerySeminar : String;
function GetAdminName : String;
function GetUsers : TJSONArray;
function GetAdminPassword : String;
function AddUser(const Name : String) : Boolean;
function DeleteUser(const Name : String) : Boolean;
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
開發分散式客戶端
Embarcadero Technologies
開發分散式客戶端
Embarcadero Technologies
開發分散式客戶端
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
支援Web客戶端
Embarcadero Technologies
開發分散式客戶端
• 如何讓DataSnap/REST伺服器支援HTTP/HTTPS和精簡
型客戶端?
• 目前精簡型客戶端大都使用JavaScript
• 因此DataSnap/REST伺服器必須
1. 支援JavaScript
2. 必須提供可讓客戶端使用JavaScript呼叫DataSnap/REST伺服器提供
的服務
3. 必須能夠動態產生最及時的JavaScript
Embarcadero Technologies
開發分散式客戶端
• 如何讓DataSnap/REST伺服器支援HTTP/HTTPS和精簡
型客戶端?
• 使用TDSHTTPService元件
• 加入HTTP的支援
• 使用TDSHTTPServiceFileDispatcher元件
• 加入HTTP請求分派的支援
• 使用TDSServerMetaDataProvider元件
• 加入提供伺服器資訊的支援, 以便自動產生客戶端連結程式碼
• 使用TDSProxyGenerator元件
• 加入自動產生客戶端連結程式碼的功能
Embarcadero Technologies
開發分散式客戶端
• 設定TDSHTTPService元件特性值
• HttpPort, RESTContext
• 設定TDSHTTPServiceFileDispatcher元件特性值
• RootDirectory, Service, BeforeDispatch Event
• 設定TDSServerMetaDataProvider元件特性值
• Server
• 設定TDSProxyGenerator元件特性值
• MetaDataProvider, TargetDirectory, TargetUnitName, Writer
Embarcadero Technologies
開發分散式客戶端
• 撰寫TDSHTTPServiceFileDispatcher的BeforeDispatch事件處理函式
• procedure TServerContainer5.DSHTTPServiceFileDispatcher1BeforeDispatch(
•
Sender: TObject; const AFileName: string; AContext: TDSHTTPContext;
•
Request: TDSHTTPRequest; Response: TDSHTTPResponse; var Handled: Boolean);
• begin
•
Handled := False;
•
if ((SameFileName(ExtractFileName(AFileName),
DSProxyGenerator1.TargetUnitName)) and
•
•
(not FileExists(AFileName))) then
DSProxyGenerator1.Write;
• end;
Embarcadero Technologies
開發分散式客戶端
1)
增加DataSnap/REST伺服器支援Web
1)
E:\Seminars\03012011Sinter\Demos\SeminarDemoServerWithWebSupport\
pSeminarDemoServerWithWebSupport.dproj
2)
E:\Seminars\03012011Sinter\Demos\ThinClientDemo\
2) 動態產生JavaScript的範例
1)
E:\Seminars\03012011Sinter\Demos\ThinClientDemo\democlean.html
Embarcadero Technologies
開發分散式客戶端
• http://localhost:8087/democlean.html
•加入一行程式碼
• <script type="text/javascript" src="Serverfunctions.js"></script>
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
開發精簡型客戶端
Embarcadero Technologies
ServerFunctionExecutor.js
•
•
•
•
•
•
•
•
•
function ServerFunctionExecutor(className, connectionInfo, owner)
{
this.connectionInfo = connectionInfo;
//if host or port aren't given in the connectionInfo then they are taken from the current URL
this.host = getConnectionHost(connectionInfo);
this.port = getConnectionPort(connectionInfo);
this.dsContext = getDSContext(connectionInfo); //should be empty string, or end with a '/'
this.restContext = getRestContext(connectionInfo); //should be empty string, or end with a '/'
this.cacheContext = getCacheContext(connectionInfo); //must not be empty, defaults to
'cache/'
•
•
•
this.isHttpS = getIsHTTPS(connectionInfo); //true or false
this.className = className;
…
Embarcadero Technologies
開發分散式客戶端
• Base64.js
• function convertStringToBase64(string)
• Connection.js
• function setConnection(host, port, urlPath)
• {
•
connectionInfo = {"host":host,"port":port,"authentication":null,"pathPrefix":urlPath};
• }
• function setCredentials(user, password)
• {
•
•
if (AdminInst != null)
return true; // already logged in
•
connectionInfo.authentication = convertStringToBase64(user + ":" + password);
•
…
• }
Embarcadero Technologies
開發分散式客戶端
1)
精簡型客戶端範例
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
DataSnap認證/授權功能
Embarcadero Technologies
DataSnap認證/授權功能
• DataSnap XE框架支援認證和授權
• 所謂認證是指可連結DataSnap/REST伺服器的使用者
• 而授權則是指每一個登錄和連結的使用者可呼叫的服務
• 例如範例DataSnap/REST伺服器
Embarcadero Technologies
DataSnap認證/授權功能
• 例如範例DataSnap/REST伺服器
• { Public declarations }
• {訪客可呼叫的方法}
• function GetDateInfo : String;
• function QuerySeminar : String;
• {Admin, Gordon可呼叫的方法}
• function GetAdminName : String;
• function GetUsers : TJSONArray;
• function GetAdminPassword : String;
• {只有Gordon可呼叫的方法}
• function AddUser(const Name : String) : Boolean;
• function DeleteUser(const Name : String) : Boolean;
Embarcadero Technologies
DataSnap認證/授權功能
• 如何傳遞使用者登錄資訊
• TDSAuthenticationManage元件
• 如何驗證使用者
• OnUserAuthenticate
• OnUserAuthorize
• 如何授權使用者可呼叫的方法
• TDSAuthorizationEvent = procedure(Sender: TObject; AuthorizeEventObject:
TDSAuthorizeEventObject; var valid: boolean) of object;
Embarcadero Technologies
DataSnap認證/授權功能
• 如何驗證使用者
• 使用程式碼
• 使用IDE的Object Inspector 和特性值編譯器
• 使用Delphi程式語言的Annotation
Embarcadero Technologies
DataSnap認證/授權功能
• 如何驗證使用者
• 使用程式碼
•藉由OnUserAuthenticate事件處理函式驗證使用者並且設
定使用者群組
•藉由OnUserAuthorize事件處理函式來判斷是那一個使用
者群組想呼叫什麼方法來決定是否允許呼叫
Embarcadero Technologies
DataSnap認證/授權功能
•DataSnap認證範例
• OnUserAuthenticate事件處理函式
•DataSnap 授權範例
• OnUserAuthorize事件處理函式
Embarcadero Technologies
從桌上型, 主從架構到分散式和精簡型應用架構
如何在客戶端傳遞登入資訊
Embarcadero Technologies
DataSnap認證/授權功能
•
•
•
•
•
•
•
•
002
var
003
prop : TDBXDatasnapProperties;
004
aServer : TServerMethods5Client;
005
cm : TClientModule1;
006
begin
007
cm := TClientModule1.Create(nil);
008
try
009
cm.sqlcnDataSnapServer.ConnectionData.Properties.Values[TDBXPropertyNames.DSAuthenticationUser]
:= edtUserName.Text;
• 010
cm.sqlcnDataSnapServer.ConnectionData.Properties.Values[TDBXPropertyNames.DSAuthenticationPass
word] := edtPassword.Text;
•
•
•
•
•
•
011
aServer := cm.ServerMethods5Client;
012
aServer.AddArticle(edtAddedArticleName.Text, mmHeadline.Text);
013
014
015
016
finally
cm.Free;
end;
end;
Embarcadero Technologies
精簡客戶端認證/授權範例
•
•
•
•
•
•
function callServer()
{
var user = document.getElementById("edtName").value;
var password = document.getElementById("edtPassword").value;
var auth = convertStringToBase64(user + ":" + password);
var connectionInfo = {"authentication":auth};
•
•
var server = new TServerMethods5(connectionInfo);
•
•
•
•
•
•
•
•
if(result != null)
•
document.getElementById("mmCallback").value
= resultId;Technologies
Embarcadero
var result = server.QuerySeminar();
{
var resultId = result.result;
}
else
{
var resultId = result.toJSONString();
}
從桌上型, 主從架構到分散式和精簡型應用架構
DataSnap XE伺服器和分散式,精簡型客戶端互動
Embarcadero Technologies
DataSnap XE伺服器和分散式,精簡型客
戶端互動
• 由於DataSnap XE支援JavaScript, 因此可藉由動態產生的JavaScript讓其他
Web客戶端結合
• 結合PHP的範例
Embarcadero Technologies
Q&A