<p>みなさん、ごきげんよう。プレイドの@tik-sonと申します。</p>
<p><a href="http://tech.plaid.co.jp/aws_gcp_multicloud_1/">前回のエントリー</a>では、<br>
弊社の<a href="https://karte.io">KARTE</a>で、インフラには<a href="https://aws.amazon.com">AWS</a>と<a href="https://cloud.google.com/">GCP</a>の２つのクラウドプラットフォームを組み合わせ、マルチクラウドインフラとして利用しているというお話をいたしました。<br>
今回のエントリーではその中から、「AWSとGCPをVPNで接続した」内容についてフォーカスして</p>
<ul>
<li>各クラウドプラットフォームでのVPNの仕様</li>
<li>KARTEではどのようなVPN設計にしているのか</li>
</ul>
<p>等をお話したいと思います。</p>
<h1>目次</h1>
<ul>
<li>VPNを用いる理由</li>
<li>AWSとGCPのSubnetの違い</li>
<li>VPNを接続する</li>
<li>可用性を考える</li>
<li>パフォーマンスを考える</li>
<li>VPN周りの設計について</li>
<li>悩まされたこと</li>
<li>最後に</li>
</ul>
<h1>VPNを用いる理由</h1>
<p><a href="http://tech.plaid.co.jp/aws_gcp_multicloud_1/">前回のエントリー</a>で、マルチクラウドインフラの要件として <strong>「各クラウドプラットフォームのサーバが相互に通信できる」</strong> と記載しましたが、私達はその実現方法としてVPNを選択しました。<br>
VPNであればプライベートネットワークを拡張する形になるので<br>
既存のAWSのネットワーク構成変更を少なく、GCPのサーバとセキュアに通信ができるようにすることができるからです。</p>
<p>もちろんサーバにグローバルIPアドレスを持たせて直接通信させる案も考えましたが、</p>
<ul>
<li>外部に対して通信できるように新たにポートを空けなければならない</li>
<li>通信を暗号化しなければならない</li>
</ul>
<p>など考慮しなければいけないポイントが多くでてきてしまい、実装まで時間がかかりそうだったため、今回は選択しませんでした。</p>
<h1>AWSとGCPのSubnetの違い</h1>
<p>はじめにVPNにて利用するSubnetにおけるAWSとGCPの違いについて軽くお話をします。</p>
<h2>AWSのSubnet</h2>
<p>AWSでプライベートなネットワークを作る時は<a href="https://aws.amazon.com/vpc/">VPC</a>という機能を使います。1つのVPCの中に最大 <code>/16</code> のネットマスクのプライベートネットワークを定義でき、そのプライベートネットワークの中で更にSubnetを切っていくことができます。</p>
<div style="text-align:center"><img src ="https://ik.imagekit.io/newt/61b151f921640c0018173598/a72f0973-8348-4b17-b040-ae9458865846/1-1.png" /></div>
`https://cloud.google.com/compute/docs/networking#subnet_network`
<h2>GCPのSubnet</h2>
<p>GCPではAWSのVPCのようなサービスとして定義はされていないのですが、以下の図のように1つのGCP Networkという単位の中に様々なSubnetを作成することができます。<br>
例えば、<code>10.240.0.0/24</code> と <code>192.168.1.0/24</code> を１つのGCP Networkを共存させることができ、それぞれのSubnetは特に設定不要で相互通信が可能になります。<br>
GCPの方がAWSより柔軟にSubnetを作れるようです。<br>
ただし、Subnetは柔軟に作れますが、 GCP Network上で稼働させるインスタンスの<a href="https://cloud.google.com/compute/docs/networking#quotas_and_limits">台数制限はデフォルトだと7000台</a> だということ は注意しなければなりません。(なかなかその上限に引っかかることは無いと思いますが)</p>
<div style="text-align:center"><img src ="https://ik.imagekit.io/newt/61b151f921640c0018173598/33ed5504-df40-4ef3-ab1f-a51109c43da4/2-1.png" /></div>
<p><code>https://cloud.google.com/compute/docs/networking#subnet_network</code></p>
<h1>VPNを接続する</h1>
<p>VPNには色々な種類がありますが、今回使用するVPNはAWS、GCPが共にサポートしているIPsecVPNになります。</p>
<p>AWSとGCPをVPN接続する際の詳細な手順については<br>
<a href="http://dev.classmethod.jp/cloud/vpn-interconnect-amazon-vpc-and-gce/">クラスメソッドさんの記事</a>に記載されているので参考にさせていだきました。少し古い記事になりますが、流れとしてはほとんど変わっていないので、こちらとあわせて<br>
<a href="http://docs.aws.amazon.com/ja_jp/AmazonVPC/latest/UserGuide/VPC_VPN.html">AWSのドキュメント</a>と<br>
<a href="https://cloud.google.com/compute/docs/vpn/creating-vpns">GCPのドキュメント</a><br>
を参考にしていただければ、特につまることなくVPN接続が出来るかと思います。<br>
記事内でも紹介されていますが、VPN接続の設定順番が重要になってきます。<br>
また、この記事の記載後にGCEのネットワークの機能が拡張されたことで、現在はVPN接続を定義したリージョン以外のインスタンスからもVPN接続を利用できるようになっています。</p>
<h1>可用性を考える</h1>
<p>本番環境で運用する上で可用性を考えないわけにはいきません。<br>
VPNトンネルが１つしかない状態でそのVPNトンネルが切断されてしまうとどうなるでしょうか？<br>
答えは簡単でAWS、GCP間で通信ができなくなるというクリティカルな問題が発生してしまいます。<br>
したがって<code>VPNを冗長化</code> することはとても大切です。</p>
<p>AWSでは1VPN設定に対して、2VPNトンネル、GCPでは1VPN設定に対して1VPNトンネルが提供されます。<br>
GCP、AWS共に2VPN設定ずつ用意し、以下の図のように構成を組むことで、冗長構成を取ることができます。</p>
<div style="text-align:center"><img src ="https://ik.imagekit.io/newt/61b151f921640c0018173598/14be069b-2a93-43b1-b569-f7c034014df7/3-2.png" /></div>
<p><code>http://docs.aws.amazon.com/ja_jp/AmazonVPC/latest/UserGuide/VPC_VPN.html#VPNConnections</code></p>
<p>尚、どちらのプラットフォームにおいても、それぞれのゲートウェイで同じルーティングを設定しておけば、片方のトンネルが落ちてしまった時に残りのトンネルを利用してくれるようになります。</p>
<p><strong>GCP</strong></p>
<blockquote>
<p>Cloud VPN ゲートウェイは、ピア VPN ゲートウェイが停止して一方の VPN トンネルが使用できなくなっても、もう一方の VPN トンネルを使用し続けます。停止した VPN トンネルが復帰すると、また自動的に両方のトンネルを使用します<code>https://cloud.google.com/compute/docs/vpn/advanced#redundancy_and_failover</code></p>
</blockquote>
<p><strong>AWS</strong></p>
<blockquote>
<p>AWS はときどき、仮想プライベートゲートウェイに対して定期的にメンテナンスを実行します。このメンテナンスによって VPN の 2 つのトンネルのうち 1 つが短時間無効になることがあります。このメンテナンスの実行中、VPN 接続は自動的に 2 番目のトンネルにフェイルオーバーします。サービスが中断されないようにするために、両方のトンネルを設定することが重要です。<br>
<code>http://docs.aws.amazon.com/ja_jp/AmazonVPC/latest/NetworkAdminGuide/Introduction.html#CustomerGateway</code></p>
</blockquote>
<blockquote>
<p>カスタマーゲートウェイが使用できなくなった場合に接続が失われるのを防ぐために、2 番目のカスタマーゲートウェイを使用して、VPC および仮想プライベートゲートウェイへの 2 番目の VPN 接続を設定できます。冗長な VPN 接続とカスタマーゲートウェイを使用すれば、1 つのカスタマーゲートウェイでメンテナンスを実行しながら、2 番目のカスタマーゲートウェイの VPN 接続を通してトラフィックの送信を継続することができます。<br>
<code>http://docs.aws.amazon.com/ja_jp/AmazonVPC/latest/UserGuide/VPC_VPN.html#VPNConnections</code></p>
</blockquote>
<p>ちなみに<a href="https://cloud.google.com/vpn/sla">GCPはVPNのSLA</a>が定義されていますが、AWSにはSLAの記述がないようです。<br>
また、GCPにもSLAはありますがGoogleのコントロール外の部分(インターネット等)による問題については保証されていない点については意識しておかなくてはいけません。</p>
<h1>パフォーマンスを考える</h1>
<p>もちろん本番環境で運用する上では可用性だけではなくパフォーマンスも考えないわけにはいきませんよね。ということで話をします。</p>
<h2>VPNのスループット</h2>
<p>各プラットフォームは以下の通りスループットについて説明があり、まとめると以下の通りです。</p>
<ul>
<li>AWSでは仕様上、スループットの制限は特にない</li>
<li>GCPは仕様上、VPN ゲートウェイごとに1.5 Gbpsまでのスループットのサポートはしている</li>
<li>スループットは利用環境によって変わるので実質、保証はされない</li>
</ul>
<p><strong>AWS</strong></p>
<blockquote>
<p>Q: VPN 接続のスループット制限はありますか?<br>
VPN のスループットについて、Amazon はいかなる制限も実施していません。ただし、その他の要因、例えばカスタマーゲートウェイの暗号化能力や、お客様側のインターネット接続速度、平均パケットサイズ、使用されているプロトコル（TCP か UDP か）、カスタマーゲートウェイと仮想プライベートゲートウェイの間のネットワークレイテンシーなどが、スループットに影響を与える可能性があります。<br>
<code>https://aws.amazon.com/jp/vpc/faqs/</code></p>
</blockquote>
<p><strong>GCP</strong></p>
<blockquote>
<p>各 Cloud VPN ゲートウェイでは、すべてのトンネルで最大 1.5 Gbps のスループットがサポートされています。スループットを最大にするには、トンネルごとに Cloud VPN ゲートウェイを作成します。 実際のパフォーマンスは次の要因によって変動します。</p>
</blockquote>
<ul>
<li>2 つの VPN ピア間のネットワーク容量。</li>
<li>ピアデバイスの機能。詳しくは、デバイスのドキュメントをご覧ください。</li>
<li>パケットサイズ。パケット単位で処理が発生するため、小さなパケットの割合が高いと全体的なスループットが低下します。</li>
<li>RTT やパケット損失率の値が高いと、TCP のスループットが大幅に低下します。<br>
<code>https://cloud.google.com/compute/docs/vpn/advanced#vpn_throughput</code></li>
</ul>
<h2>VPNトンネルへのトラフィックをコントロール</h2>
<p>スループットについてお話しましたが、仕様上においても1VPNトンネルだけだとスループットに限界があるため、複数のVPNトンネルを組み合わせることが大切だということが分かると思います。<br>
AWS、GCP共に、トラフィックを流すVPNトンネルをコントロールすることができるので、その仕様について紹介します。両クラウドプラットフォームともにトラフィックをコントロールすることはできるものの出来ることが少し異なっています。</p>
<p><strong>GCP</strong></p>
<ul>
<li>各VPNトンネルへのルーティング、Priorityを同じにすると、トラフィックをそれぞれのトンネルにバランシングしてくれます。</li>
<li>各VPNトンネルへのルーティングを同じにし、Priorityに差をつけると、Priorityが高いVPNトンネルがプライマリーのVPNトンネルとして利用されるようになります。<br>
<code>https://cloud.google.com/compute/docs/vpn/advanced#redundancy_and_failover</code></li>
</ul>
<p><strong>AWS</strong></p>
<ul>
<li>
<p>VPCのVPNでは Multi Path でのルーティングには未対応なので、バランシングはしてくれません。AWS側で定められたロジックによって、必ずVPNトンネルのどれかを利用することになります。<br>
<code>http://docs.aws.amazon.com/ja_jp/AmazonVPC/latest/NetworkAdminGuide/Introduction.html#MultipleVPNConnections</code></p>
</li>
<li>
<p>静的ルーティングの場合は最も具体的な IP プレフィックスが優先されます。<br>
例を示します。(参考: <a href="http://docs.aws.amazon.com/ja_jp/AmazonVPC/latest/UserGuide/VPC_Route_Tables.html#route-tables-priority">ルーティングの優先度について</a>)</p>
<p>IP プレフィックスについて少しややこしいと思うので以下の静的ルーティングが設定されたVPN1、VPN2という2つのVPN接続を例に説明してみます。</p>
  <table>
  <tr>
  <th> </th>
  <th>VPN1</th>
  <th>VPN2</th>
  </tr>
  <tr>
  <td>設定された静的ルーティング</td>
  <td>10.1.0.0/18,  10.1.64.0/18,  10.1.128.0/17</td>
  <td>10.1.0.0/17, 10.1.128.0/18, 10.1.192.0/18</td>
  </tr>
  </table>
  この場合
  - 全VPNが正常な場合はそれぞれ `/18` を設定したVPNが優先になります。
  - 片方のVPN切断時には `/18` で設定されたルーティングを包括する `/17` のルーティングが別のVPNに設定されているのでそちらの経路が使って迂回されることになります。
</li>
</ul>
<h1>VPN周りの設計について</h1>
<p>可用性やパフォーマンスについて記載してきましたが、それらを踏まえてVPN周りは以下のように設計にしています。</p>
<ul>
<li>VPNトンネルは複数作成する。</li>
<li>特定のVPNトンネルにトラフィックが偏らないように、
<ul>
<li>GCP側のサーバは複数のSubnetにサーバを分散させて配置する。</li>
<li>AWS側のルーティングは特定のSubnetへの通信が特定のVPNトンネルを利用するよう設定する。</li>
<li>GCP側のルーティングは全VPNトンネルでバランシングされるように同じプライオリティで同じ内容を設定する。</li>
</ul>
</li>
<li>VPNトンネルが切断された時に別トンネルで迂回できるよう、
<ul>
<li>AWS側のルーティングでは全VPNトンネルに対して別VPNトンネルのルーティングを包括するルーティングを記載しておく。</li>
<li>GCP側のルーティングでは全VPNトンネルに対して、同じルーティングを設定しておく。</li>
</ul>
</li>
</ul>
<p>イメージとしては以下の図のようになります</p>
<div style="text-align:center"><img src ="https://ik.imagekit.io/newt/61b151f921640c0018173598/976999df-225b-4dbb-9f5c-d01a2270601c/4-1.png" /></div>
<p>ちなみにKARTEではシンプルなネットワーク構成にしているので、静的ルーティングを利用し<br>
ています。</p>
<h1>悩まされたこと</h1>
<h2>VPNのDropパケットの増加問題</h2>
<p>AWSとGCPをVPNで接続して運用していたある日、GCPのサーバのパフォーマンスが悪化することがありました。<br>
GCPは<a href="https://www.stackdriver.com/">StackDriver</a>でVPNの様々なメトリックををモニタリングできるので確認してみたところ、特定のVPNトンネルでDropパケットの増加が見受けられました。<br>
VPNトンネルが切断されてしまえば別のVPNトンネルを利用するようにしていたのですが、そのVPNトンネルは劣化した状態で生き続けていました。<br>
対応としては、特定のVPNトンネルの問題として判断し、劣化したVPNトンネルを切断し正常なVPNトンネルのみを利用するようにしたところ現象が改善しました。</p>
<p>後々、GCP、AWS両方のサポートなどに問い合わせて原因を突き詰めていったところ、AWSにおけるネットワークの劣化が原因で、VPNトンネルは落ちないがパケットがDropされているという状況でした。<br>
ネットワーク周りの問題は切り分けが難しいですが、モニタリングツールが存在することで切り分け、対応が迅速に行うことが出来ました。<br>
この件以降、VPNトンネルに対し、DropパケットなどのMetricでアラートを仕掛けるようにしています。</p>
<h2>VPNのスループット問題</h2>
<p>元々単一クラウドプラットフォーム内のプライベートネットワーク内で通信していたものをVPN越しで通信させようとすると、想定した以上にアプリケーションの性能が出ませんでした。<br>
その主な理由としては、DBとの通信の多くがVPN経由になっていたことでした。</p>
<p>VPNトンネルを増やしていけば暫定的には解決できる話になりますが、そもそも元々のアーキテクチャがマルチクラウドインフラに最適なアーキテクチャになっているとは言えなかったので、その部分について考え直しました。このあたりの話はまた別エントリーでお話しようと思うので乞うご期待を。</p>
<h1>今後について</h1>
<p>AWSとGCPの周りにはまだまだ改善の余地はあるので、今後以下を考えていきたいと思っています。</p>
<ul>
<li>特定の条件でVPNトンネル切断→接続する等のVPN運用周りでの自動化の仕組み</li>
<li>VPNトンネルのAutoscalingの仕組み</li>
<li>VPN経由ではないサーバ間通信の仕組み</li>
</ul>
<h1>最後に</h1>
<p>ウェブ接客プラットフォーム「KARTE」を運営するプレイドでは、マルチクラウドインフラを成長させたい、KARTEを使ってこんなアプリケーションが作りたい！ KARTE自体の開発に興味がある！というエンジニア（インターンも！）を募集しています。<br>
詳しくは<a href="https://plaid.co.jp/recruit/engineer.html">弊社採用ページ</a>、または<a href="https://www.wantedly.com/companies/plaid/projects">Wantedly</a>をご覧ください。 もしくはお気軽に、下記の「話を聞きに行きたい」ボタンを押してください！</p>
<div class="wantedly-visit-button" data-visit-button-id="lyE_IgY4VF5ukBo_EUKZLg" data-width="300" data-height="60"></div>
<script>
  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "https://platform.wantedly.com/visit_buttons/script.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, "script", "wantedly-visit-buttons-wjs"));
</script>


AWSとGCPのマルチクラウドインフラにおけるVPN設計のポイントを説明します。
マルチクラウドインフラ連載の第二回。

AWSとGCPのマルチクラウドインフラにおけるVPN設計のポイント| PLAID engineer blog

AWSとGCPのマルチクラウドインフラにおけるVPN設計のポイント

<html><head></head><body><p>ごきげんよう。プレイドの@tik-sonと申します。<br>
みなさんはクラウドプラットフォームを利用していますか？</p>
<p>弊社の<a href="https://karte.io" target="_blank" rel="noreferrer">KARTE</a>は</p>
<ul>
<li>秒間3000イベントをリアルタイムで解析</li>
<li>累計解析ユーザがリリースから2年で12.5億<br>
https://karte.io/infographic/2017.html</li>
</ul>
<p>という規模のサービスになっています。<br>
そこで動いているインフラもそれなりに大規模になっており、インフラをいかに改善していくかが事業進捗に大きく関わってきます。</p>
<p>そのインフラを改善する試みとして半年ぐらい前から、<a href="https://aws.amazon.com" target="_blank" rel="noreferrer">AWS</a>と<a href="https://cloud.google.com/" target="_blank" rel="noreferrer">GCP</a>の２つのクラウドプラットフォームを組み合わせ、マルチクラウドインフラとして利用しています。<br>
<a href="http://tech.plaid.co.jp/" target="_blank" rel="noreferrer">PLAID Enginner Blog</a>では複数回に渡ってマルチクラウドインフラを作る上で試行錯誤したポイントなどを紹介していこうと思います。<br>
今回は初回ということで概要部分について記載し、次回以降のエントリーで深掘りをしていきます。<br>
興味を持たれた方は本ブログをブックマーク等をしていただけば幸いです。</p>
<h1 id="目次">目次</h1>
<ul>
<li>マルチクラウドインフラとは？</li>
<li>なぜマルチクラウドインフラを作るのか？</li>
<li>マルチクラウドインフラの構成</li>
<li>マルチクラウドインフラへの移行手順</li>
<li>まとめ</li>
<li>最後に</li>
</ul>
<h1 id="マルチクラウドインフラとは？">マルチクラウドインフラとは？</h1>
<p>私達がお話するマルチクラウドインフラとは、<br>
複数のクラウドプラットフォームを組み合わせ、それぞれのサーバが相互通信でき、あたかも１つのプラットフォームのように稼働させることができるインフラのことです。<br>
イメージにすると以下の図のようになります。</p>
<div style="text-align:center"><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/77d17f92-74f7-4789-8e80-a0fd89074a1b/1.png"></div>
<h1 id="なぜマルチクラウドインフラを作るのか？">なぜマルチクラウドインフラを作るのか？</h1>
<h2 id="可用性の向上">可用性の向上</h2>
<p>各クラウドプラットフォームではそれぞれのサービスごとにSLAが定義されていますが、100%の稼働を保証するものではありません。<br>
<a href="https://cloudharmony.com/" target="_blank" rel="noreferrer">CloudHarmony</a>というサービスで過去の稼働率を確認することが出来るのですが、例えば、<a href="https://aws.amazon.com/ec2" target="_blank" rel="noreferrer">EC2</a>、<a href="https://cloud.google.com/compute/" target="_blank" rel="noreferrer">GCE</a>においてもDowntimeはそこそこ発生しているようです。</p>
<div style="text-align:center"><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/9361312a-04fd-445e-9c56-3a01eb3aa8e3/2.png"></div>
<div style="text-align:center"><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/b3efb0ce-00bb-4ac6-afd9-a4ea45e23788/2.5.png"></div>
<p>また、各クラウドプラットフォーム内にてMultiAZやMultiRegionの構成を取ることで可用性を高めることは可能ですが、クラウドプラットフォームの共通部分で問題が起きてしまうと、MultiAZやMultiRegion構成を取っていてもサービスダウンを避けることは出来ません。<br>
実際、GCPで<a href="https://status.cloud.google.com/incident/compute/16020#5177473553661952" target="_blank" rel="noreferrer">LoadBalancerがリクエストをサーバにフォワード出来ず、502のreponseを返すという障害</a>が発生したこともあります。<br>
複数の異なるクラウドプラットフォームで稼働させることは、単一クラウドプラットフォームの障害の影響を抑えることができ、可用性を高めることができます。</p>
<h2 id="パフォーマンスの向上">パフォーマンスの向上</h2>
<p><a href="https://aws.amazon.com/products/" target="_blank" rel="noreferrer">AWS</a>、<a href="https://cloud.google.com/products/" target="_blank" rel="noreferrer">GCP</a>共に様々な特色のサービスを提供しています。<br>
それぞれのサービスには得意、不得意な部分があり、適材適所で使うことでアプリケーションのパフォーマンスを向上させることができます。<br>
KARTEにおいても処理の一部をGCPの<a href="https://cloud.google.com/bigtable/" target="_blank" rel="noreferrer">Cloud Bigtable</a>に置き換えたことにより、パフォーマンスが大きく改善しました。</p>
<p>ただ、「AWSのEC2からGCPのCloud Bigtableを利用する」といったようなクラウドプラットフォームをまたいでサービスを利用する際は、以下の要素がパフォーマンスを悪化させることがあり、無視することはできません。</p>
<ul>
<li>同じクラウドプラットフォーム内からの通信に比べて Latencyが大きくなる</li>
<li>各クラウドプラットフォーム管理外のネットワークが間に挟まってしまうので、問題が起きやすくなる</li>
</ul>
<p>当然ですが、Cloud BigtableのSLAにも <code>(c) errors: (i) caused by factors outside of Google's reasonable control; </code> というようにGoogleのコントロール外の部分でのエラーはSLA適用外と明記されています。<br>
https://cloud.google.com/bigtable/sla</p>
<p>サーバを手軽にそれぞれのプラットフォームに配置できる状態を作り、利用サービスの近くにサーバを配置させることで、各サービスの恩恵をより多く受け、アプリケーションのパフォーマンスを向上させることができます。</p>
<h2 id="コストの低減">コストの低減</h2>
<p>各クラウドプラットフォームのサービスを適材適所に利用するだけでコストの低減が期待できるように思えますが、何も考えずに他クラウドプラットフォームのサービスを使用してしまうと、パフォーマンスは向上はする一方で、膨大なコストがかかってしまうことがあります。<br>
Cloud Bigtableを例に考えてみます。<br>
Cloud BigtableはGCPのサービスですが、もちろんAWSからも利用することができます。しかしAWS側から利用するとなると、インターネット経由でCloud Bigtableと通信することになるので、以下の図のように <strong>データ転送コストが有料</strong>になってしまいます。</p>
<div style="text-align:center"><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/2a5a6ab0-6f8d-4e7a-8864-0ad5c52b6392/3.png"></div>
<ul>
<li>EC2でのCloud Bigtableからのread(①)はCloud BigtableのInternet EgressとしてGCP側で課金</li>
<li>EC2からCloud Bigtableへのwrite(②)はEC2のInternet EgressとしてAWS側で課金</li>
<li>Cloud Bigtableと同RegionのGCEであればread(③)、write(④)共に無料</li>
</ul>
<p>少量のデータを扱う際には対して気にならないかもしれませんが、大量のデータを扱うサービスは注意が必要です。請求を見て寿命が縮むことになります。<br>
実際に私達もCloud Bigtableの請求を見て寿命が縮んだ経験があります。<br>
私達がCloud Bigtableを導入しようと検証していた際にはインターネット経由のデータ転送コストが <strong>無料</strong> だったのですが、あるタイミングから有料に変更になり、気がついた時には <strong>サービス使用量全体の約30%</strong> をCloud Bigtableデータ転送コストが占めていたこともありました。。コストのアラートは適切に設定しておくことをおすすめします。<br>
パフォーマンスの話と同様にコストにおいても、サーバを手軽にそれぞれのプラットフォームに配置できる状態を作り、利用サービスの近くにサーバを配置させることは重要です。</p>
<h2 id="そこに新しくて良い技術があったから">そこに新しくて良い技術があったから</h2>
<p>新しいサービス/技術はどんどん触りたいし、良いものはどんどん導入したいというモチベーションが煮えたぎっていました。**「そこに新しくて良い技術があったから」**というのはプレイドのエンジニア文化として根付いています。</p>
<h1 id="マルチクラウドインフラの構成">マルチクラウドインフラの構成</h1>
<p>上記のモチベーションを元に作ってみたマルチクラウドインフラの構成概要図を掲載します。<br>
詳細は別のエントリーでお話することになると思いますが、ポイントとしては以下の通りです。</p>
<ul>
<li>AWS、GCPのPrivateNetworkをVPNで接続する。</li>
<li>Cloud Bigtableや<a href="https://cloud.google.com/bigquery/" target="_blank" rel="noreferrer">Bigquery</a>などGCPのサービスを多く使うサーバは主にGCPで、<a href="https://aws.amazon.com/jp/dynamodb/" target="_blank" rel="noreferrer">DynamoDB</a>などAWSのサービスを多く使うサーバは主にAWSで稼働させる。</li>
<li>特定のクラウドプラットフォームで何か問題があっても片方のクラウドプラットフォームで動くようにする。</li>
</ul>
<div style="text-align:center"><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/11449304-378e-4495-b7d0-9e0a5a173e88/4.png"></div>
<p>また、運用周りのツール/サービスは基本的マルチクラウド対応しているものを利用しています。以下に一部を記載します。</p>
<div class="TableScroll"><table>
<tbody><tr>
<th>用途</th>
<th>ツール名</th>
</tr>
<tr>
<td>インフラの構成管理</td>
<td><a href="https://www.terraform.io/" target="_blank" rel="noreferrer">Terraform</a></td>
</tr>
<tr>
<td>マシンイメージの作成</td>
<td><a href="https://www.packer.io/" target="_blank" rel="noreferrer">Packer</a></td>
</tr>
<tr>
<td>マシンイメージのテスト</td>
<td><a href="http://serverspec.org/" target="_blank" rel="noreferrer">Serverspec</a></td>
</tr>
<tr>
<td>メトリックの監視/アラート</td>
<td><a href="https://www.datadoghq.com/" target="_blank" rel="noreferrer">Datadog</a></td>
</tr>
</tbody></table></div>
<h1 id="マルチクラウドインフラへの移行手順">マルチクラウドインフラへの移行手順</h1>
<p>KARTEは元々はAWS上でのみで稼働していたので、既存のAWSで作っていた仕組みをベースに以下のステップでマルチクラウドインフラへと移行していきました。<br>
ちなみに移行作業はKARTE利用ユーザに影響が出ないよう、サービス停止を伴うメンテナンス作業は実施せずに進めていきました。<br>
本エントリーでは概要を説明するにとどまりますが、各ステップで試行錯誤したポイントについては次回以降のエントリーで記載していこうと考えています。</p>
<ol>
<li>AWSとGCPをVPNで接続する</li>
<li>GCPでAWSと同じようにリソースを立てれるようにする</li>
<li>GCPでリソースを一部稼働させパフォーマンスを計測する</li>
<li>計測したパフォーマンスを元にマルチクラウドを意識した構成/コードに修正する</li>
<li>修正完了後、GCPの割合を徐々に増やしていく</li>
<li>運用を整える</li>
</ol>
<p>*3,4,5のステップは一度ではなく何度も繰り返し、構成/コードを洗練させていきました。</p>
<h1 id="まとめ">まとめ</h1>
<h2 id="良かった点">良かった点</h2>
<h3 id="可用性の向上">可用性の向上</h3>
<p>前述したようにGCPで<a href="https://status.cloud.google.com/incident/compute/16020#5177473553661952" target="_blank" rel="noreferrer">LoadBalancerがリクエストをサーバにフォワード出来ず、502のreponseを返すという障害</a>が発生したのですが、AWS/GCPのマルチクラウドインフラを作った後だったため、AWSに寄せて稼働させることができ、その影響を抑えることができました。</p>
<h3 id="パフォーマンスの向上">パフォーマンスの向上</h3>
<p>Cloud Bigtableなど適材適所にサービスを導入し、GCPとAWSで双方で問題なく動かせるよう構成/コードを見直した結果、マルチクラウドインフラ構築前に比べ、パフォーマンスが格段に向上しました。<br>
またAWS/GCPそれぞれのサービスを導入しやすくなり、マルチクラウドインフラ構築後においても、日々パフォーマンスは改善しています。</p>
<h3 id="コストが 約40%低減">コストが 約40%低減</h3>
<p>データ転送コストを抑えつつ、パフォーマンスを向上させた結果、コストが約40%低減しました。</p>
<h3 id="エンジニアとしてのレベルアップ">エンジニアとしてのレベルアップ</h3>
<p>まとまった情報があまりない取り組みだったので、自分で考え抜く力、もがいて結果を出すという力が向上しました。</p>
<h2 id="意識しておかなければいけない点">意識しておかなければいけない点</h2>
<h3 id="利用サービスが増えることによって、学習コストも増える">利用サービスが増えることによって、学習コストも増える</h3>
<p>プレイドでは「新しいサービス/技術はどんどん触って、いいものはどんどん導入しようという」絶対的な文化があるので本項目は基本的には歓迎なのですが、企業文化やステージによっては考える必要があると思います。</p>
<h3 id="移行コストについて">移行コストについて</h3>
<p>やってみないと分からない部分はありますが、移行に伴う以下のコストをある程度見積もっておくことは重要です。</p>
<ul>
<li>インフラのコスト：検証時、移行作業時にリソースを追加で立てる必要があるので</li>
<li>人のコスト：インフラの改修だけではなく、サービスのアーキテクチャを把握した上でコードの改修等の作業も必要になってくると思うので、それなりに覚悟は必要になります。折れない心が大切でした。プレイドではインフラ、アプリケーション、opsまで一通り修正をエンジニア2.5人×3ヶ月で実施しました</li>
</ul>
<h1 id="最後に">最後に</h1>
<p>私達のマルチクラウドインフラはまだ始まったばかりで、随時、拡張/改善していきたいと思っています。<br>
プレイドでは、マルチクラウドインフラをもっと成長させたい、KARTEを使ってこんなアプリケーションが作りたい！ KARTE自体の開発に興味がある！というエンジニア（インターンも！）を募集しています。<br>
詳しくは<a href="https://plaid.co.jp/recruit/engineer.html" target="_blank" rel="noreferrer">弊社採用ページ</a><br>
または<a href="https://www.wantedly.com/companies/plaid/projects" target="_blank" rel="noreferrer">Wantedly</a><br>
をご覧ください。 もしくはお気軽に、下記の「話を聞きに行きたい」ボタンを押してください！</p>
<div class="wantedly-visit-button" data-visit-button-id="lyE_IgY4VF5ukBo_EUKZLg" data-width="300" data-height="60"></div>
<script>
  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "https://platform.wantedly.com/visit_buttons/script.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, "script", "wantedly-visit-buttons-wjs"));
</script>
</body></html>

AWSとGCPでマルチクラウドインフラを始めた話。複数回連載予定の第一回です！

AWSとGCPでマルチクラウドインフラを構築した話とそのポイント| PLAID engineer blog

AWSとGCPでマルチクラウドインフラを構築した話とそのポイント

<p>こんにちは、プレイドの@wikrshです。</p>
<p>弊社の<a href="https://karte.io/">KARTE</a> では属性データやサイト上での行動情報など様々なデータを元に来訪したユーザーの状況をリアルタイムに可視化しており、どのような情報の見せ方をすればよりユーザーへの理解を深められるのか、社内では日々議論・改良を重ねています。</p>
<p>今回は現在KARTEで行っているものとは異なる表現を実験してみたい + アニメーションを作るのが面白そうという動機で、「各ユーザーがサイト内の各ページを遷移している様子」の可視化に取り組んでみましたので紹介いたします。</p>
<h1>作成するアニメーションのイメージ</h1>
<p>各ページをノードとして表し、ユーザーを表すノードが各ページのノードを移っていく形で表現することを考えました。</p>
<p><code>/page1</code>を見ていたあるユーザーが<code>/page2</code>にアクセスした場合は、<code>/page1</code>を表すノードから<code>/page2</code>を表すノードへユーザーを表すノードが移動するイメージです。</p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/890d6805-9a38-4b41-b9b8-4fd9fc66baeb/blog.001.jpeg" alt=""></p>
<p>このノードを各ページ・各ユーザーについて表示して、時刻を変化させる（再生する）ことで、各時刻でユーザーがどのように移動しているかを可視化することが今回の目標です。<br>
実装にはチュートリアルや例が豊富でありアニメーションも容易な <a href="https://d3js.org/">D3.js</a> を使用し、ブラウザ上にSVGで表示を行うことにしました。</p>
<h1>ページの表現</h1>
<p>サイト内の各ページの配置方法は様々考えられますが、今回はサイト間のページ構造に依らずに適用でき、かつ実装も容易であるため環状に配置することを考えました。</p>
<p>各ページ間の遷移についてはこれらのノード間を移動させることで表現できますが、セッションの初回アクセスは表現できません。<br>
そのため、中心にノードを一つ配置し初回アクセス時は中心のノードからアクセスページへ移動するものとします。</p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/faccdde3-0d1f-4e0e-8ede-6d39c2355504/blog.002.jpeg" alt=""></p>
<p>また、各ページを閲覧しているユーザー数はページのノードの大きさで表現することにしました。<br>
SVGの<code>circle</code>の大きさは半径で指定しますが、面積をユーザー数に比例させたいので半径はユーザー数の平方根に比例させるようにします。</p>
<iframe width="100%" height="200" src="//jsfiddle.net/wikrsh2/a4owsx0d/embedded/result,js/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
<h1>閲覧中のユーザーの取得</h1>
<p>今回は一般的なアクセスログを想定し、一つのレコードが、</p>
<ul>
<li>アクセス日時</li>
<li>ユーザーID</li>
<li>アクセスしたページ</li>
</ul>
<p>の情報からなるデータを使用します。</p>
<p>このデータに従ってある時刻<code>t</code>で発生したページアクセスを表示すれば良いのですが、このデータからはユーザーがいつページの閲覧を止めたか（離脱したか）は分かりません。<br>
ページアクセス以外のデータを組み合わせればより正確な離脱の計測も可能ですが、今回は簡単のためページアクセスから一定時間<code>T</code>経ったら閲覧を止めたとみなすことにします。</p>
<p>この条件の元である時刻<code>t</code>でサイトを閲覧中のユーザーを考えると、ページアクセスの時系列データの内、時刻<code>t-T</code>〜<code>t</code>でページアクセスをしたユーザーになります。</p>
<p><img src="https://ik.imagekit.io/newt/61b151f921640c0018173598/a19b9522-01e0-464c-8e71-9d1dd7378a1b/blog.003.jpeg" alt=""></p>
<p>アニメーションの再生時は、この時刻<code>t</code>を進める→閲覧中のユーザーを更新という流れを繰り返して表示を行います。</p>
<h1>ユーザーのページ遷移アニメーション</h1>
<p>ユーザーがページ間を遷移するアニメーションはD3.jsの <a href="https://github.com/d3/d3-transition">transition</a>で実装します。<br>
詳細については多くのチュートリアルや例があるので割愛しますが、D3.jsを使用するとシンプルにアニメーションを実装できます。</p>
<iframe width="100%" height="200" src="//jsfiddle.net/wikrsh2/hbgb5v3v/embedded/result,js/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
<p>注意点としては、ユーザーとノードを対応させるためにユーザーIDをキーとして渡す必要があります。<br>
これを行わないと、異なるユーザーのノードが使われてしまう可能性があります。</p>
<p>キー指定無し：</p>
<iframe width="100%" height="200" src="//jsfiddle.net/wikrsh2/bjzkmnfe/embedded/result,js/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
<p>キー指定有り：</p>
<iframe width="100%" height="200" src="//jsfiddle.net/wikrsh2/sdcuzkxp/embedded/result,js/" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
<p>上の例ではデータ上は2人のユーザーがページを遷移していますが、キー指定無しの場合はノードとユーザーの紐付けが行われないため、遷移が起こっていないように見えてしまいます。</p>
<h1>作成したアニメーション</h1>
<p>弊社の運営する<a href="http://shopping-tribe.com/">Shopping Tribe</a>へのある日のアクセスデータをサンプリングした上で抽出してアニメーションを作成してみました。<br>
ノード数を抑えるためにアクセス数の上位49ページをそれぞれ一つのノードで表し、残りのページへのアクセスは一つのノード（<code>others</code>）にまとめて表現しました。</p>
<iframe src="https://player.vimeo.com/video/207268708" width="640" height="668" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
<p>作成したアニメーションを眺めていると、</p>
<ul>
<li>各ページへのアクセスのほとんどはサイト外からの流入で行われており、トップページ等サイト内での遷移からのアクセスの割合は多くない</li>
<li>アクセスの集中しているページとその他のページ間の遷移が多いわけではなく、決まった遷移の流れにはなっていない</li>
<li>アクセス数が上位49ページに入っていないページへのアクセス割合が比較的大きく、幅広くアクセスが発生している</li>
</ul>
<p>といった大まかな傾向は見てとれますが、新しい知見を得るためにはまだまだ改良が必要そうです。</p>
<h1>最後に</h1>
<p>今回行ってみたユーザー行動の可視化では、大まかなユーザーの動きの傾向や時間帯ごとの動きの違い程度の傾向はつかめるように思いますが、データから新しい知見を得るという点までは達しておらず、サイトに来訪したユーザーについての理解を深めるためには改良が必要そうです。</p>
<p>ここから意義のある知見を得られるレベルまで改良するには、</p>
<ul>
<li>個々のユーザーをどのように表現するか</li>
<li>各ページのノードをどのように配置するのが良いか</li>
</ul>
<p>が主なポイントになるかと思います。</p>
<p>特に、個々のユーザーの表現方法については、KARTEに取り込まれたユーザー情報やセグメント情報と合わせればより多くの知見を得られるのではなかと思いますので、より良い表現を考えたいところです。<br>
また、今回は閲覧データのみを使用しましたが、KARTE上には購入や会員登録を含む様々な行動データが存在するため、閲覧よりもより細かい行動の遷移を見るのも面白そうです。</p>
<p>ウェブ接客プラットフォーム「<a href="https://karte.io/">KARTE</a>」を運営するプレイドでは、KARTEを使ってこんなアプリケーションが作りたい！ KARTE自体の開発に興味がある！というエンジニア（インターンも！）を募集しています。<br>
詳しくは<a href="https://plaid.co.jp/recruit/engineer.html">弊社採用ページ</a><br>
または<a href="https://www.wantedly.com/companies/plaid/projects">Wantedly</a><br>
をご覧ください。 もしくはお気軽に、下記の「話を聞きに行きたい」ボタンを押してください！</p>
<div class="wantedly-visit-button" data-visit-button-id="lyE_IgY4VF5ukBo_EUKZLg" data-width="300" data-height="60"></div>
<script>
  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "https://platform.wantedly.com/visit_buttons/script.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, "script", "wantedly-visit-buttons-wjs"));
</script>


D3.jsを使ってユーザーがサイト内の各ページを遷移している様子をアクセスログから可視化してみました。