狛ログ

オフィス狛 技術部のJoeです。
担当のプロジェクトで、AWSのプライベートサブネット内のLambda関数で、環境変数の複合化を行うため、AWS KMSを利用する必要がありました。
インターネットゲートウェイとルーティングできないプライベートサブネット内のLambda関数が、VPC外のサービスであるAWS KMSを利用するためには、２つの方法があります。

方法と設定

１．NAT Gatewayを作成する

パブリックサブネットにNAT Gatewayを作成し、インターネット経由でKMSに接続します。

【NAT Gatewayの設定手順】
　※NAT Gateway 以外は、既に構築済みの前提として、手順は省略させていただきます

① VPCのサービスから、NAT Gateway を作成します。

② プライベートサブネットのルートテーブルのルートに、①で作成したNAT Gateway を指定します。

■注意点
・Elastic IP アドレスは、AWS アカウントごとに各リージョンで 5 つのデフォルト制限がありますので、既に５つ割り当てている場合、制限の増加をリクエストする必要があります。

２．エンドポイントを作成する（PrivateLink）

KMS用のエンドポイント（インターフェイスエンドポイント）を作成し、プライベートリンクでKMSに接続します。

【エンドポイントの設定手順】
　※エンドポイント以外は、既に構築済みの前提として、手順は省略させていただきます

① VPCのサービスからエンドポイントを作成します。

■注意点
・エンドポイントに設定するセキュリティグループは、インバウンドルールに「HTTPS」を許可する必要があります。

NAT Gatewayとエンドポイントのどちらを利用したほうが良いのか

ご利用に環境による場合もあるかもしれませんが、今回のように、新たにプライベートサブネット内のLambdaやEC2から、AWSのサービス（KMS、S3など）を利用する場合は、 下記の理由などから、エンドポイントを作成し、プライベートリンクで接続が良さそうです。

ただし、対象の AWS サービスで VPC エンドポイントが利用できない場合もありますので、こちらで事前にご確認ください。
AWS PrivateLink と統合できる AWS のサービス

１．セキュリティ

NAT Gatewayは、インターネット経由で接続しますが、プライベートリンクを利用すると、トラフィックをインターネットに公開することなく、AWS のサービスに接続できます。
そのため、ブルートフォース攻撃やDDos攻撃、その他の脅威に晒される危険が軽減されます。
また、セキュリティグループを関連付けることで、アクセス制御も可能です。

２．料金

料金については、AWS アーキテクチャ ブログを見ますと、エンドポイント（インターフェイスエンドポイント）は、「インターネット ゲートウェイへのトラフィックを回避し、NAT ゲートウェイ、NAT インスタンス、またはファイアウォールの維持に関連するコストが発生するのを回避することで、ネットワーク パスを最適化できます。」との記載があります。
また、NAT Gatewayと「１つ当たりの料金」と「処理データ 1 GB あたりの料金」を比較すると、料金は約6分の1で、AWSのコストを削減できる可能性があります。
NAT Gatewayの料金
エンドポイントの料金

３．管理

管理については、エンドポイントは設定手順が少なく、構成も分かり易いため、個人的には管理し易いと思いました。


以上です。
今回は、インターフェイスエンドポイント（プライベートリンク）についてご紹介しましたが、エンドポイントは他にも「ゲートウェイロードバランサーのエンドポイント」、「ゲートウェイエンドポイント」がありますので、機会があればご紹介したいと思います。

オフィス狛 技術部のJoeです。

弊社のあるプロジェクトで、AWSのLambda関数でPOSTリクエストする機能があるのですが、
ある日、ログを確認すると以下のようなメッセージが出力されていました。

DeprecationWarning: You are using the post() function from 'botocore.vendored.requests'.  This dependency was removed from Botocore and will be removed from Lambda after 2021/01/30. https://aws.amazon.com/blogs/developer/removing-the-vendored-version-of-requests-from-botocore/. Install the requests package, 'import requests' directly, and use the requests.post() function instead.

【直訳】
非推奨警告：「botocore.vendored.requests」のpost（）関数を使用しています。 この依存関係はBotocoreから削除され、2021/01/30以降にLambdaから削除されます。 https://aws.amazon.com/blogs/developer/removing-the-vendored-version-of-requests-from-botocore/。 リクエストパッケージをインストールし、「リクエストをインポート」して、代わりにrequests.post（）関数を使用します。

このメッセージの対応として、Lambda関数のコードでzipファイルをアップロードして、
「botocore.vendored.requests」からPythonのRequestsモジュールに変更した手順をご紹介します。
（Windowsでの手順になります）

１．Pythonをインストール

公式サイトから、Pythonをダウンロードして、インストールしてください。
※今回はVersion 3.9.0 を使用しました

環境変数（Path）の追加をお忘れなく。

[インストールフォルダ]\Python39
[インストールフォルダ]\Python39\Scripts

２．pipでRequestsを指定のフォルダにインストール

適当な場所に作業用のフォルダを作成し、
コマンドプロンプトを起動し、作成したフォルダに移動してください。

以下のコマンドで、インストールします。

pip install requests -t .

成功すると、作業用フォルダの中に、以下のフォルダが作成されます。

bin
certifi
certifi-2020.6.20.dist-info
chardet
chardet-3.0.4.dist-info
idna
idna-2.10.dist-info
requests
requests-2.24.0.dist-info
urllib3
urllib3-1.25.11.dist-info

３．zipファイルの作成

Lambda関数にアップロードするzipファイルを作成します。
上記２のフォルダをzipファイルにするだけなのですが、注意点があります。

①「.dist-info」のフォルダは不要なので削除します。

②今回のように、zipファイルをアップロードするLambda関数に、既に関数コードを記述している場合、
アップロードしたタイミングで、消えてしまいます。

既存のコードを使用する場合、「２」で作成したの作業フォルダの中に、
新規で「lambda_function.py」ファイルを作成して、
既存の関数コードをコピーしてください。

上記①、②の対応をした場合、zipファイルの中身は以下のようになります。

bin
certifi
chardet
idna
requests
urllib3
lambda_function.py

４．zipファイルのアップロード

Lambdaの関数コードのアクションで、「.zip ファイルをアップロード」を選択して、
「３」で作成したzipファイルをアップロードします。

Environmentにzipしたファイルとフォルダが表示されていると思いますので、
これでPythonのRequestsモジュールが使用できます。

最後にimportを修正して、「Deploy」すれば完了です。

修正前：from botocore.vendored import requests
修正後：import requests

上記の対応で、ログから警告メッセージが消えて、問題なく動作しました。

こんにちは、オフィス狛 モバイル開発担当 Aika-yuy です。
今回の投稿は、 AmazonConnectとLambdaで任意の番号に電話をかける方法をご紹介します。


AmazonConnectはコールセンターをメインとして、簡易に作成できるというものなので、
受電する記事をよく見かけますが、架電方法の記事は少なかったので記事にしました。




難しそうに見えますが、簡単で短時間で作成できますので試してみてください。
こちらの4ステップで紹介していきます。

①Amazon Connectで電話番号、お問い合わせフローの作成
②IAMでロールを作成
③Lambda関数の作成←　今回はこちら
④実行！！←　今回はこちら

　

③Lambda関数の作成

今回はいよいよ、Lambda関数からスマフォに電話をかけてみます！ とっても簡単なので、あと少し頑張りましょう。

〜必要なもの〜

１、①で作成した電話番号
２、①で作成したお問い合わせフローのインスタンスID、リージョン名、コンタクトフローID
３、②で作成した、ロール
４、任意の電話番号


AWSにログイン後、Lambdaを選択します。
ページ遷移後、関数の作成ボタンを押してください。
下の画像のように入力選択していきます。
1.関数名に任意の関数名をつけてください。
2.実行ロールを既存のロールを使用するを選択してください。
3.②IAMでロールを作成で、作成したロールを選択してください。
※作成したロールがすぐに反映されないことがあるので、作成したロールが見つからない場合は少し時間をおいてからもう一度試してみてください。
4.関数を作成ボタンを押す

それではいよいよ関数を作っていきましょう！

exports.handler = (event) => {
     
    // import entire SDK
    var AWS = require('aws-sdk');
 
    var connect;
    // create amazon connect object
    // ①で作成したお問い合わせフローのリージョン名を入力してください。
    connect = new AWS.Connect({apiVersion: '2017-08-08', region:"ap-northeast-1"});
 
    // create API request parameter
    var params = {
　　　　　　// ①で作成したお問い合わせフローのコンタクトフローID
      ContactFlowId: "XXXXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX",
      // 今回かける先の電話番号
      DestinationPhoneNumber: "XXXXXXXXXXXXXX",
      // ①で作成したお問い合わせフローのインスタンスID
      InstanceId: "XXXXXXXXXXXXXXXXXXXXXX",
      // かける元の電話番号(作成した電話番号)
      SourcePhoneNumber: "+8XXXXXXXXXXX"
    };
  
  // call API with parameter
  console.log("開始！！");
  var calling = connect.startOutboundVoiceContact(params, function(err, data) {
    if (err) {
      console.log(err);
    } else {
      console.log("終了！！電話を切る");
    }
  });
  return calling;
};

これで完成です！

④実行！！

それではいよいよ電話をかけてみます。
Lambdaのページの一番上、右にあるテストボタンを押してください。

任意の電話番号に、電話がかかれば成功です。

意外と簡単に作成できましたね。
アレクサから電話したり色々できそうで、夢が広がりますね。
次回はアプリ(ios)から電話をかけるをやっていきます。

こんにちは、オフィス狛 モバイル開発担当 Aika-yuy です。
今回の投稿は、 AmazonConnectとLambdaで任意の番号に電話をかける方法をご紹介します。


AmazonConnectはコールセンターをメインとして、簡易に作成できるというものなので、
受電する記事をよく見かけますが、架電方法の記事は少なかったので記事にしました。




難しそうに見えますが、簡単で短時間で作成できますので試してみてください。
こちらの4ステップで紹介していきます。

①Amazon Connectで電話番号、お問い合わせフローの作成
②IAMでロールを作成←　今回はこちら
③Lambda関数の作成
④実行！！

①Amazon Connectでお問い合わせフローの作成

AmazonConnect登録後、ダッシュボードまでたどり着くことができたら、下の動画のようにお問い合わせフローを作成してください。

左のバーからもう一度ダッシュボードまで戻り、電話番号の取得、お問い合わせフローの選択をしてください。

意外と簡単に作成できましたね。

次回は②IAMでロールを作成を書いていきます。

オフィス狛 技術部のKoma（Twitterアカウントの中の人＆CEO）です。

前回は、Webサイトの問い合わせフォームから問い合わせされた内容をS3バケットへテキスト形式で保存するところまで行いました。
今回は、S3に保存されたら、その内容をメールで送信したいと思います。

※メールを送信する為のAWS SES(Simple Email Service)については説明を省きます。SESの設定が終わった状態で下記の手順を行って下さい。

１）ポリシー（Policy）の作成

まずは、AWSコンソール上のIAMのページへ遷移し、左側のメニューから「Policies」を選択。
その後、左上の「Create policy」をクリックします。


Serviceは、「CloudWatch Logs」
Actionは、「CreateLogStream」、「CreateLogGroup」、「PutLogEvents」
Resourceは「all resources」を選択して、
右下の「Review policy」をクリックします。


最後にNameとDescriptionを入力し、「Create policy」を選択します。


作成に成功しました。

２）ロール（Role）の作成

続いてロールを作成していきます。先程と同じくAWSコンソール上のIAMのページへ遷移し、
左側のメニューから「Roles」を選択します。


Select type of trusted entityは「AWS service」を選択。
Choose the service that will use this roleは「Lambda」を選択して、
右下の「Next: Permissions」をクリックします。


まずはFilterで「Policy type」を選択します。
続いてAttach permissions policiesでは「AmazonSESFullAccess」をチェックします。
（検索ボックスで「SES」と入力すると、フィルターが掛かって選択が楽です）


次にFilterで「Customer managed」を選択し、先程作成したポリシーにチェックを入れます。
（検索ボックスの中身を消さないと一覧に出て来ないのでご注意を）
右下の「Next: Review」をクリックします。


最後、Role nameを入力して、右下の「Create role」をクリックします。


作成に成功しました。

３）Lambda Functionの作成

AWSコンソール上のLambdaのページへ遷移し、「Create a function」を選択。


「Author from scratch」を選択し、Name等の必要な情報を入力します。
Runtimeは「Node.js」を選択して下さい。
Roleは「Choose an existing role」を選択し、Existing roleは、先程作成したロールを選択します。


作成直後の状態です。
ここで、左側の「Add triggers」から、「S3」を選択します。


対象のバケットを選択し、Event typeは「PUT」を選択します。 「Add」をクリックします。

続いて、Node.jsのプログラムを貼り付けます。


貼り付けるプログラムは以下の通りです。

'use strict';

console.log('Loading function');

const aws = require('aws-sdk');
const s3 = new aws.S3({ apiVersion: '2006-03-01' });
const ses = new aws.SES({ apiVersion: '2010-12-01', region: 'us-east-1' });

exports.handler = (event, context, callback) => {
    const bucket = event.Records[0].s3.bucket.name;
    const key = decodeURIComponent(event.Records[0].s3.object.key.replace(/\+/g, ' '));
    const params = {
        Bucket: bucket,
        Key: key
    };

    s3.getObject(params, (err, data) => {
        if (err) {
            console.log(err);
            const message = `Error getting object ${key} from bucket ${bucket}. Make sure they exist and your bucket is in the same region as this function.`;
            console.log(message);
            callback(message);
        } else {
            const json = JSON.parse(data.Body.toString());
            const message = `
                名前： ${json.name}           
                MAIL： ${json.email}
                問い合わせ日時：
                ${json.date}
                問い合わせ内容：
                ${json.comments}
                `
            const params = {
                Destination: {
                    ToAddresses: [process.env.TOADDRESS]
                },
                Message: {
                    Body: {
                        Text: {
                            Charset: "UTF-8",
                            Data: message
                        }
                    },
                    Subject: {
                        Charset: "UTF-8",
                        Data: "フォームからのお問い合わせ"
                    }
                },
                Source: process.env.SOURCEADDRESS
            };
            ses.sendEmail(params, function (err, data) {
                if (err) console.log(err, err.stack);
                else console.log(data);
            });
        }
    });
};

プログラムに環境変数を使っているので、値を設定します。
SOURCEADDRESSが送信元（＝from）アドレスで、
TOADDRESSが送信先（＝to）アドレスです。


以上でLambdaの設定が完了となります。
Lambda作成後、前回作成した問い合わせフォームから、問い合わせを行うと・・・
この後、S3側のトリガー設定などが残っているのですが、以降は、独自ドメインの設定を行った後にやって行こうと思います。
と言う事で、WebサイトへのアクセスはS3のURLを利用しているので、 次回はRoute53を使用して、独自ドメインでの運用を可能にしていきたいと思います。

次回：Amazon S3 で サイト公開（HTTPS）する。（４）Route 53を使用した独自ドメイン運用
前回：Amazon S3 で サイト公開（HTTPS）する。（３）問い合わせフォーム準備編その１

オフィス狛 技術部のKoma（Twitterアカウントの中の人＆CEO）です。

前回からだいぶ時間が経ってしまいました。
さて、前回までで、S3へサイトを移管する事が出来ましたが、サイトによっては問題が発生します。
そう、S3は単にストレージに過ぎないので、サーバサイドのプログラム（PHPなど）は動かすことが出来ません。
弊社のホームページですと、「問い合わせフォーム」が該当します。

旧サイトでは、「問い合わせフォーム」から問い合わせ内容をPOSTし、Webサーバ側のPHPファイルを実行し、メール送信処理を行っていました。
けれど、S3ではPHPを実行する事は出来ません。

という事で、代替案として、以下の方法を取ろうと思います。
・問い合わせフォームにて入力された内容を専用のS3バケットへテキストファイルとして保存
・S3バケットへの保存をトリガーに、Lambdaファンクションでメール送信

早速、実施して行きましょう。

１）identity poolの作成

まずは、AWSコンソール上のAmazon Cognitoのページへ。

・Step 1:Create identity pool
「Identity pool name」に適当な名前を設定し、「Enable access to unauthenticated identities」にチェックを付け、「Create Pool」を押します。

・Step 2:Set permissions
IAM Roleを選択します。
このタイミングで作成する事も可能なので、今回は、「Create a new IAM Role」を選択し、
Roleの名前を付けて、「Allow」を押します。

※Cognitoについては、こちらを参照。

そうすると、identity pool id が発行されるので、メモっておきます。

ここでやっている事は、『S3へファイルをアップロードする為の認証情報を作成している』、と思って頂ければ良いと思います。

2）IAM Roleへ権限付与

AWSコンソールで、IAM　Roleを見ると、先程新規で作ったRoleが見れると思います。

次はこのRoleにS3へのファイルアップロード権限を付与します。
先程の画面でRoleをクリックすると、下記の画面に遷移しますので、
「Add inline policy」をクリックします。

・Visual editorでポリシー作成
JSONを直接貼り付けて説明しているサイトが多いのですが、それだと意味を理解しないで使ってしまうと思うんですよね。
と、言う訳で、視覚的にポリシー作成を行なって行きます。
「Choose a service」をクリックします。

まずはサービスの選択ですが、S3と検索ボックスに入力すると、S3が選べるので、クリックします。

続いてアクションですが、S3にファイルを格納（Put）する必要があるので、
「PutObject」と「PutObjectAcl」をチェックします。
（他にもたくさんのアクションがあるので、ここでも検索ボックスに「PutObject」と入力しておくと楽です。）

次に、対象となるバケットを選択します。
「Specific」を選択してから、「Add ARN」をクリックします。

表示されたポップアップでバケット名をします。（バケットは前もって作っておいて下さい）
バケット内のオブジェクトは全てを対象とします。

バケットを選んだ後はこんな感じになります。
確認後、「Review policy」をクリックします。

最後、ポリシーに名前を付けて、「Create policy」でポリシーを作成します。

出来上がったポリシーのjsonはこんな感じです。
結構な手順記載しましたが、内容自体はこれだけ。

3）CORSの設定

サイトがあるドメイン(S3バケット)と問い合わせ内容を保持するドメイン(S3バケット)は違うので、
CORS(Cross-Origin Resource Sharing)を設定する必要があります。
これを設定しないと、後に用意するjavascriptプログラムから問い合わせファイルをアップロードすることが出来ません。

では、AWSコンソール上で、問い合わせ内容を保存するS3バケットを選択し、
Permissionsタブから、「CORS configuration」を選択し、編集を行います。

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>http://officekoma.co.jp.xxxxxxxxxxxxxxxxxx</AllowedOrigin>
    <AllowedMethod>PUT</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

「AllowedOrigin」には、問い合わせフォームがあるサイトのドメイン(S3バケットURL)を指定します。
これを「*」にしてしまうと、先程のidentity pool idを知っていれば、そこら中のドメインからファイルがアップロード出来てしまうので要注意です。

4）問い合わせフォームとアップロードプログラムの作成

後は問い合わせフォーム(html)とアップロードプログラム(javascript)の作成です。

弊社サイトの問い合わせフォームは以下のようになっています。

・問い合わせフォーム(html)

<!doctype html>
<html lang="ja">
<head>
  <!-- 中略 -->
  <script src="https://sdk.amazonaws.com/js/aws-sdk-2.200.0.min.js"></script>
  <script src="../js/s3Upload.js"></script>
  <!-- 中略 -->
</head>
<body>
  <!-- 中略 -->
  <h1>お問い合わせはこちらからお願いします。</h1>
  <p>フォームからの送信に失敗する場合、お手数ですが <a href="mailto:info@officekoma.co.jp">info@officekoma.co.jp</a> まで直接ご連絡ください。<br>
  ※商品・サービスの売り込み、その他営業活動・勧誘などには返信できかねますのでご遠慮ください</p>
  <script type="text/javascript" src="../js/form-validation.js"></script>
  <div class="form_control setting_center">
    <form id="contactForm" action="#">
      <fieldset>
        <p>お名前または会社名(Name)<span class="required">※必須</span></p> <input name="name"  id="name" type="text" class="form_box" autocomplete="name" required />
        <p>メールアドレス(Email)<span class="required">※必須</span></p><input name="email"  id="email" type="text" class="form_box" autocomplete="email" required />
        <p>問い合わせ内容(Comments)<span class="required">※必須</span></p>
        <textarea name="comments" id="comments" class="form_box" rows="4" cols="40" ></textarea>
        <div class="input_submit"><input type="button" value="送信　" name="submit" id="submit"  /></div>
      </fieldset>
      <p id="error" class="warning">送信に失敗しました。恐れ入りますが、再度入力をお願いします。</p>
    </form>
    <p id="success" class="success">お問合わせを送信いたしました。ありがとうございました。内容を確認後、早急にご返信させていただきます。もし数日中に返事が無い場合は、正しく受信できなかった可能性がありますので、恐れ入りますが再度のご連絡をお願いします。</p>
  </div>
  <!-- 中略 -->
</body>
</html>

・アップロードプログラム(javascript)
「contactBucketName」、「bucketRegion」、「IdentityPoolId」をそれぞれの環境に合わせて変更して下さい。

jQuery(document).ready(function($) {
    var contactBucketName = 'homepage-contact';
    var bucketRegion = 'hogehoge';
    var IdentityPoolId = 'hogehoge:xxxxxxxxxxxxxxxxxxxxxxxxxxx';

    AWS.config.update({
        region: bucketRegion,
        credentials: new AWS.CognitoIdentityCredentials({
            IdentityPoolId: IdentityPoolId
        })
    });

    var s3 = new AWS.S3({
        params: {Bucket: contactBucketName},
    });

    // hide messages 
    $("#error").hide();
    $("#success").hide();

    // on submit...
    $("#contactForm #submit").click(function() {
        $("#error").hide();
        
        //name
        var name = $("input#name").val();
        if(name == ""){
            $("#error").fadeIn().text("名前を入力してください。(Name required.)");
            $("input#name").focus();
            return false;
        }
        
        // email
        var email = $("input#email").val();
        if(email == ""){
            $("#error").fadeIn().text("メールアドレスを入力してください。(Email required.)");
            $("input#email").focus();
            return false;
        }

        var now = new Date();
        var obj = {"name":$("input#name").val(), "email":$("input#email").val() ,"comments":$("#comments").val(), "date": now.toLocaleString()};
        var blob = new Blob([JSON.stringify(obj, null, 2)], {type:'text/plain'});
        s3.putObject({Key: now.getTime() + ".txt", ContentType: "text/plain", Body: blob, ACL: "public-read"},
        function(err, data){
            if(err !== null){
                $("#error").fadeIn();
            }
            else{
                $("#success").fadeIn();
                $("#contactForm").fadeOut();
            }
        });
    });

    return false;
});

5）動作確認

実際に問い合わせを行うと、下記のようにファイルがアップロードされます。


ちょっと長くなってしまいましたが、これでPHP無しでも、サイトからの問い合わせの内容を確認する事が出来るようになりました。

とは言うものの、これだと、毎回能動的にS3のバケットを確認しないと問い合わせが確認出来ないので、現実的はありません。
次回は、問い合わせ内容をメールで送信する方法を記事にします。
（なんだか本質とは離れていっていますが、一応「サイトのhttps化」の一環です。）

次回：Amazon S3 で サイト公開（HTTPS）する。（３）問い合わせフォーム準備編その２
前回：Amazon S3 で サイト公開（HTTPS）する。（２）S3での公開準備編