自作CMSの作り方#26 ファイルのアップとDB作成

Haguruma

2020年8月9日 20:06

※ 2025/4/20 記事の価格を 200 円から無料に変更しました（これまで購入された方、申し訳ありません。これから利用される方、若干古い内容なので、適度に参考にしてください）。

こんにちは。Suipediaです(∩´∀｀)∩。

前回はXSERVERでアカウントを作り、ファイルをアップする対象の場所を突きとめました。

今回は実際にファイルをアップしていきましょう。

CMSの連載としてナンバリングしているのでCMSのファイル群をアップする説明をしてきますが、もちろんそれ以外のシステムやファイルであっても要領は同じです。

この記事ではファイルのアップはもちろんですが、サーバ上でシステムを動かすようにするために一部ソースを改修する場面もでてきます。

では、よろしくお願いします。

ファイルをアップする

前回の続きからということで早速ファイルをアップしていきます。

まずですね、今あるファイルに関しては一応バックアップをとっておきましょう。ファイル名をクリックするとダウンロードできるので、一応保管しておいてください。赤枠クリックね( ｀ー´)ノ

（ただ使わない可能性が高いです。その時は削除しておきましょう）

じゃあせっかくなので、ダウンロードしたファイルはサーバ上から一旦削除してしまいましょう。

各ファイルにチェックをつけて、「ファイルの削除」ボタンを押下します。

すると・・・

はい消えたー！！(ノД`)・゜・。

ちなみにこの状態でアクセスしてみると・・・

はい。これは正しい挙動でございます。

ではファイルをアップしていきます。

「ファイルを選択」ボタンを押下します。

ファイルをひとつひとつアップするのは面倒なので、フォルダで一括アップしましょう。一番親のフォルダを選びます。

と、思いきや、フォルダを選択してもファイル名欄に表示されません。そうですか、ファイルしか受け付けていないんですね(´・ω・｀)

では、一階層フォルダを降りて、ファイルを個別に選択しましょう。

ファイル名の欄にindex.htmlが表示されました。では、これで開くボタンをクリックします。

はい、ファイルがひとつ追加されましたね。同じ要領で同階層の他のファイルも設定します。

はい、できました。では、アップロードボタンを押下します。

ふぅ・・・4つのファイルアップに成功しました。

この状態でURLにアクセスすると失敗しますが、想定内なので気にしないでください。

さて、このペースでファイルをあげて・・・いかねぇ！！(; ･`д･´)

こんなチマチマしたやり方でファイルをひとつずつアップしてると効率悪いですよね。もうストレスで気がどうにかなっちゃいます(ノД`)・゜・。

なので、一発で全ファイルをアップできる方法をご紹介しましょう。

（ここまでが有料記事時代の無料エリア）

FTPツールを手に入れよう

まず言葉の紹介です。

ファイル管理の画面上部に注目してほしいんですが、「FTP」という言葉がついてますね。

これはFile Transfer Protocol（ファイル・トランスファー・プロトコル）の略で、ファイル転送規格という意味です。

FTPという言葉がでてきたら「あ～ファイル転送のことね」と解釈してください。

で、ファイル転送を簡単にできるようなツールが世の中にはもう存在するんですね。今回紹介するのは・・・

FFFTPというソフトです。こちら、無料です。私も普段使っています。たぶん市民権も得ています。定番って書いてあるし(;´∀｀)

では、32bitか64bitかはあなたの環境に合わせて選択していただくとして、こちらからダウンロードしてください。

私はもうダウンロードしてるので、その過程は割愛しますね。

FFFTPのダウンロード後、起動していただきますと・・・

こんな感じの画面かなと思います。

左上の「接続」から「ホストの設定」を開きましょう。

こんな画面が開きます。私の場合は既に設定がひとつありますが、今回初めてダウンロードされた場合はまだ何もないと思います。

では、右にある「新規ホスト」をクリックしましょう。

こんな画面になるので、必要情報を入力します。

ホストの設定名は設定そのものの名前を入力します。なんでもいいので、私は「XSERVERに接続するでごわす」とします。あなたはもっと真面目な名前でもよいです。

次にホスト名（アドレス）ですが、こちらは・・・

サーバーパネルから「サーバー情報」をクリックいただき・・・

ここのホスト名を転載しましょう。私の場合は「sv10598.xserver.jp」です。（あれ？これって公開していい情報なのかな・・・|дﾟ)）

次にユーザ名ですが、こちらは前回の記事でXSERVERにアカウント登録時、登録完了通知のメールがあなたに飛んでます、と案内しました。その中には重要な情報が記載されています。

キャプチャとってきました(∩´∀｀)∩。

あ、ここにホスト名も書いてましたね。ユーザ名とパスワードはここの記載内容を適用します。

それぞれ入力を済ませると・・・

こんな感じですね。未入力のところは一旦無視しましょう。これでOKボタンをクリックします。

はい、追加されました。では、接続ボタンを押します。

接続成功しました！これ、画面の見方は左側があなたの端末の情報で右側がサーバ側の情報です。

接続時、

こんなポップアップが出たかもしれません。はいをクリックでよいです。

それでは、左側をCMSのファイル群があるフォルダに移動し、右側をpublic_htmlフォルダに移動します。

こんな感じになっていればOK(∩´∀｀)∩。

ではですね、ルートフォルダのファイルはもう先ほどXSERVERのFTPサービスからアップしたので、その他のフォルダ群を選択します。

こうですね。選択したら上の方にある上を向いた矢印をクリックします。

アップロードが始まりますので、しばしお待ちください。完了すると・・

はい。右側にもフォルダたちができあがっていますね。もちろんクリックして中に入っていくとファイルたちもアップロードされています。

ここで、XSERVERのファイル管理ページからも確認してみましょう。

はい、フォルダ群が増えています。OKOK( *´艸｀)

表示のための設定変更をする

さてさて、ここからが問題なんですよ;つД｀)

私も手探り・・・。

まずですね、今の状態でCMSサイトにアクセスしてみると・・・

こんな感じになり、なぜかファイルがダウンロードされちゃう・・・。

まずは、.htaccessファイルを修正します。

.htaccessファイルの先頭にあるチェックボックスにチェックを入れ、右上の編集ボタンをクリックします。

今の記載がたぶん

AddType application/x-httpd-php .php .html

RewriteEngine on
#以下はリダイレクト対象の除外拡張子設定
RewriteCond %{REQUEST_FILENAME} !^(.*)\.(gif|png|jpg|jpeg|css|php|js|csv)$ [NC]
RewriteRule / index.html

こういう内容だと思います。これの1行目を

AddHandler fcgid-script .html

これに変更します。これで保存し、CMSにアクセスしてみると・・・

こんな表示になりましたかね;つД｀)。とりあえず、ファイルが認識された、という点ではクリアです。

では、次はエラーの内容の通り、データベースの接続が成功するようにしていきましょう。

データベースを設定する

サーバーパネルを開いてください。

MySQL設定というのがありますね。これをクリックしましょう。

こんな画面になりまして、今現在はMySQLデータベースがないことが確認できます。じゃあ追加しよう！という流れですね。

MySQL追加タブをクリックしましょう。

データベース名を入力します。ここはなんでもいいんですが・・・私のデータベースということで私は「mydb」にします。

入力したら右下の確認画面へ進むボタンを押下しましょう。

確認画面です。問題なければ追加するボタンをクリックします。

はい。追加完了。めっちゃあっさりしてました。

これでMySQL一覧タブに戻るとですね・・・

データベースが追加されております。ただですね。。。「ユーザーはい」って書いてあるのが2か所ありますよね。これ、プルダウンを下ろすと「ユーザはいません」って書いてあるんですよ。

そう、ユーザがいない。ユーザ、作らなくちゃ。

ということで、MySQLユーザ追加タブを開きます。

MySQLユーザIDとパスワードを入力します。

私自身がこのデータベースの管理者としてログインするぞってことで、管理者（Administrator）を略したadminという文字を入れました。

パスワードはひ・み・つ(●´ω｀●)。

では、入力出来たら確認画面へ進むボタンを押しましょう。

確認できたら追加するボタンを押下しましょう。

はい、追加できました。これまたあっさりしてる。戻るボタンを押します。

ユーザが追加されてます。

ではユーザに権限を付与しましょう。

MySQL一覧タブを開くとアクセス権未所有ユーザの欄に今追加したユーザがいます。追加ボタンを押下しましょう。

はい、追加完了の画面になります。戻るボタンを押しましょう。

アクセス権所有ユーザの欄にユーザ名が表示されていますね。OK！

・・・はい。えーっとですね。1記事の中に貼る画像が35枚を超えだすと身体にブツブツができるという体質でして(嘘。今40枚まできてまして。

つまりですね、はいそうです。今回はここまでです。（ｾﾞｪｾﾞｪ;つД｀)

おわりに

今回もありがとうございました。

今回はファイルのアップと.htaccessの編集、またデータベースの作成を行いました。

なかなか大変ですね、これ。私普段自分が使っているのはロリポップというレンタルサーバです。

あっちも最初は苦労しましたが、今となっては完全に手なずけてますので、画面の前のあなたも今はXSERVERと心理的なディスタンスが開いててもやってるうちにすぐに仲良くなれます。ご安心ください。

社会的なディスタンスを大切にしていかないといけない昨今ですが、あまりストレスをためずに日々を生きたいですね。

はい、では今回もありがとうございました。