Wakanda#3

Shibuya, Tokyo
Wakanda
勉強会 #3
2013-08-20
presented by

Shibuya, Tokyo
.../Executing-Code-on-the-Server.300-575371.ja.html
agenda
remote procedure call

Shibuya, Tokyo
agenda
JSON-RPC HttpRequestHandler Datastore
タイプサービスリクエストハンドラークラスメソッド
再起動不要 no yes no
クライアント JavaScript HTTP JavaScript

Shibuya, Tokyo
JSON-RPC

Shibuya, Tokyo
.../About-JSON-RPC-Services-in-Wakanda.300-306542.ja.html
JSON-RPC
wakanda application framework
browsers server
NoSQL object datastore
+
web server
+
Server Side JavaScript
client Side JavaScript
+
WAF: datasource (widgets)
+
WAF: dataprovider (REST)

Shibuya, Tokyo
JSON-RPC
no framework
browsers server
+
web server
+

Shibuya, Tokyo
JSON-RPC
browsers server
+
web server
+
JSON-RPC
http://en.wikipedia.org/wiki/JSON-RPC

Shibuya, Tokyo
JSON-RPC
browsers server
+
web server
+
JSON-RPC
{"method": "echo", "params":
["Hello JSON-RPC"], "id": 1}

Shibuya, Tokyo
JSON-RPC
browsers server
+
web server
+
JSON-RPC
{"method": "echo", "params":
["Hello JSON-RPC"], "id": 1}
{"result": "Hello JSON-RPC",
"error": null, "id": 1}

Shibuya, Tokyo
JSON-RPC
browsers server
+
web server
+
JSON-RPC
commonJS
http://www.commonjs.org/

Shibuya, Tokyo
commonJS
場所: {projectFolder}/Modules/myRPC.JS (サブフォルダーでも良い)
構成: 1 ﬁle/module, n functions/module
javascript: not just for browsers any more!
http://www.commonjs.org/specs/modules/1.0/
戻り値: 必須 (null, ""でも良い)
アクセス権: module毎, function毎
JSON-RPC
.../Configuring-CommonJS-Modules-for-RPC.300-306585.ja.html

Shibuya, Tokyo
commonJS
regular
function add (a, b) {
return (a + b);
}
exports.add = function add (a, b) {
return (a + b);
};
commonJS
JSON-RPC

Shibuya, Tokyo
commonJS
var notExposedVar = 'foo';
exports.CONSTANT_1 = 'hello';
return (a + b);
};
Modules/myRPC.js
notExposedVarはエクスポートされない
【参考】
JSON-RPC

Shibuya, Tokyo
commonJS
require('myRPC').add();
他のサーバーサイドJavaScriptからモジュールを呼び出すとき
var notExposedVar = 'foo';
exports.CONSTANT_1 = 'hello';
return (a + b);
};
Modules/myRPC.js
【参考】
JSON-RPC

Shibuya, Tokyo
Configuring-CommonJS-Modules-for-RPC.300-306585.ja.html
JSON-RPC

Shibuya, Tokyo
Set as RPC
<?xml version="1.0" encoding="UTF-8"?>
<permissions>
<allow type="module" resource="myRPC" action="executeFromClient"/>
</permissions>
{projectFolder}/permissions.waPerm
JSON-RPC

Shibuya, Tokyo
.../Assigning-Group-Permissions.200-725897.ja.html
permission
attribute value remarks
type
module
funtion
resource
modulePath
modulePath/funtionName
action
executeFromClient
promote
promote: アクセス権を昇格して実行
groupID group UUID default: no authentication
JSON-RPC

Shibuya, Tokyo
JSON-RPC

Shibuya, Tokyo
{projectFolder}/{projectName}/.waSettings
publish
<?xml version="1.0" encoding="UTF-8"?>
<settings>
<project/>
<http/>
<service name="webApp" modulePath="services/webApp" enabled="true"
autoStart="true"/>
<service name="rpc" modulePath="services/rpc" enabled="true" autoStart="true"
proxyPattern="^/rpc-proxy/" publishInClientGlobalNamespace="false"/>
<service name="dataStore" modulePath="services/dataStore" enabled="true"
autoStart="true"/>
<service name="upload" modulePath="services/upload" enabled="true"
autoStart="true"/>
<service name="Git HTTP Service" modulePath="services/waf-git/waf-GitService"
enabled="true"/>
<resources/>
<javaScript/>
</settings>
JSON-RPC

Shibuya, Tokyo
namespace
index.waPage/index.html
<meta name="WAF.config.rpc.file" content="rpc-proxy/myRPC?namespace=myRPC"/>
<script type="text/javascript" src="/rpc-proxy/myRPC?namespace=myRPC">
</script>
any html
デフォルト名前空間: RPCモジュール.jsのファイル名
JSON-RPC

Shibuya, Tokyo
namespace
syntax#1
var mathTools = {
    sine : function () {},
    cos : function () {},
    atan : function () {}
};
var mathTools = {};
mathTools.sine= function () {};
mathTools.cos = function () {};
mathTools.atan = function () {};
syntax#2
【参考】
JSON-RPC

Shibuya, Tokyo
.../Calling-Methods-from-the-Client-Side.300-306631.ja.html
button1.click = function button1_click (event)
synchronous call
try {
{
var a = $$('textField1').getValue();
var b = $$ ('textField2').getValue();
var result = myRPC.add(a,b);
$$('richText1').setValue(result);
}catch (e) {
console.log(e.message);
}
JSON-RPC

Shibuya, Tokyo
.../Using-JSON-RPC-Services/Error-Handling.300-306655.ja.html
try {
{
} catch (e) {
console.log(e.message);
}
e.code: エラーコード
e.message: エラーメッセージ
error handling
JSON-RPC

Shibuya, Tokyo
error handling
code message remarks
-32601 Method not found
-32603 Internal error while... throw: カスタムエラー
JSON-RPC

Shibuya, Tokyo
try {
{
} catch (e) {
console.log(e.data);
}
e.code: エラーコード
e.message: エラーメッセージ
error handling
e.data: エラーメッセージオブジェクト
JSON-RPC

Shibuya, Tokyo
Modules/myRPC.js
" if ((a.length) && (b.length))
return (a + b);
" else
" " throw new UserException("Arguments can't be empty.", 1);
};
function UserException(message, code) {
this.moduleName = "myRPC";
this.message = message;
this.code = code;
};
error handling
JSON-RPC

Shibuya, Tokyo
asynchronous call
{
myRPC.addAsync(
" function (result) {$$('richText1').setValue(result);}, $$
('textField1').getValue(), $$('textField2').getValue());
}
JSON-RPC

Shibuya, Tokyo
asynchronous call
{
myRPC.addAsync(
}
Async: 非同期モードRPCのsuﬃx
JSON-RPC

Shibuya, Tokyo
asynchronous call
{
myRPC.addAsync(
}
コールバックメソッド（成功時のみ）
JSON-RPC

Shibuya, Tokyo
asynchronous call
{
myRPC.addAsync(
}
コールバックメソッド（成功時のみ）
パラメーター（そのまま列挙）
JSON-RPC

Shibuya, Tokyo
asynchronous call
{
var result = myRPC.addAsync({
'onSuccess': function (result) {
},
'onError': function (error) {
}," "
'params': [$$('textField1').getValue(), $$('textField2').getValue()]
});
}
JSON-RPC

Shibuya, Tokyo
asynchronous call
{
},
}," "
});
}
コールバックメソッド（成功時，失敗時）
JSON-RPC

Shibuya, Tokyo
asynchronous call
{
},
}," "
});
}
パラメーター（配列）
コールバックメソッド（成功時，失敗時）
JSON-RPC

Shibuya, Tokyo
synchronous call
JSON-RPC

Shibuya, Tokyo
plain.html
<!DOCTYPE html>
<html>
<head>
<title>plain</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
" " <script type="text/javascript" src="/rpc-proxy/myRPC?namespace=myRPC"></script>
</head>
<body>
<h1>
" " " <input type="text" id="textInput1" value="Hello " ></input>
" " " <input type="text" id="textInput2" value="World!! " ></input>
" " " <button onclick="document.getElementById('textInput3').value =
myRPC.add(document.getElementById('textInput1').value,
document.getElementById('textInput2').value);">myRPC.add()</button>
" " " <input type="text" id="textInput3" readOnly="true" ></input>
</h1>
</body>
</html>
synchronous call
JSON-RPC

Shibuya, Tokyo
.../Executing-Code-on-the-Server.300-575371.en.html
HTTP request handler

Shibuya, Tokyo

Shibuya, Tokyo
.../HTTP/HTTP.200-803294.ja.html
browsers server
+
web server
+
no framework

Shibuya, Tokyo
browsers server
+
web server
+
HTTP client
no JavaScript

Shibuya, Tokyo
browsers server
+
web server
+
HTTP client
no server restart

Shibuya, Tokyo
.../Global-Application/Application/addHttpRequestHandler.301-636268.ja.html
addHttpRequestHandler(
'(?i)^/demo$',
'myRequestHandler.js',
'do_demo'
);
add handler

Shibuya, Tokyo
'(?i)^/demo$',
'do_demo'
);
リクエストURLパターン: ICU正規表現
add handler
http://www.icu-project.org/userguide/regexp.html

Shibuya, Tokyo
'(?i)^/demo$',
'do_demo'
);
add handler
ファイル名

Shibuya, Tokyo
'(?i)^/demo$',
'do_demo'
);
add handler
関数名
ファイル名

Shibuya, Tokyo
.../Introduction-to-HTTP-Request-Handlers.200-803294.ja.html

Shibuya, Tokyo
.../Introduction-to-HTTP-Request-Handlers.200-803294.ja.html
function do_demo(request, response) {
return "Hello world";
}
handler function

Shibuya, Tokyo
.../HTTP-Request-Handlers/HTTPRequest.201-803366.ja.html
HTTPRequest
body- String | Image | Blob requestLine- String isSSL- Boolean
contentType- String url- String
method- String rawURL- String parts- MIMEMessage
host- String urlPath- String headers- HTTPRequestHeader
version- String urlQuery- String
user- String remoteAddress - String remotePort- Number
password- String localAddress- String localPort- Number

Shibuya, Tokyo
.../HTTP-Request-Handlers/HTTPResponse.201-805902.ja.html
HTTPResponse
body- String | Image | Blob requestLine- String isSSL- Boolean
contentType- String url- String
method- String rawURL- String parts- MIMEMessage
host- String urlPath- String headers- HTTPRequestHeader
version- String urlQuery- String statusCode- Number
user- String remoteAddress - String remotePort- Number
password- String localAddress- String localPort- Number
allowCache() allowCompression()

Shibuya, Tokyo
datastore class method

Shibuya, Tokyo
.../Using-Datastore-Class-Methods.200-878615.ja.html

Shibuya, Tokyo

Shibuya, Tokyo
scope
client server derived class class
public OK OK OK OK
public on server OK OK OK
protected OK OK
private OK

Shibuya, Tokyo
datasource
var result = sources.myClass.myMethod();
dataSource名の大文字/小文字に注意

Shibuya, Tokyo
dataprovider
var result =ds.MyClass.myMethod();
class名の大文字/小文字に注意

Shibuya, Tokyo
datasource/dataprovider

Shibuya, Tokyo
.../HTTP-REST/Manipulating-Data/datastoreClassmethod.303-814342.ja.html
REST
GET http://127.0.0.1:8081/rest/MyClass/myMethod
POST http://127.0.0.1:8081/rest/MyClass/myMethod

Shibuya, Tokyo
REST
GET http://127.0.0.1:8081/rest/MyClass/myMethod
class, method名の大文字/小文字に注意

Shibuya, Tokyo
REST
GET http://127.0.0.1:8081/rest/MyClass/myMethod(a,b,c)
body: [a,b,c]

Shibuya, Tokyo
REST
GET http://127.0.0.1:8081/rest/MyClass/myMethod(a,b,c)
body: [a,b,c]
{"result":"abc"}

Wakanda#3

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (7)

Mehr von kmiyako

Mehr von kmiyako (20)

Wakanda#3