WEB・アプリ開発

シリウスで作ったサイトをAmazon S3に展開する方法

サイトアフィリエイトをする上で、必須ツールと言えるのがシリウスです。そんなシリウスで作ったサイトを月額10円程度の激安激安ウェブホスティングサービス Amazon S3で使えたら最強です。また、S3はSEO上有利とされるバックリンクサイトのIP分散も簡単に行えます。

今回はシリウスで作ったサイトをS3で使用する方法をご紹介します。S3の基本的な設定とドメインの設定は下の記事をご覧ください。

ムームードメインで取得した独自ドメインをAmazon S3に適用する手順ムームードメインでドメインを取得し、AmazonのS3のWEBホスティングにそのドメインを適用する手順です。なお、本手順は日本語ドメイン...

本記事はS3の基本設定が完了している前提でご説明します。

手順

シリウスでサイトの生成

通常通りサイトを生成していきます。

手順1

このような画面が出たら、サイト生成先のフォルダーの場所をメモしておいてください。

手順2

生成完了後に「サイトの生成が完了しました。続けてアップロードしますか?」という画面が出たら、「いいえ」をクリックしてください。

アップロードする方法は2つご紹介します。どちらかお好きな手順でやってみてください。前者の方が、手っ取り早くできますが、後者の方が運用は楽なはずです。

  • AWSの管理画面からアップロードする(原始的な方法)
  • DragonDiskを使って同期させる(ちょっと洗練された方法)

AWSの管理画面からアップロードする(原始的な方法)

対象のバケットを選択します。

手順3

「アップロード」ボタンを押す。

手順4

先ほどメモしておいたサイト生成先のフォルダーを開き、全てのファイルとフォルダーを選択し、

手順5

下の赤枠の部分にドラッグ&ドロップをします。こうすると、一つ一つアップロードするのではなく、全てのファイルを一気にアップロードできます。
赤枠部分がお使いのブラウザで表示されない場合は、Chromeというブラウザを使ってみてください。

手順6

「アップロードの開始」をクリックします。

手順7

下のように完了と表示されます。

手順8

これでS3への展開は完了です。URLにアクセスして表示されるか確認してみてください。

ただ、この手順だとわざわざAWSの管理画面を開いて、シリウスの生成先のフォルダからドラッグ&ドロップする必要があります。何も準備が必要ないので手っ取り早い反面、手動なのでミスが発生しやすいです。

そのデメリットを解消したのが次のDragonDiskを使った方法です。

スポンサーリンク

DragonDiskを使って同期させる(ちょっと洗練された方法)

DragonDiskという無料のソフトを使うと、毎回クリック一つで、生成先のフォルダと、S3上の対象のバケットを同期してくれます。(同じファイルがある状態にしてくれる)

ただ、多少の下準備が必要なのでご説明します。

IAMユーザーを作る

AWSのトップレベルのアカウントを使ってもいいのですが、セキュリティ的には、一つシリウス用のユーザーを作っておいた方がベターです。(サイトごとに作る必要はなく、一個作ればいいです。)

まず、AWSのコンソール画面の「サービス」から「IAM」をクリックし、IAMのコンソール画面を開きます。左側の「ユーザー」をクリックして表示される「新規ユーザーの作成」をクリックします。

IAMのコンソール画面

任意のユーザー名を入力し、「作成」クリックします。

IAMユーザーの作成

「認証情報のダウンロード」をクリックすると、credentials.csvというファイルがダウンロードできます。こちらは無くさないように保存しておいてください。

credentials.csvのダウンロード

「閉じる」をクリックし、ユーザーの一覧が表示される画面に戻ります。そこで今作ったユーザーをクリックします。

ユーザーを選択

「アクセス許可」タブをクリックすると表示される「ポリシーのアタッチ」をクリックします。

ポリシーをアタッチする

「ポリシータイプ」に「s3」と入力すると、S3関係のポリシーに絞れます。そして、「AmazonS3FullAccess」にチェックを入れ、「ポリシーのアタッチ」をクリックします。

ポリシーの選択

これでユーザーの作成は完了です。

DragonDiskの設定

まず、DragonDiskをインストールします。WindowsもMacも対応しています。

DragonDiskダウンロードページ

この記事では、Mac用を使っていますが、Windows用の画面も大体同じはずです。

DragonDiskを起動し、「File」メニューから「Accounts…」をクリックします。すると下のような画面が表示されます。

アカウントを作成する

ProviderにはAmazon S3を選び、Account nameとCommentは何でもOKです。Access KeyとSecret Keyは先ほどダウンロードしたcredentials.csvに書いてあります。このファイルを開くと、このようなCSVファイルになっています。


ここでいうと、Access Keyが”XXXXXXXXXXXXX”、Secret Keyが”YYYYYYYYYYYYYYYYYYYY”になりますので、それぞれコピー&ペーストして、OKをクリックしてください。

すると、Rootプルダウンに下のようにアカウント名が表示され、その下にずらっとS3上のバケット名が表示されるはずです。

Rootプルダウン

これで、S3との接続はできました。この状態で、シリウスの生成先フォルダから、対象のS3上のバケットにアップロードすることもできます。ただ、毎回フォルダとバケットを探して指定するのも面倒なので、生成先フォルダとそれに対応するバケットを紐付けておき、毎回クリック一つで更新(同期)するように設定します。

Synchronizationメニューから、「Manage Sync Jobs…」をクリックします。表示される画面で、「Add」をクリックします。

下のような画面が出るので、Nameにはサイト名やドメインなど見分けがつけやすいものを入れます。Source folderは、シリウスの生成先フォルダを指定し、Target folderにはそれに対応するS3上のバケットを指定します。他はとりあえず変えずに、OKをクリックします。

sync jobを作成する

すると、Synchronizationメニューをクリックすると、今作った設定のNameが表示されるようになったはずです。

Synchronizationメニュー

これをクリックし、次の確認画面で、Yesをクリックすると、同期処理が開始され、次のように画面下の部分で緑のチェックマークが表示されれば完了です。

進行画面

このように設定しておけば、今後シリウスでサイトに変更を加えた際に、DragonDiskからクリック一つでS3上のバケットに反映できます。

余談ですが、DragonDiskと似たようなツールで、使うか迷ったものがいくつかありました。それをまとめたので、ご興味あればご覧ください。

Amazon S3と同期させるためのツール7選Amazon S3とお手元のWindowsやMac内のフォルダと簡単に同期できたら便利ですよね。そのためのツールが色々あって、比較検討し...

注意点

S3はシリウスの「iPhoneサイト同時生成機能」は対応していません。S3はPHPや.htaccessが使用できないからです。スマホに対応する場合は、レスポンシブに対応したシリウスのテンプレートをご利用下さい。

ただ、最近はシリウス用のレスポンシブ対応のテンプレートも多いので、問題ないかと思います。SIRIUS会員ページで、レスポンシブに対応した公式の追加テンプレートも出ましたしね。

まとめ

いかがでしたでしょうか。Amazon S3では、月額10円程度で激安にサイトを運営することが可能です。大量のサイトを管理したいアフィリエイターにとってみては最適なWEBホスティングサービスです。是非使ってみてください。