Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Zendeskにチケット作るAPI Gatewayだけのフォームバックエンド
Search
Fumiya Osaka
December 23, 2020
Technology
0
150
Zendeskにチケット作るAPI Gatewayだけのフォームバックエンド
2020/12/23開催の
JAWS-UG KANSAI 歳末スペシャル SHIWA-SU!
のLT資料です!
Fumiya Osaka
December 23, 2020
Tweet
Share
More Decks by Fumiya Osaka
See All by Fumiya Osaka
SaaSインテグレータのプリセから見たAWS
fmyosaka
1
160
JAWS DAYS 2021 サポーターセッション登壇資料
fmyosaka
0
760
我社のGot Shifterまでの道のり 〜そして僕は情シスになった〜
fmyosaka
0
730
ShifterにZendeskに連携する問合せフォームを作ってみる
fmyosaka
0
1.8k
Other Decks in Technology
See All in Technology
OCI Network Firewall 概要
oracle4engineer
PRO
2
7.9k
速習AGENTS.md:5分で精度を上げる "3ブロック" テンプレ
ismk
6
1.2k
やる気のない自分との向き合い方/How to Deal with Your Unmotivated Self
sanogemaru
0
500
20251014_Pythonを実務で徹底的に使いこなした話
ippei0923
0
190
能登半島災害現場エンジニアクロストーク 【JAWS FESTA 2025 in 金沢】
ditccsugii
0
600
Vibe Coding Year in Review. From Karpathy to Real-World Agents by Niels Rolland, CEO Paatch
vcoisne
0
130
How to achieve interoperable digital identity across Asian countries
fujie
0
150
コンテキストエンジニアリング入門〜AI Coding Agent作りで学ぶ文脈設計〜
kworkdev
PRO
1
660
なぜAWSを活かしきれないのか?技術と組織への処方箋
nrinetcom
PRO
4
820
生成AIとM5Stack / M5 Japan Tour 2025 Autumn 東京
you
PRO
0
250
AgentCon Accra: Ctrl + Alt + Assist: AI Agents Edition
bethany
0
100
PHPからはじめるコンピュータアーキテクチャ / From Scripts to Silicon: A Journey Through the Layers of Computing Hiroshima 2025 Edition
tomzoh
0
130
Featured
See All Featured
Embracing the Ebb and Flow
colly
88
4.8k
A better future with KSS
kneath
239
18k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
900
Done Done
chrislema
185
16k
How to Ace a Technical Interview
jacobian
280
24k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
620
Being A Developer After 40
akosma
91
590k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Music & Morning Musume
bryan
46
6.8k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
31
2.7k
The Cult of Friendly URLs
andyhume
79
6.6k
Transcript
JAWS-UG KANSAI 歳末スペシャル SHIWA-SU! 2020.12.23 株式会社エクレクト 逢坂文哉 Zendeskにチケット作るAPI Gatewayだけのフォームバックエンド
2 自己紹介 逢坂 ⽂哉(おおさか ふみや) 出⾝: ⼤阪市此花区 住まい: 兵庫県⻄宮市 勤務:
なんばのWeWork(無限⽣ビールのためにごくたまに⾏く) 職歴: 出版・印刷業を相⼿にするSIerでSE: 4.3年 AWSとか物理サーバとかApacheの再起動とかを売る営業・プリセ: 5年 エクレクトでZendeskを売る営業・プリセ・ちょっと情シス: 1.25年 ※フロントエンドちゃんとやったことありません... コミュニティ: JAWS-UG Osaka JAWS-UG Sales Cloud Native Kansai 趣味: 映画: スピルバーグとタランティーノと成瀬⺒喜男を敬愛 ⾳楽: すべての踊れる⾳楽を愛しています あとお酒を飲むのが普通の⼈より少しよけいに好きです
3 エクレクトがやってること エクレクトは、Zendeskのオフィシャルパートナーとして、以下のサービスを提供しています。 インプリメント デザイン構築 システム・データ移管 カスタムアプリケーション開発 ソリューション提案 Zendesk Guideを始めとした、
貴社の希望に沿ったデザイン/テン プレート制作依頼 お客様の業務に必要なアプリケーシ ョンの開発、Zendeskと既存 システム連携など 現在利用中のシステムからのデータ移 行/運用移行の支援。CRM/メール配 信システム/基幹システム etc. お客様のビジネス要件に合わせた Zendeskの導入コンサルティング/ サービスの実装依頼 お客様の課題に合わせたZendesk活 用のご提案、日本円でのライセンス 販売代理 Zendeskをプラットフォームとして 活用した、様々なパートナーサービ スのご提供 Zendeskアプリケーション
4 Zendeskって? 複数チャネルからのお問合せや コンタクトを集約しチケット化する コミュニケーション統合プラットフォーム 外部システム連携 アプリケーション ブログのようにメンテナンスしやすい FAQサイト構築ソフトウェア デザインのカスタマイズも自由です
Webサイトなどに簡単に設置できる リアルタイムチャットソフトウェア AIサービスとの連携も可能です コールセンターに必要な様々な機能を 備えた、簡単に構築ができるクラウド 型のコールセンターソフトウェア Zendesk各種製品に蓄積されたデータ を集約し、分析するBIソフトウェア CX全体の測定と改善を可能にします マーケットプレイスからのインストール/ オリジナルアプリケーションの開発によって より使いやすい環境の構築が可能 基幹システム/コミュニケーションシステム 受注管理システム/CRMやSFA 様々なシステムとの連携が可能 各関係部署 カスタマー 無制限のデータ蓄積 Zendeskの製品群は、顧客とオムニチャネルでシームレスにコミュニケーションをするために必要な、あらゆるサービスを提供します。 オペレーター
5 Zendeskにチケット作るAPI Gatewayだけのフォームバックエンド
6 前にこういうLTやりましてん
7 Shifterで作った静的サイトの問合せフォームからZendeskにチケットを作るには? ⽅法①︓代わりの何かsにZendesk宛にメールを送ってもらう ⽅法②︓ ZapierにFormKeepをZendeskに連携してもらう ⽅法③︓API Gateway + LambdaにZendeskのAPIを叩いてもらう ⽅法④︓Zendeskで作った問合せフォームへのリンクを書いちゃう
すぐ試せてお⾦がかからないのは①と④だけどLTとしての⾯⽩みに⽋ける... ⽅法⑤︓FormspreeにZendesk Pluginってのがあるやん︕ 適度な⾯⽩みがありそうだ︕LTのネタはこれにしよう︕w
8 Shifterで作った静的サイトの問合せフォームからZendeskにチケットを作るには? ⽅法①︓代わりの何かsにZendesk宛にメールを送ってもらう ⽅法②︓ ZapierにFormKeepをZendeskに連携してもらう ⽅法③︓API Gateway + LambdaにZendeskのAPIを叩いてもらう ⽅法④︓Zendeskで作った問合せフォームへのリンクを書いちゃう
すぐ試せてお⾦がかからないのは①と④だけどLTとしての⾯⽩みに⽋ける... ⽅法⑤︓FormspreeにZendesk Pluginってのがあるやん︕ 適度な⾯⽩みがありそうだ︕LTのネタはこれにしよう︕w ← 試した結果あんまイケてなかった
9 Shifterで作った静的サイトの問合せフォームからZendeskにチケットを作るには? ⽅法①︓代わりの何かsにZendesk宛にメールを送ってもらう ⽅法②︓ ZapierにFormKeepをZendeskに連携してもらう ⽅法③︓API Gateway + LambdaにZendeskのAPIを叩いてもらう ⽅法④︓Zendeskで作った問合せフォームへのリンクを書いちゃう
すぐ試せてお⾦がかからないのは①と④だけどLTとしての⾯⽩みに⽋ける... ⽅法⑤︓FormspreeにZendesk Pluginってのがあるやん︕ 適度な⾯⽩みがありそうだ︕LTのネタはこれにしよう︕w ← やっぱこっちかな︖
10 こういうイメージ Amazon API Gateway Shifter上のフォーム AWS Lambda Request Method:
Post Content-Type: application/x-www-form-urlencoded Request Method: Post Content-Type: application/json フォームから送られてくる変なデータを Zendesk⽤のJSONに整形
11 結局こうすることになる Amazon API Gateway Shifter上のフォーム AWS Lambda Request Method:
Post Content-Type: application/x-www-form-urlencoded Request Method: Post Content-Type: application/json API Gatewayから送られてくるJSONを Zendesk⽤のJSONに整形 フォームから送られてくる変なデータを JSONに整形
12 よー考えたらAPI Gatewayのマッピングテンプレート使えばLambdaいらんのんちゃう? Amazon API Gateway Shifter上のフォーム Request Method: Post
Content-Type: application/x-www-form-urlencoded Request Method: Post Content-Type: application/json フォームから送られてくる変なデータを Zendesk⽤のJSONに整形
13 使うZendeskのAPIはこれ ← 認証いらん
14 小学生みたいなSLAの計算をしてみる x = 99.95 x 99.95 = 99.90 =
99.95
15 やってみる Amazon API Gateway Shifter上のフォーム Request Method: Post Content-Type:
application/x-www-form-urlencoded Request Method: Post Content-Type: application/json フォームから送られてくる変なデータを Zendesk⽤のJSONに整形
16 API Gatewayを作る
17 メソッド作る
18 統合リクエスト設定でHTTPヘッダーとマッピングテンプレートを設定
19 統合リクエスト設定でHTTPヘッダーとマッピングテンプレートを設定(ここで大変苦労する) フォーム Zendeskに投げるjson マッピングテンプレート
20 できた〜! Amazon API Gateway Shifter上のフォーム Request Method: Post Content-Type:
application/x-www-form-urlencoded Request Method: Post Content-Type: application/json
21 こうしたくなる Amazon API Gateway Shifter上のフォーム Request Method: Post Content-Type:
application/x-www-form-urlencoded 完了ページを表⽰ Request Method: Post Content-Type: application/json
22 こうして
23 こうする
24 できた! Amazon API Gateway Shifter上のフォーム Request Method: Post Content-Type:
application/x-www-form-urlencoded 完了ページを表⽰(308でそのままpostデータ戻すのもできるよ〜) Request Method: Post Content-Type: application/json
25 まとめ VTLでマッピングテンプレート書くのが⾯倒になって、実案件ではLambdaを使うことになりました
26 Thank you