LoginSignup
9

posted at

updated at

仕事でサーバレスのウェブサイトを作ってしまった話

さくらインターネット Advent Calendar 2022 16日目の記事です。

4度目まして。さくらインターネットで情シスをしている小泉行生(dumixnet)と申します。
今年は仕事でさくらのサービスを全力で使った話を書こうと思います。

前置き

2020年から「株主総会」という大イベントの「配信・システム担当」を行なっております。
この2020年から株主総会は配信を行なっており、以前にもお話をしたので割愛します。
2022年は「ハイブリッド型株主総会」リアルな会場とは別にインターネット上に「バーチャル会場」を用意し、
株主はオンラインのバーチャル会場でも「議長に質問できたり、議決権を行使できたり」します。

なんでウェブサイトを作ることになったのか?

ハイブリッド型株主総会では「バーチャル会場」が存在するため、
バーチャル会場のシステムに何かがあった場合には株主にお知らせすることが必要となります。
そのために「バーチャル会場」へ入る前の「クッションサイト」が必要だ!ということになりました。
「クッションサイト」は sakura.ad.jp のサブドメインを利用して作成し以下のようなことが要件になりました。

  • バーチャル会場の開場時間に合わせてサイトをオープンさせ「同意」を得てからバーチャル会場へのリンクを踏ませる
  • 会場でトラブルがあった場合、「トラブルの内容を最高速で表示させる」
  • 総会が終わって時間になったら「バーチャル会場へのリンクを閉じる」

「超超超超大人気のウェブサイト担当を一人」をこのために拘束するのは難しく、
「自分たちでできるようにしよう!」という話の「技術面」について私に白羽の矢が立ちました…

一般的な方法を使おうと思ったら

レンタルサーバーを契約して、必要なHTMLをFTPでアップロードという典型的な手段を取ろうと思い、
レンタルサーバチームに相談を持ちかけたら
@masa23 さんから 「ワシが育てておいたからあとは使うだけだ(意訳)」とURLを頂きました。

さくらの「オブジェクトストレージ」と「ウェブアクセラレーター」を組み合わせると
サーバーなしでウェブサイト作れるの?と思いながら設定をしていくと!?

できました… 普通に完成しました。

@masa23 さんに感謝の念を送りつつ、株主総会のウェブサイトは無事に運用でき、滞りなく終了できました!

今回の知見

バケット名を設定しないといつまで経っても繋がらない

オブジェクトストレージにHTMLファイルをアップする際に設定に困ったところがありました。
サーバ名、アクセスID、シークレットキーを入れたらだいたいアクセスできるはずなので…
いつまでたっても接続エラーで繋がらない。
設定を見直しても、パソコンを再起動しても、無線LANルーターとかONUの再起動をしても繋がらない…
もう「徳が足りない」のかと諦めかけていたところで @chibiegg さんが ヒントをくれました。
「バケット名を設定しないと動かないですよー」
なんだってー!!! というわけで「設定できそうな部分を全部確認してようやく見つけました。

設定する場所は?

CyberDuckなら詳細設定の「パス」
WinSCPなら「高度なサイト設定」の「ディレクトリ」の「リモートディレクトリ」

ウェブアクセラレーターのキャッシュを削除

ウェブアクセラレーターは「複数のウェブサーバでコンテンツをキャッシュし、負荷を分散して配信する」が本来の役目です。
今回の場合「任意のタイミングでHTMLを更新する」ので、
更新した時には「ウェブアクセラレーター側のキャッシュをクリア」しないとサイトのHTMLが更新されないんです。
HTMLが更新されてないなら「Ctrl+F5」押せば?という話ではないのです。
自分で「キャッシュをクリアしないと新しいHTMLが表示されないのです!!!
リハーサルの際に1回キャッシュをクリアし忘れて、冷や汗をかきました…

「少しクセがあります」が、短期的に使う「静的サイト」ならレンタルサーバーを使わずにサイトが作れます!

お値段 高いんでしょ??

今回の場合、利用期間は6月の3週間ほどで、オブジェクトストレージの基本料金(495円)のみの課金!
ウェブアクセラレーターは「無償枠(500GiB)」があり、その枠内で収まりました。
2個のサービスを連携して使ってるから1000円とか2000円、いやもっと高いだろうと思ったんですが…
後で確認したら、オブジェクトストレージの基本料金だけだったのでこんなにできて吸っているタバコ1箱より安いのか!
って驚いてました!

GitHubにも驚かされた機能があった

さて… 実はこのネタにはもう一個発見がありまして、それはGitHubの機能でした。

HTMLを作る際に、次回以降でも使えるように社内ネットワークにあるGitHub Enterpriseでファイルの管理を行いました。
その際、「テストサイト」にHTMLをアップロードして内容を見てもらう方式だと
「インターネット越しに内容が見えてしまう可能性」がありました。

そこで「どうしたらいいんだろう…
やっぱりレンタルサーバで.htaccess制限かけないとだめかなぁ? もしくは社内にサーバを建てて…」とぼやいていてところ
またしても @chibiegg さんの神のひと声が!
「GitHubならPages使ったらええんちゃう?」

これならわざわざサーバを建てずともVPNでの社内接続をするので「外部に漏らさない」という要件はクリアしつつ
HTMLを直してコミットしたらすぐに内容をチェックしてもらえます。
早速設定をして使ってみたところ、とんでも無くスムーズに内容のチェックや修正ができました!

この2つは2022年最大の衝撃でした!

最後に

長年情シスをやっていると、いざ技術的なことをしようとした時に
「時代が進んでいて、オールドタイプやりかた」しかできないことがあります。
今回は、さくらのスーパーエンジニアたちが令和最新版の手法を教えてくれたというのを話にしてみました。

最後まで読んで頂いてありがとうございました🙇‍♂️

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
9