SlideShare a Scribd company logo
Azure で Serverless
初心者向けタッチ&トライ(公開版)
2019.5.29 @de:code 2019
Serverless Community
Serverlessとは?
Azure で Serverless 初心者向けタッチ&トライ
Azure Functions
...?
Durable Functions
• Azure Functions extension
• Enables long-running, stateful serverless operations
• Write complex function orchestrations in a single function
• Built on the open-source Durable Task Framework
• Only pay when your code is running
• Orchestrator replays itself to re-establish state every run
Durable Patterns
Function chaining Fan-out / fan-in
Event aggregation
Extended Status Monitoring
http
Async HTTP APIs
Human interaction / timeout
タッチ&トライ
作成するもの
Orchestration Client
(HttpStart)
Orchestrator
(OrchestratorFunction)
Activity Function
(E1_SayHello)
流れ
1. Visual Studio Code にAzure Functions 拡張機能をインストール
2. Azure Functions プロジェクトを作成
3. Durable Functions npm パッケージをインストール
4. starter 関数を作成
5. オーケストレーター関数を作成する
6. アクティビティ関数を作成する
7. Azure へのサインイン
8. Azure にプロジェクトを発行
9. Azure で関数をテスト
1. Azure Functions 拡張機能をインストール
• Visual Studio Code で [拡張機能] を開き、azure functions を検索するか、Visual
Studio Code でこのリンクを開きます。
• [インストール] を選択して、Visual Studio Code に拡張機能をインストールします。
• Visual Studio Code を再起動し、アクティビティ バーの Azure アイコンを選択しま
す。 サイド バーに Azure Functions 領域が表示されます。
1. Azure Functions 拡張機能をインストール
• Visual Studio Code で、Azure ロゴを選択して [Azure:Functions] 領域を表示し、[新し
いプロジェクトの作成] アイコンを選択します。
• プロジェクト ワークスペースの場所としてデスクトップの「 demo 」のフォルダを選択
し、[選択] をクリックします。
2. Azure Functions プロジェクトを作成
• 関数アプリ プロジェクトの言語は「JavaScript」を選択します。
• 「V2」を選択します。
• 「Skip for now」を選択します。
2. Azure Functions プロジェクトを作成
• 「Open in current window」を選択します。
2. Azure Functions プロジェクトを作成
3. Durable Functions npm パッケージをインストール
• VS Codeでターミナルを開き、ワークスペース用のフォルダ「demo」で「npm install
durable-functions」 を実行して、durable-functions npm パッケージをインストール
します。
※npmがインストールされていない場合は、事前にnpmをPCにインストールします
4. starter 関数を作成
• [Azure:Functions] で [関数の作成] アイコンを選択します。
• 関数アプリ プロジェクトが含まれたフォルダーを選択し、[HTTP trigger] 関数テンプレート
を選択します。
• 関数名として「HttpStart」と入力して Enter キーを押し、[Anonymous] 認証を選択します。
4. starter 関数を作成
• index.js を以下の JavaScript に置き換えます。
const df = require("durable-functions");
module.exports = async function (context, req) {
const client = df.getClient(context);
const instanceId = await client.startNew(req.params.functionName, undefined, req.body);
context.log(`Started orchestration with ID = '${instanceId}'.`);
return client.createCheckStatusResponse(context.bindingData.req, instanceId);
};
4. starter 関数を作成
• function.json を以下の JavaScript に置き換えます。
{
"bindings": [
{
"authLevel": "anonymous",
"name": "req",
"type": "httpTrigger",
"direction": "in",
"route": "orchestrators/{functionName}",
"methods": ["get", "post"]
},
{
"name": "starter",
"type": "orchestrationClient",
"direction": "in"
}
]
}
Orchestration Client
(HttpStart)
Orchestrator
(OrchestratorFunction)
Activity Function
(E1_SayHello)
{
"bindings": [
{
"authLevel": "anonymous",
"name": "req",
"type": "httpTrigger",
"direction": "in",
"route": "orchestrators/{functionName}",
"methods": ["get", "post"]
},
{
"name": "starter",
"type": "orchestrationClient",
"direction": ”in"
}
]
}
const df = require("durable-functions");
module.exports = async function (context, req) {
const client = df.getClient(context);
const instanceId = await client.startNew(req.params.functionName,
undefined, req.body);
context.log(`Started orchestration with ID = '${instanceId}'.`);
return client.createCheckStatusResponse(context.bindingData.req,
instanceId);
};
index.js
function.json
5. オーケストレーター関数を作成
• 前の手順を繰り返し、HTTP Trigger Templateを使用して 2 つ目の関数を作成しま
す。 今回は関数に 「 OrchestratorFunction」 と名前を付けます。
• index.js を以下の JavaScript に置き換えます。
const df = require("durable-functions");
module.exports = df.orchestrator(function*(context){
context.log("Starting chain sample");
const output = [];
output.push(yield context.df.callActivity("E1_SayHello", "Tokyo"));
output.push(yield context.df.callActivity("E1_SayHello", "Seattle"));
output.push(yield context.df.callActivity("E1_SayHello", "London"));
return output;
});
5. オーケストレーター関数を作成
• function.json を以下の JavaScript に置き換えます。
{
"bindings": [
{
"name": "context",
"type": "orchestrationTrigger",
"direction": "in"
}
]
}
Orchestration Client
(HttpStart)
Orchestrator
(OrchestratorFunction)
Activity Function
(E1_SayHello)
{
"bindings": [
{
"authLevel": "anonymous",
"name": "req",
"type": "httpTrigger",
"direction": "in",
"route": "orchestrators/{functionName}",
"methods": ["get", "post"]
},
{
"name": "starter",
"type": "orchestrationClient",
"direction": ”in"
}
]
}
const df = require("durable-functions");
module.exports = async function (context, req) {
const client = df.getClient(context);
const instanceId = await client.startNew(req.params.functionName,
undefined, req.body);
context.log(`Started orchestration with ID = '${instanceId}'.`);
return client.createCheckStatusResponse(context.bindingData.req,
instanceId);
};
const df = require("durable-functions");
module.exports = df.orchestrator(function*(context){
context.log("Starting chain sample");
const output = [];
output.push(yield context.df.callActivity("E1_SayHello", "Tokyo"));
output.push(yield context.df.callActivity("E1_SayHello", "Seattle"));
output.push(yield context.df.callActivity("E1_SayHello", "London"));
return output;
});
{
"bindings": [
{
"name": "context",
"type": "orchestrationTrigger",
"direction": "in"
}
]
}
index.js
function.json
6. アクティビティ関数を作成
• 前の手順を繰り返し、HTTP Trigger Templateを使用して 2 つ目の関数を作成しま
す。 今回は関数に 「 E1_SayHello 」 と名前を付けます。
• index.js を以下の JavaScript に置き換えます。
module.exports = async function(context) {
return `Hello ${context.bindings.name}!`;
};
6. アクティビティ関数を作成
• function.json を以下の JavaScript に置き換えます。
{
"bindings": [
{
"name": "name",
"type": "activityTrigger",
"direction": "in"
}
]
}
Orchestration Client
(HttpStart)
Orchestrator
(OrchestratorFunction)
Activity Function
(E1_SayHello)
{
"bindings": [
{
"authLevel": "anonymous",
"name": "req",
"type": "httpTrigger",
"direction": "in",
"route": "orchestrators/{functionName}",
"methods": ["get", "post"]
},
{
"name": "starter",
"type": "orchestrationClient",
"direction": ”in"
}
]
}
const df = require("durable-functions");
module.exports = async function (context, req) {
const client = df.getClient(context);
const instanceId = await client.startNew(req.params.functionName,
undefined, req.body);
context.log(`Started orchestration with ID = '${instanceId}'.`);
return client.createCheckStatusResponse(context.bindingData.req,
instanceId);
};
const df = require("durable-functions");
module.exports = df.orchestrator(function*(context){
context.log("Starting chain sample");
const output = [];
output.push(yield context.df.callActivity("E1_SayHello", "Tokyo"));
output.push(yield context.df.callActivity("E1_SayHello", "Seattle"));
output.push(yield context.df.callActivity("E1_SayHello", "London"));
return output;
});
{
"bindings": [
{
"name": "context",
"type": "orchestrationTrigger",
"direction": "in"
}
]
}
module.exports = async function(context) {
return `Hello ${context.bindings.name}!`;
};
{
"bindings": [
{
"name": "name",
"type": "activityTrigger",
"direction": "in"
}
]
}
index.js
function.json
7. Azure へのサインイン
• [Azure: Functions] 領域で、[Sign in to Azure...](Azure にサインインする...) を選択し
ます。
※Azure アカウントがない場合は無償アカウントを作成して下さい
https://azure.microsoft.com/ja-jp/free/
8. Azure にプロジェクトを発行
• [Azure: Functions] 領域で、[Deploy to Function App](関数アプリにデプロイ) アイコ
ンを選択します。
8. Azure にプロジェクトを発行
• [サブスクリプションを選択] してから、 [+ Create New Function App in Azure](+
Azure で新しい Function App を作成) を選択します。
8. Azure にプロジェクトを発行
• 「Deploy」を選択します。
9. Azure で関数をテスト
• ブラウザでオーケストラーの情報を確認します。
https://<function名>.azurewebsites.net/api/orchestrators/OrchestratorFunction
出力結果例:
{
"id": "a42bfdf91f9a49da9c9558e2ef5c7a65",
"statusQueryGetUri": "https://decode-
horike.azurewebsites.net/runtime/webhooks/durabletask/instances/a42bfdf91f9a49da9c9558e2ef5c7a65?taskHub
=DurableFunctionsHub&connection=Storage&code=BId08/uK/2jAhDKF3bNjgNPzJGdGfcalR3dlm6PJyate/aG/rtHZ
VA==",
"sendEventPostUri": "https://decode-
horike.azurewebsites.net/runtime/webhooks/durabletask/instances/a42bfdf91f9a49da9c9558e2ef5c7a65/raiseEve
nt/{eventName}?taskHub=DurableFunctionsHub&connection=Storage&code=BId08/uK/2jAhDKF3bNjgNPzJGdGfc
alR3dlm6PJyate/aG/rtHZVA==",
・・・・
9. Azure で関数をテスト
• 前ページのstatusQueryGetUri をブラウザのURLにコピペし、オーケストラーの状態を
確認します。
出力結果例:
{
"instanceId": "6fa01dd927a245229cff60e9596d01ee",
"runtimeStatus": "Completed",
"input": null,
"customStatus": null,
"output": [
"Hello Tokyo!",
"Hello Seattle!",
"Hello London!"
],
"createdTime": "2019-05-28T14:10:02Z",
"lastUpdatedTime": "2019-05-28T14:10:02Z"
}
Orchestration Client
(HttpStart)
Orchestrator
(OrchestratorFunction)
Activity Function
(E1_SayHello)
{
"bindings": [
{
"authLevel": "anonymous",
"name": "req",
"type": "httpTrigger",
"direction": "in",
"route": "orchestrators/{functionName}",
"methods": ["get", "post"]
},
{
"name": "starter",
"type": "orchestrationClient",
"direction": ”in"
}
]
}
const df = require("durable-functions");
module.exports = async function (context, req) {
const client = df.getClient(context);
const instanceId = await client.startNew(req.params.functionName,
undefined, req.body);
context.log(`Started orchestration with ID = '${instanceId}'.`);
return client.createCheckStatusResponse(context.bindingData.req,
instanceId);
};
const df = require("durable-functions");
module.exports = df.orchestrator(function*(context){
context.log("Starting chain sample");
const output = [];
output.push(yield context.df.callActivity("E1_SayHello", "Tokyo"));
output.push(yield context.df.callActivity("E1_SayHello", "Seattle"));
output.push(yield context.df.callActivity("E1_SayHello", "London"));
return output;
});
{
"bindings": [
{
"name": "context",
"type": "orchestrationTrigger",
"direction": "in"
}
]
}
module.exports = async function(context) {
return `Hello ${context.bindings.name}!`;
};
{
"bindings": [
{
"name": "name",
"type": "activityTrigger",
"direction": "in"
}
]
}
index.js
function.json
Appendix
無償アカウントの作成
• https://azure.microsoft.com/ja-jp/free/
チュートリアル
• 今回のタッチアンドトライは公式のチュートリアルをベースにしています。
JavaScript で最初の Durable Functions を作成する
https://docs.microsoft.com/ja-jp/azure/azure-functions/durable/quickstart-js-vscode
Functions Appの前処理
• Durable Functions ExtensionをPortalからInstallします。
• 「Durable Functions HTTP starter」をクリックし「Install」を作成します。
• Installが終わり次第「Cancel」します。
ローカル開発環境
• ローカルでの開発、テストを行うにはセットアップが必要です
Azure Functions V2 を Mac+VSCode で動かすまでの手順
https://qiita.com/miyake/items/83aac5524be91e3811ee
Functionsがサポートするバインディング
Type 1.x 2.x1 トリガー 入力 Output
Blob Storage ✔ ✔ ✔ ✔ ✔
Cosmos DB ✔ ✔ ✔ ✔ ✔
Event Grid ✔ ✔ ✔
Event Hubs ✔ ✔ ✔ ✔
HTTP と Webhooks ✔ ✔ ✔ ✔
Microsoft Graph Excel テーブル ✔ ✔ ✔
Microsoft Graph OneDrive ファイル ✔ ✔ ✔
Microsoft Graph Outlook メール ✔ ✔
Microsoft Graph Events ✔ ✔ ✔ ✔
Microsoft Graph Auth トークン ✔ ✔
Mobile Apps ✔ ✔ ✔
Notification Hubs ✔ ✔
Queue Storage ✔ ✔ ✔ ✔
SendGrid ✔ ✔ ✔
Service Bus ✔ ✔ ✔ ✔
SignalR ✔ ✔ ✔
Table Storage ✔ ✔ ✔ ✔
Timer ✔ ✔ ✔
Twilio ✔ ✔ ✔
https://docs.microsoft.com/ja-jp/azure/azure-functions/functions-triggers-bindings#supported-bindings

More Related Content

PDF
ソーシャルアプリ勉強会(第一回資料)配布用
PPTX
Selenium webdriver使ってみようず
PPTX
Develop Web Application with Node.js + Express
PPTX
Selenium 触ってみよう
PDF
10分で作る Node.js Auto Scale 環境 with CloudFormation
PDF
Backbone.js
PDF
Node.js勉強会 Framework Koa
PDF
PHP 2大 web フレームワークの徹底比較!
ソーシャルアプリ勉強会(第一回資料)配布用
Selenium webdriver使ってみようず
Develop Web Application with Node.js + Express
Selenium 触ってみよう
10分で作る Node.js Auto Scale 環境 with CloudFormation
Backbone.js
Node.js勉強会 Framework Koa
PHP 2大 web フレームワークの徹底比較!

What's hot (19)

PPTX
EWD 3トレーニングコース#33 ewd-xpressアプリケーションからREST/Webサービスにアクセスする
PDF
JavaScript/CSS 2015 Autumn
PDF
Pro aspnetmvc3framework chap19
PPTX
EWD 3トレーニングコース#33 ewd-xpressアプリケーションからREST/Webサービスにアクセスする
PPTX
Selenium webdriver使ってみようず
PDF
アップルのテンプレートは有害と考えられる
PDF
iOSビヘイビア駆動開発
PDF
自作node.jsフレームワークとnginxを使ってラジオサイトを作ってみた
PDF
JavaScriptCore.framework の普通な使い方 #cocoa_kansai
PDF
sbt, past and future / sbt, 傾向と対策
PDF
swooleを試してみた
PDF
SlackのIncomingWebhooksとOutgoingWebhooksを使って電子工作と連携させてみよう
PDF
PDF
Introduction of aws-cli
PPTX
HTML5&API総まくり
PPTX
FIWARE Orion Context Broker コンテキスト情報管理 (Orion 3.5.0対応)
PDF
Elasticsearchの基本動作まとめ
PDF
思ったほど怖くない! Haskell on JVM 超入門 #jjug_ccc #ccc_l8
PPTX
HTML5最新動向
EWD 3トレーニングコース#33 ewd-xpressアプリケーションからREST/Webサービスにアクセスする
JavaScript/CSS 2015 Autumn
Pro aspnetmvc3framework chap19
EWD 3トレーニングコース#33 ewd-xpressアプリケーションからREST/Webサービスにアクセスする
Selenium webdriver使ってみようず
アップルのテンプレートは有害と考えられる
iOSビヘイビア駆動開発
自作node.jsフレームワークとnginxを使ってラジオサイトを作ってみた
JavaScriptCore.framework の普通な使い方 #cocoa_kansai
sbt, past and future / sbt, 傾向と対策
swooleを試してみた
SlackのIncomingWebhooksとOutgoingWebhooksを使って電子工作と連携させてみよう
Introduction of aws-cli
HTML5&API総まくり
FIWARE Orion Context Broker コンテキスト情報管理 (Orion 3.5.0対応)
Elasticsearchの基本動作まとめ
思ったほど怖くない! Haskell on JVM 超入門 #jjug_ccc #ccc_l8
HTML5最新動向
Ad

Similar to Azure で Serverless 初心者向けタッチ&トライ (20)

PDF
初めての Data api
PDF
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
PDF
OpenStack API
PDF
初めての Data api cms どうでしょう - 大阪夏の陣
PDF
Data api workshop at Co-Edo
PDF
サーバーレスの常識を覆す Azure Durable Functionsを使い倒す
PDF
初めての Data API CMS どうでしょう - 仙台編 -
PPTX
エンタープライズ分野での実践AngularJS
PDF
Knockout.js を利用したインタラクティブ web アプリケーション開発
PDF
Infrastructure as code for azure
PDF
Data apiで実現 進化するwebの世界
PDF
Twitter連携chrome extension作り方
PPTX
「Windows 8 ストア アプリ開発 tips」 hokuriku.net vol.11 (2013年1月26日)
PDF
Ajax 応用
PDF
Tech talk salesforce mobile sdk
PDF
Building React, Flutter and Blazor development and debugging environment with...
PPTX
13016 n分で作るtype scriptでnodejs
PDF
ScaLa+Liftとか
PDF
densan2014-late01
PDF
実践 NestJS
初めての Data api
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
OpenStack API
初めての Data api cms どうでしょう - 大阪夏の陣
Data api workshop at Co-Edo
サーバーレスの常識を覆す Azure Durable Functionsを使い倒す
初めての Data API CMS どうでしょう - 仙台編 -
エンタープライズ分野での実践AngularJS
Knockout.js を利用したインタラクティブ web アプリケーション開発
Infrastructure as code for azure
Data apiで実現 進化するwebの世界
Twitter連携chrome extension作り方
「Windows 8 ストア アプリ開発 tips」 hokuriku.net vol.11 (2013年1月26日)
Ajax 応用
Tech talk salesforce mobile sdk
Building React, Flutter and Blazor development and debugging environment with...
13016 n分で作るtype scriptでnodejs
ScaLa+Liftとか
densan2014-late01
実践 NestJS
Ad

Azure で Serverless 初心者向けタッチ&トライ

  • 5. Durable Functions • Azure Functions extension • Enables long-running, stateful serverless operations • Write complex function orchestrations in a single function • Built on the open-source Durable Task Framework • Only pay when your code is running • Orchestrator replays itself to re-establish state every run
  • 6. Durable Patterns Function chaining Fan-out / fan-in Event aggregation Extended Status Monitoring http Async HTTP APIs Human interaction / timeout
  • 9. 流れ 1. Visual Studio Code にAzure Functions 拡張機能をインストール 2. Azure Functions プロジェクトを作成 3. Durable Functions npm パッケージをインストール 4. starter 関数を作成 5. オーケストレーター関数を作成する 6. アクティビティ関数を作成する 7. Azure へのサインイン 8. Azure にプロジェクトを発行 9. Azure で関数をテスト
  • 10. 1. Azure Functions 拡張機能をインストール • Visual Studio Code で [拡張機能] を開き、azure functions を検索するか、Visual Studio Code でこのリンクを開きます。 • [インストール] を選択して、Visual Studio Code に拡張機能をインストールします。
  • 11. • Visual Studio Code を再起動し、アクティビティ バーの Azure アイコンを選択しま す。 サイド バーに Azure Functions 領域が表示されます。 1. Azure Functions 拡張機能をインストール
  • 12. • Visual Studio Code で、Azure ロゴを選択して [Azure:Functions] 領域を表示し、[新し いプロジェクトの作成] アイコンを選択します。 • プロジェクト ワークスペースの場所としてデスクトップの「 demo 」のフォルダを選択 し、[選択] をクリックします。 2. Azure Functions プロジェクトを作成
  • 13. • 関数アプリ プロジェクトの言語は「JavaScript」を選択します。 • 「V2」を選択します。 • 「Skip for now」を選択します。 2. Azure Functions プロジェクトを作成
  • 14. • 「Open in current window」を選択します。 2. Azure Functions プロジェクトを作成
  • 15. 3. Durable Functions npm パッケージをインストール • VS Codeでターミナルを開き、ワークスペース用のフォルダ「demo」で「npm install durable-functions」 を実行して、durable-functions npm パッケージをインストール します。 ※npmがインストールされていない場合は、事前にnpmをPCにインストールします
  • 16. 4. starter 関数を作成 • [Azure:Functions] で [関数の作成] アイコンを選択します。 • 関数アプリ プロジェクトが含まれたフォルダーを選択し、[HTTP trigger] 関数テンプレート を選択します。 • 関数名として「HttpStart」と入力して Enter キーを押し、[Anonymous] 認証を選択します。
  • 17. 4. starter 関数を作成 • index.js を以下の JavaScript に置き換えます。 const df = require("durable-functions"); module.exports = async function (context, req) { const client = df.getClient(context); const instanceId = await client.startNew(req.params.functionName, undefined, req.body); context.log(`Started orchestration with ID = '${instanceId}'.`); return client.createCheckStatusResponse(context.bindingData.req, instanceId); };
  • 18. 4. starter 関数を作成 • function.json を以下の JavaScript に置き換えます。 { "bindings": [ { "authLevel": "anonymous", "name": "req", "type": "httpTrigger", "direction": "in", "route": "orchestrators/{functionName}", "methods": ["get", "post"] }, { "name": "starter", "type": "orchestrationClient", "direction": "in" } ] }
  • 19. Orchestration Client (HttpStart) Orchestrator (OrchestratorFunction) Activity Function (E1_SayHello) { "bindings": [ { "authLevel": "anonymous", "name": "req", "type": "httpTrigger", "direction": "in", "route": "orchestrators/{functionName}", "methods": ["get", "post"] }, { "name": "starter", "type": "orchestrationClient", "direction": ”in" } ] } const df = require("durable-functions"); module.exports = async function (context, req) { const client = df.getClient(context); const instanceId = await client.startNew(req.params.functionName, undefined, req.body); context.log(`Started orchestration with ID = '${instanceId}'.`); return client.createCheckStatusResponse(context.bindingData.req, instanceId); }; index.js function.json
  • 20. 5. オーケストレーター関数を作成 • 前の手順を繰り返し、HTTP Trigger Templateを使用して 2 つ目の関数を作成しま す。 今回は関数に 「 OrchestratorFunction」 と名前を付けます。 • index.js を以下の JavaScript に置き換えます。 const df = require("durable-functions"); module.exports = df.orchestrator(function*(context){ context.log("Starting chain sample"); const output = []; output.push(yield context.df.callActivity("E1_SayHello", "Tokyo")); output.push(yield context.df.callActivity("E1_SayHello", "Seattle")); output.push(yield context.df.callActivity("E1_SayHello", "London")); return output; });
  • 21. 5. オーケストレーター関数を作成 • function.json を以下の JavaScript に置き換えます。 { "bindings": [ { "name": "context", "type": "orchestrationTrigger", "direction": "in" } ] }
  • 22. Orchestration Client (HttpStart) Orchestrator (OrchestratorFunction) Activity Function (E1_SayHello) { "bindings": [ { "authLevel": "anonymous", "name": "req", "type": "httpTrigger", "direction": "in", "route": "orchestrators/{functionName}", "methods": ["get", "post"] }, { "name": "starter", "type": "orchestrationClient", "direction": ”in" } ] } const df = require("durable-functions"); module.exports = async function (context, req) { const client = df.getClient(context); const instanceId = await client.startNew(req.params.functionName, undefined, req.body); context.log(`Started orchestration with ID = '${instanceId}'.`); return client.createCheckStatusResponse(context.bindingData.req, instanceId); }; const df = require("durable-functions"); module.exports = df.orchestrator(function*(context){ context.log("Starting chain sample"); const output = []; output.push(yield context.df.callActivity("E1_SayHello", "Tokyo")); output.push(yield context.df.callActivity("E1_SayHello", "Seattle")); output.push(yield context.df.callActivity("E1_SayHello", "London")); return output; }); { "bindings": [ { "name": "context", "type": "orchestrationTrigger", "direction": "in" } ] } index.js function.json
  • 23. 6. アクティビティ関数を作成 • 前の手順を繰り返し、HTTP Trigger Templateを使用して 2 つ目の関数を作成しま す。 今回は関数に 「 E1_SayHello 」 と名前を付けます。 • index.js を以下の JavaScript に置き換えます。 module.exports = async function(context) { return `Hello ${context.bindings.name}!`; };
  • 24. 6. アクティビティ関数を作成 • function.json を以下の JavaScript に置き換えます。 { "bindings": [ { "name": "name", "type": "activityTrigger", "direction": "in" } ] }
  • 25. Orchestration Client (HttpStart) Orchestrator (OrchestratorFunction) Activity Function (E1_SayHello) { "bindings": [ { "authLevel": "anonymous", "name": "req", "type": "httpTrigger", "direction": "in", "route": "orchestrators/{functionName}", "methods": ["get", "post"] }, { "name": "starter", "type": "orchestrationClient", "direction": ”in" } ] } const df = require("durable-functions"); module.exports = async function (context, req) { const client = df.getClient(context); const instanceId = await client.startNew(req.params.functionName, undefined, req.body); context.log(`Started orchestration with ID = '${instanceId}'.`); return client.createCheckStatusResponse(context.bindingData.req, instanceId); }; const df = require("durable-functions"); module.exports = df.orchestrator(function*(context){ context.log("Starting chain sample"); const output = []; output.push(yield context.df.callActivity("E1_SayHello", "Tokyo")); output.push(yield context.df.callActivity("E1_SayHello", "Seattle")); output.push(yield context.df.callActivity("E1_SayHello", "London")); return output; }); { "bindings": [ { "name": "context", "type": "orchestrationTrigger", "direction": "in" } ] } module.exports = async function(context) { return `Hello ${context.bindings.name}!`; }; { "bindings": [ { "name": "name", "type": "activityTrigger", "direction": "in" } ] } index.js function.json
  • 26. 7. Azure へのサインイン • [Azure: Functions] 領域で、[Sign in to Azure...](Azure にサインインする...) を選択し ます。 ※Azure アカウントがない場合は無償アカウントを作成して下さい https://azure.microsoft.com/ja-jp/free/
  • 27. 8. Azure にプロジェクトを発行 • [Azure: Functions] 領域で、[Deploy to Function App](関数アプリにデプロイ) アイコ ンを選択します。
  • 28. 8. Azure にプロジェクトを発行 • [サブスクリプションを選択] してから、 [+ Create New Function App in Azure](+ Azure で新しい Function App を作成) を選択します。
  • 29. 8. Azure にプロジェクトを発行 • 「Deploy」を選択します。
  • 30. 9. Azure で関数をテスト • ブラウザでオーケストラーの情報を確認します。 https://<function名>.azurewebsites.net/api/orchestrators/OrchestratorFunction 出力結果例: { "id": "a42bfdf91f9a49da9c9558e2ef5c7a65", "statusQueryGetUri": "https://decode- horike.azurewebsites.net/runtime/webhooks/durabletask/instances/a42bfdf91f9a49da9c9558e2ef5c7a65?taskHub =DurableFunctionsHub&connection=Storage&code=BId08/uK/2jAhDKF3bNjgNPzJGdGfcalR3dlm6PJyate/aG/rtHZ VA==", "sendEventPostUri": "https://decode- horike.azurewebsites.net/runtime/webhooks/durabletask/instances/a42bfdf91f9a49da9c9558e2ef5c7a65/raiseEve nt/{eventName}?taskHub=DurableFunctionsHub&connection=Storage&code=BId08/uK/2jAhDKF3bNjgNPzJGdGfc alR3dlm6PJyate/aG/rtHZVA==", ・・・・
  • 31. 9. Azure で関数をテスト • 前ページのstatusQueryGetUri をブラウザのURLにコピペし、オーケストラーの状態を 確認します。 出力結果例: { "instanceId": "6fa01dd927a245229cff60e9596d01ee", "runtimeStatus": "Completed", "input": null, "customStatus": null, "output": [ "Hello Tokyo!", "Hello Seattle!", "Hello London!" ], "createdTime": "2019-05-28T14:10:02Z", "lastUpdatedTime": "2019-05-28T14:10:02Z" }
  • 32. Orchestration Client (HttpStart) Orchestrator (OrchestratorFunction) Activity Function (E1_SayHello) { "bindings": [ { "authLevel": "anonymous", "name": "req", "type": "httpTrigger", "direction": "in", "route": "orchestrators/{functionName}", "methods": ["get", "post"] }, { "name": "starter", "type": "orchestrationClient", "direction": ”in" } ] } const df = require("durable-functions"); module.exports = async function (context, req) { const client = df.getClient(context); const instanceId = await client.startNew(req.params.functionName, undefined, req.body); context.log(`Started orchestration with ID = '${instanceId}'.`); return client.createCheckStatusResponse(context.bindingData.req, instanceId); }; const df = require("durable-functions"); module.exports = df.orchestrator(function*(context){ context.log("Starting chain sample"); const output = []; output.push(yield context.df.callActivity("E1_SayHello", "Tokyo")); output.push(yield context.df.callActivity("E1_SayHello", "Seattle")); output.push(yield context.df.callActivity("E1_SayHello", "London")); return output; }); { "bindings": [ { "name": "context", "type": "orchestrationTrigger", "direction": "in" } ] } module.exports = async function(context) { return `Hello ${context.bindings.name}!`; }; { "bindings": [ { "name": "name", "type": "activityTrigger", "direction": "in" } ] } index.js function.json
  • 35. チュートリアル • 今回のタッチアンドトライは公式のチュートリアルをベースにしています。 JavaScript で最初の Durable Functions を作成する https://docs.microsoft.com/ja-jp/azure/azure-functions/durable/quickstart-js-vscode
  • 36. Functions Appの前処理 • Durable Functions ExtensionをPortalからInstallします。 • 「Durable Functions HTTP starter」をクリックし「Install」を作成します。 • Installが終わり次第「Cancel」します。
  • 37. ローカル開発環境 • ローカルでの開発、テストを行うにはセットアップが必要です Azure Functions V2 を Mac+VSCode で動かすまでの手順 https://qiita.com/miyake/items/83aac5524be91e3811ee
  • 38. Functionsがサポートするバインディング Type 1.x 2.x1 トリガー 入力 Output Blob Storage ✔ ✔ ✔ ✔ ✔ Cosmos DB ✔ ✔ ✔ ✔ ✔ Event Grid ✔ ✔ ✔ Event Hubs ✔ ✔ ✔ ✔ HTTP と Webhooks ✔ ✔ ✔ ✔ Microsoft Graph Excel テーブル ✔ ✔ ✔ Microsoft Graph OneDrive ファイル ✔ ✔ ✔ Microsoft Graph Outlook メール ✔ ✔ Microsoft Graph Events ✔ ✔ ✔ ✔ Microsoft Graph Auth トークン ✔ ✔ Mobile Apps ✔ ✔ ✔ Notification Hubs ✔ ✔ Queue Storage ✔ ✔ ✔ ✔ SendGrid ✔ ✔ ✔ Service Bus ✔ ✔ ✔ ✔ SignalR ✔ ✔ ✔ Table Storage ✔ ✔ ✔ ✔ Timer ✔ ✔ ✔ Twilio ✔ ✔ ✔ https://docs.microsoft.com/ja-jp/azure/azure-functions/functions-triggers-bindings#supported-bindings