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
[JAWS-SG#02] 個人開発やハッカソンで役立つ、便利APIのつくりかた
Search
Keisuke Mori
May 16, 2020
Programming
0
140
[JAWS-SG#02] 個人開発やハッカソンで役立つ、便利APIのつくりかた
Keisuke Mori
May 16, 2020
Tweet
Share
More Decks by Keisuke Mori
See All by Keisuke Mori
AWSを使う上で意識しておきたい、クラウドセキュリティ超入門(駆け足版)
kkmory
1
400
rubyonjets_with_aws_for_research
kkmory
0
580
AWSで動画変換&配信基盤を作った話
kkmory
0
250
Slackであそぼ!!
kkmory
0
130
Git-study-Hackz-treasure
kkmory
1
270
飯塚ブロックチェーン勉強会 #1
kkmory
0
140
Swarm: The distributed storage platform
kkmory
1
800
Kindai_Blockchain_study01
kkmory
0
260
Other Decks in Programming
See All in Programming
可変性を制する設計: 構造と振る舞いから考える概念モデリングとその実装
a_suenami
7
980
Bedrock AgentCore ObservabilityによるAIエージェントの運用
licux
7
210
変化を楽しむエンジニアリング ~ いままでとこれから ~
murajun1978
0
460
バイブスあるコーディングで ~PHP~ 便利ツールをつくるプラクティス
uzulla
1
280
[SRE NEXT] 複雑なシステムにおけるUser Journey SLOの導入
yakenji
0
800
Startups on Rails in Past, Present and Future–Irina Nazarova, RailsConf 2025
irinanazarova
0
300
AIのメモリー
watany
11
1k
What's new in AppKit on macOS 26
1024jp
0
170
階層化自動テストで開発に機動力を
ickx
1
420
Reactの歴史を振り返る
tutinoko
1
140
商品比較サービス「マイベスト」における パーソナライズレコメンドの第一歩
ucchiii43
0
200
CIを整備してメンテナンスを生成AIに任せる
hazumirr
0
260
Featured
See All Featured
Facilitating Awesome Meetings
lara
54
6.5k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
Done Done
chrislema
184
16k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
The Cost Of JavaScript in 2023
addyosmani
51
8.6k
What's in a price? How to price your products and services
michaelherold
246
12k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
530
A better future with KSS
kneath
238
17k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.3k
Visualization
eitanlees
146
16k
Transcript
個人開発やハッカソンで役立つ、 便利 API のつくりかた Kindai University / Hack’z Inc. Keisuke
Mori
Keisuke Mori 近畿大学産業理工学部(福岡キャンパス) - 情報学科 4回生 - 暗号技術, ブロックチェーン, プライバシー技術
- ソフトウェア開発の演習では Cloud9 使ってました @moririn772 サーバーサイド/インフラ系 - Go, Ruby, AWS がお気に入り - JAWS-SG 運営メンバー(今日は配信担当)
ݸਓ։ൃϋοΧιϯͰཱͭɺศར API ͷͭ͘Γ͔ͨ Today’s TALK
ΰʔϧσϯΟʔΫɺԿͯ͠·͔ͨ͠ʁ Q.
A. ΦϯϥΠϯϋοΧιϯʹग़ͯ·ͨ͠ https://connpass.com/event/174573/ɹ
ͳʹ࡞ͬͨΜͰ͔͢ ☺☺ Q.
A. ͜ΜͳͷΛ࡞Γ·ͨ͠
作った背景テンプレートをタグ付けしてみんなに共有 (タグを付けて検索しやすく) A. ࡞ͬͨςϯϓϨʔτڞ༗Ͱ͖·͢
Ͳ͏ͬͯ࡞ͬͨΜͰ͔͢ Q.
A. ͜Μͳײ͡Ͱ࡞Γ·ͨ͠ Application Server Image Hosting Service Client Tag Suggestion
Service API Gateway Lambda Translate Recognition Cloud SQL ( MySQL ) Cloudfront S3 React (Next) CI/CD etc… GAE ( Go ) Ұ෦ϋοΧιϯظؒʹऴΘΓ·ͤΜͰͨ͠…
ࠓ͜͜ͷΛ͠·͢ʂ Application Server Image Hosting Service Client Tag Suggestion Service
API Gateway Lambda Translate Recognition Cloud SQL ( MySQL ) Cloudfront S3 React (Next) CI/CD etc… GAE ( Go )
ͬͨ AWS ͷαʔϏε Amazon API Gateway Amazon Rekognition AWS Lambda
Amazon Translate ؆୯ʹ API ͷ࡞, ެ։, อक, ϞχλϦϯά, อޢΛߦ͏͜ͱ͕ Ͱ͖Δ αʔόʔϨε࣮ߦڥ ͍ΖΜͳݴޠͰॻ͚Δ Ruby, Go, Python, Java … ػցֶशͷઐࣝΛඞཁͱͤͣ ը૾ಈըͷମ, إ, γʔϯ Λ ಛఆͰ͖ΔɻΧελϜϥϕϧΛɹ ͏ͱɺ෦ͷྨͳͲՄೳ χϡʔϥϧػց༁αʔϏε 54 ݴޠʹରԠ
Tag Suggestion Service … 作った背景テンプレートをタグ付けして共有 → つけられそうなタグを背景画像から推測して提示する機能
Tag Suggestion Service … Tag Suggestion Service API Gateway Lambda
Translate Recognition Client
Tag Suggestion Service … Tag Suggestion Service API Gateway Lambda
Translate Recognition Client 背景に使われている素材(既にS3にPUT済)のURLを、 エンドポイントに投げる https://~~~/default/detect-image-label?image-uri=*************
Tag Suggestion Service … Tag Suggestion Service API Gateway Lambda
Translate Rekognition Client API Gateway から Lambda に処理を流す。 Lambda関数(handrer.request_handler)を発火させ、 AWS-SDK から Rekognition のAPI を叩く。
Tag Suggestion Service … Tag Suggestion Service API Gateway Lambda
Translate Rekognition Client Rekognition の “DetectLabels” オペレーションを使用。 画像をもとにラベルが検出され、結果が返る。
Tag Suggestion Service … Tag Suggestion Service API Gateway Lambda
Translate Rekognition Client タグが英語で返ってきてしまい、UX的によくないので Amazon Translate の "Translate Text" オペレーションを 使用し、タグを 英語→日本語 に翻訳する。
Tag Suggestion Service … Tag Suggestion Service API Gateway Lambda
Translate Rekognition Client これまでが処理の全貌 あとはクライアント側にレスポンスを返すだけ。 “body” : [ “飛行機”, “輸送”, “航空機”, “旅客機”, “車両” ]
Tag Suggestion Service … Tag Suggestion Service API Gateway Lambda
Translate Rekognition Client 推測されたタグが表示される。 ユーザーはタグを選択し、テンプレートを公開する。
ͲΕ͘Β͍Ͱ࡞ͬͨΜͰ͔͢ ⏰ ⏰ Q.
A. 1࣌ؒ͘Β͍Ͱͭ͘Ε·ͨ͠ * ˎ ಈ࡞༏ઌͰ࡞ͬͨͷͰςετॻ͍ͯͳ͍͠ɺσϓϩΠZIPͰݻΊΔΓํͩ͠ɺ ɹࡶΜͬͯποίϛ͕ೖΓͦ͏Ͱ͕͢ಈ͘ͷͰϤγʂʂ ɹ ϋοΧιϯݸਓ։ൃʮಈ͘͜ͱʯ͕େͳͷͰʂʂʢݴ͍༁ʣ ɹ ͋ͱͰSAMͰ࡞Γ͠·͠ΐ͏…
ݸਓ։ൃϋοΧιϯͰཱͭɺศར API ͷͭ͘Γ͔ͨ ʙ Amazon Rekognition Λ༻ͨ͠ը૾ͷλά͚APIฤ ʙ
ιʔείʔυ༧Ί༻ҙ͓͖ͯ͠·ͨ͠ $ git clone \ https://github.com/moririn772/tag-suggestion-api.git $ #ͱ͍͏ͷෆͳͷͰɺGitHubϦϙδτϦެ։ͯ͠·͢
Bundle install $ cd $ bundle install —path=vendor/bundle
Ͱ͖·ͨ͠ʂ $ ll > 5 13 10:47 Gemfile > 5
13 10:17 Gemfile.lock > 5 13 11:18 Readme.md > 5 13 10:49 handler.rb > 5 13 10:17 vendor
ZIPͰݻΊ·͢ $ zip -r handler.zip handler.rb vendor
ΆͪΆͪ…ʢLambdaʣ
ΆͪΆͪ…ʢAPI Gatewayʣ
ΆͪΆͪ…ʢIAMʣ
Ͱ͖…Δͷ͔…ʂʂ
None
؆୯ʹ͜ͷϨϕϧͷػೳ͕࣮Ͱ͖Δͷ͘͢͝Ͷʁ
εϐʔυ࣮
ɹϚωʔδυαʔϏεΛͲΜͲΜ͍ͬͯͬͯɺ ͍͍ײ͡ͷΞτϓοτΛ͍ͯ͜͠͏
खΛಈ͔ͨ͠ΒɺࠓͦΕΛ ొஃϒϩάͰΈΜͳʹγΣΞ͍ͯ͜͠͏
ݸਓ։ൃϋοΧιϯͰཱͭɺศར API ͷͭ͘Γ͔ͨ ʙ Amazon Rekognition Λ༻ͨ͠ը૾ͷλά͚APIฤ ʙ Thank you
!!
͓·͚ɿίʔυղઆ
Gemfile Λฤूͯ͠ɺbundle install ͠·͢ # frozen_string_literal: true source 'https://rubygems.org' git_source(:github)
{ |repo_name| "https://github.com/#{repo_name}" } gem 'aws-sdk-rekognition' gem 'aws-sdk-translate' Gemfile $ bundle install —path=vendor/bundle
ґଘ gem Λ require ͠·͢ # frozen_string_literal: true require 'net/http'
require 'json' require 'aws-sdk-rekognition' require 'aws-sdk-translate' require 'base64' require 'open-uri' def request_handler(event:, context:) image_uri = event['queryStringParameters']['image-uri'] resp = detect_label(URI.open(image_uri).read) { statusCode: 200, headers: { 'Content-Type': 'application/json' }, body: JSON.generate(resp) } end handler.rb
ґଘ gem Λ require ͠·͢ # frozen_string_literal: true require 'net/http'
require 'json' require 'aws-sdk-rekognition' require 'aws-sdk-translate' require 'base64' require 'open-uri' handler.rb
Rekognition ʹϥϕϧΛ͚ͭͯΒ͏ؔ def detect_label(data) client = Aws::Rekognition::Client.new attrs = {
image: { bytes: data }, max_labels: 10 } response = client.detect_labels(attrs) # Filter labels = response.labels.select { |c| c.confidence >= 66 } # Translate tag, Generate response array labels.map { |l| translate(l[:name].downcase) } end handler.rb
ϥϕϧΛຊޠʹͯ͘͠ΕΔؔ def translate(target) client = Aws::Translate::Client.new resp = client.translate_text( text:
target, source_language_code: 'en', target_language_code: 'ja' ) resp.translated_text end handler.rb
ϦΫΤετͷϋϯυϥʔؔΛ࣮͠·͢ def request_handler(event:, context:) # ΫΤϦύϥϝʔλ͜͏ͬͯऔΔ image_uri = event['queryStringParameters']['image-uri'] resp
= detect_label(URI.open(image_uri).read) { statusCode: 200, headers: { 'Content-Type': 'application/json' }, body: JSON.generate(resp) } end handler.rb
DONE !!! def request_handler(event:, context:) # ΫΤϦύϥϝʔλ͜͏ͬͯऔΔ image_uri = event['queryStringParameters']['image-uri']
resp = detect_label(URI.open(image_uri).read) { statusCode: 200, headers: { 'Content-Type': 'application/json' }, body: JSON.generate(resp) } end handler.rb