2017/08/19

XREAでDjangoを動かす

どうも。
レンタルサーバのXREA(エクスリア)でDjangoを動かしてみました。
とりあえずcgiからDjangoを動かせるところまでをメモしておきます。


目次

git pushでサイト更新できるようにしておくため下記のような構成にします。

参考:Gitでサイトを更新したい! - Qiita

/
└── virtual
    └── account # 取得したアカウント名
        ├── git
        │   └── mysite.git # リポジトリの配置場所
        ├── project
        │   └── mysite # ソースコードの配置場所
        │       ├── manage.py
        │       └── …
        └── public_html # 公開領域
            ├── .htaccess # url制御
            └── index.cgi # django-python3.cgi を編集後リネームして配置

まずはSSHの接続方法。

# sshコマンド例
# アカウント名: account
# サーバ名: s9999
$ ssh account@s9999.xrea.com

注意点としてはSSHで入る前に事前にホスト情報登録の作業が必要になります。

SSHを利用するには?(XREA公式)

SSHで入れたら、早速リポジトリを作成します。

# リポジトリの配置場所を作成
$ mkdir -p ~/git/mysite.git
 
# リポジトリの配置場所に移動
$ cd ~/git/mysite.git
 
 
# ベアリポジトリを作成
$ git init --bare

SSHで入ったまま作業します。

# bash の実行パスを確認
$ which bash
/usr/bin/bash
 
# post-receive ファイルの作成
$ cd ~/git/mysite.git/hooks/
$ vi post-receive

post-receiveファイルを下記の内容で保存します。

#!/usr/bin/bash
 
(
cd ~/project/mysite
git --git-dir=.git fetch
git --git-dir=.git reset --hard origin/master
git --git-dir=.git clean -fdx
)

保存が終わったら、post-receiveファイルへの実行権限を付与しておきます。

# 実行権限のパーミッション付与前
$ ls -la post-receive 
-rw-r--r-- 1 …(中略)… post-receive
 
# 実行権限のパーミッション付与
$ chmod +x post-receive
 
# 以下のように実行権限のパーミッションが付いてたらOK
$ ls -la post-receive 
-rwxr-xr-x 1 …(中略)… post-receive

git pushしたときに展開されるようにgitのリポジトリを作成しておきます。

# ソースコード配置場所作成
$ mkdir -p ~/project/mysite
 
# ソースコード配置場所まで移動
$ cd ~/project/mysite/
 
# リポジトリの作成
$ git init
$ git remote add origin ~/git/mysite.git

次に、Djangoをインストールします。

# Python3が使えるか確認
$ python3 -V
Python 3.5.1
 
# Djangoをインストール
$ python3 -m pip install Django==1.11.3 --user
Collecting Django==1.11.3
  Downloading Django-1.11.3-py2.py3-none-any.whl (6.9MB)
    100% |████████████████████████████████| 7.0MB 59kB/s 
Collecting pytz (from Django==1.11.3)
  Downloading pytz-2017.2-py2.py3-none-any.whl (484kB)
    100% |████████████████████████████████| 487kB 1.0MB/s 
Installing collected packages: pytz, Django
Successfully installed Django pytz
You are using pip version 7.1.2, however version 9.0.1 is available.
You should consider upgrading via the 'pip install --upgrade pip' command.

Successfully installed Djangoのメッセージが出ればOK。

pipのversionが古いというメッセージが出てるけど、そちらは無視。

GitHubからdjango-python3.cgiを入手する。

Python2用とPython3用のcgiがある。

  • django-python2.cgi(Python2用)
  • django-python3.cgi(Python3用)

Python3を使ったほうがよいので「django-python3.cgi」を使う。

django-python3.cgiファイルの名前をindex.cgiに変更する。 あとの.htaccessファイルにもちょっと関係する

修正前

1行目周辺。

#!/home/user/.pyenv/versions/envname/bin/python

修正後

Python3の実行パスがXREAの仕様に記載されているのでそれに従う。

#!/usr/local/bin/python3

修正前

36行目周辺のコメントアウトされてる行。

# sys.path.append("/djangoproject/src")

修正後

コメントアウトを外してソースコードの配置場所のパスに変える。 accountの部分は取得したアカウント名に変える。

sys.path.append("/virtual/account/project/mysite")

修正前

40〜46行目周辺の部分。

    environ                      = dict(os.environ.items())
    environ['wsgi.input']        = sys.stdin.buffer
    environ['wsgi.errors']       = sys.stderr.buffer
    environ['wsgi.version']      = (1,0)
    environ['wsgi.multithread']  = False
    environ['wsgi.multiprocess'] = True
    environ['wsgi.run_once']     = True

修正後

environ['PATH_INFO'] = environ.get('PATH_INFO',"/")を追記する。

    environ                      = dict(os.environ.items())
    environ['wsgi.input']        = sys.stdin.buffer
    environ['wsgi.errors']       = sys.stderr.buffer
    environ['wsgi.version']      = (1,0)
    environ['wsgi.multithread']  = False
    environ['wsgi.multiprocess'] = True
    environ['wsgi.run_once']     = True
    environ['PATH_INFO']         = environ.get('PATH_INFO',"/") # 追加

修正前

97行目周辺。

os.environ['DJANGO_SETTINGS_MODULE'] = 'application.settings'

修正後

作成したプロジェクトのsettingsに変更する。 例:$ django-admin startproject mysiteでプロジェクトを始めた場合

os.environ['DJANGO_SETTINGS_MODULE'] = 'mysite.settings'

ファイルマネージャなどでpublic_html(公開領域)にアップロードする。 あと、実行権限も付与しておくのを忘れずに。

$ cd ~/public_html
$ chmod 755 index.cgi

ちなみにLinuxで作業しています。

前提

  • Python3がインストール済み
  • virtualenvが導入済み
$ cd 任意のディレクトリ
 
$ python -V
Python 3.5.1
 
# 仮想環境の構築
$ virtualenv venv
$ source venv/bin/activate
 
# Djangoのインストール
(venv)$ pip install Django==1.11.3
 
# 先ほど作ったリポジトリを`git clone`する
# account の部分(2箇所)は取得したアカウント名
# s9999 はアカウント取得したサーバ名
(venv)$ git clone ssh://account@s9999.xrea.com:22/virtual/account/git/mysite.git
 
(venv)$ ls
mysite  venv
 
# mysiteのディレクトリを一旦退避(gitリポジトリが入っている)
(venv)$ mv mysite temp
 
# Djangoのプロジェクトを作成
(venv)$ django-admin startproject mysite
 
# startproject で出来上がったものすべてを先ほどのtempディレクトリに移動
(venv)$ mv mysite/* temp/
 
# mysite ディレクトリを削除
(venv)$ rm -rf mysite
 
# temp ディレクトリを mysite に戻す
(venv)$ mv temp mysite
 
(venv)$ cd mysite/
 
# gitのリポジトリがあるはず
(venv)$ ls -a
.  ..  .git  manage.py  mysite

ここまで来たら

  • views.py の作成
  • urls.py の編集
  • settings.py の編集

を行う。

(venv)$ ls
manage.py  mysite
 
(venv)$ vi mysite/views.py

views.pyを以下の内容で保存する。

from django.http import HttpResponse
 
def index(request):
    return HttpResponse("Hello, world. You're at the index.")
$ vi mysite/urls.py

urls.pyを以下の内容で保存する。

from django.conf.urls import url
from django.contrib import admin
 
from . import views # 追加
 
urlpatterns = [
    url(r'^$', views.index, name="index"),  # 追加
    url(r'^admin/', admin.site.urls),
]
  • DEBUGモードをFalseへ
  • ALLOWED_HOSTSにドメイン名を追加
  • LANGUAGE_CODE
  • TIME_ZONE
# DEBUG = True
DEBUG = False
 
# 自身が取得したドメインを指定する
# 'localhost'はテスト用
# 'example.com'はドメイン名
# ALLOWED_HOSTS = []
ALLOWED_HOSTS = ['localhost', 'example.com']
 
# LANGUAGE_CODE = 'en-us'
LANGUAGE_CODE = 'ja'
 
# TIME_ZONE = 'UTC'
TIME_ZONE = 'Asia/Tokyo'
(venv)$ python manage.py migrate
 
(venv)$ python manage.py runserver
(中略)
Django version 1.11.3, using settings 'mysite.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.

ブラウザで http://localhost:8000/ にアクセスして

Hello, world. You're at the index.

と表示されたらひとまず成功。

Ctrl + Cで一旦 runserver を止める。

git pushでサイトに反映させる。 SSHを使うので事前にホスト情報登録の作業をしておくこと。

(venv)$ git add --a
(venv)$ git commit -m "initial commit"
(venv)$ git push origin master:master
account@s9999.xrea.com's password: # パスワードの入力

サイトのURLがhttp://example.comの場合、上記の作業がうまくできていればhttp://example.comにアクセスすると

Hello, world. You're at the index.

と表示される。

じゃあ、adminページに移動してみよう。

http://example.com/admin/

Not Found

The requested URL /admin/ was not found on this server.

お、落ち着け、まだあわてるような時間じゃない。

http://example.com/index.cgi/admin/

これで形の崩れたadminページが表示されるはず。

2つ課題を片付けよう。

  • urlの最適化
  • 崩れたadminページをなおす

これは以前にも bottle.py のときにもやったね。 .htaccessを作成して public_html (公開領域)の配下に置いておこう。

.htaccessに記載する内容。

DirectoryIndex index.cgi
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ /index.cgi/$1  [L]
 
<Files ~ ".(cgi|xcg)$>
<Limit GET POST>
order allow,deny
allow from all
</Limit>
</Files>
 
<Files ~ "^\.(htaccess|htpasswd)$">
deny from all
</Files>

.htaccessファイルをアップロードできたら

http://example.com/index.cgi/admin/ ではなく

http://example.com/admin/ でアクセスできるようになる。

原因はstaticのファイル(CSSなど)を参照できていないから。

間違っているかもしれないけど解決出来た方法を記載しておく。

一応公式を参考にした。

  • settings.pyへの追記
  • urls.pyへの追記

最終行に追記

STATIC_ROOT = os.path.join(BASE_DIR, "static/")
from django.conf.urls import url
from django.contrib import admin
 
from . import views
from django.conf import settings # 追加
from django.conf.urls.static import static # 追加
from django.views.static import serve # 追加
 
urlpatterns = [
    url(r'^$', views.index, name="index"),
    url(r'^admin/', admin.site.urls),
    url(r'^static/(?P<path>.*)$', serve, {'document_root': settings.STATIC_ROOT}), # 追加
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT) # 追加

あとは徐ろにコマンドを実行する。

(venv)$ ls
db.sqlite3  manage.py  mysite
 
# 必要なstaticファイルを集めるコマンド
(venv)$ python manage.py collectstatic
 
# static ディレクトリが作成される
(venv)$ ls
db.sqlite3  manage.py  mysite  static

ここまで出来たら、git pushしてサイトを更新。

(venv)$ git add --a
(venv)$ git commit -m "add static files"
(venv)$ git push origin master:master
account@s9999.xrea.com's password: # パスワードの入力

これで崩れていないadminページが表示されたはず。

あとは補足みたいなもの。

views.pyでtemplateを使ってみる。

(venv)$ ls
db.sqlite3  manage.py  mysite  static
 
# テンプレートの配置場所作成
(venv)$ mkdir -p templates/mysite
 
# 継承元のbase.html作成
(venv)$ vi templates/base.html

base.htmlの内容。

※favicon.icoはstaticディレクトリの配下に入れといてね。

{% load static %}
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="{% static 'favicon.ico' %}" type="image/vnd.microsoft.icon" />
<link rel="icon" href="{% static 'favicon.ico' %}" type="image/vnd.microsoft.icon" />
<title>{% block title %}title{% endblock %}</title>
<!-- bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- fontawesome CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" crossorigin="anonymous">
 
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
{% block extrahead %}{% endblock %}
</head>
<body>
<div class="container">
  {% block content %}
    {{ content }}
  {% endblock %}
</div><!--/.container-->
</body>
</html>

次に、テンプレートのindex.htmlを作成する。

$ ls
db.sqlite3  manage.py  mysite  static  templates
 
# テンプレートのindex.htmlを作成
(venv)$ vi templates/mysite/index.html

index.htmlの内容。

{% extends "base.html" %}
 
{% block title %}Hello, World!{% endblock title %}
 
{% block content %}
  <div class="page-header">
    <h1>Hello, World!</h1>
  </div>
  <p>You're at the index.</p>
{% endblock content %}

views.pyを編集。

$ ls
db.sqlite3  manage.py  mysite  static  templates
 
$ vi mysite/views.py

views.pyの内容。

# from django.http import HttpResponse
# def index(request):
#     return HttpResponse("Hello, world. You're at the index.")
from django.shortcuts import render
 
def index(request):
    context = {}
    return render(request, 'mysite/index.html', context)

settings.pyのTEMPLATESを修正

$ ls
db.sqlite3  manage.py  mysite  static  templates
 
$ vi mysite/settings.py

settings.pyの修正箇所

'DIRS': [],の部分を'DIRS': [os.path.join(BASE_DIR, "templates")],に修正する。

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
#        'DIRS': [],
        'DIRS': [os.path.join(BASE_DIR, "templates")], # 修正
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

あとは省略するけど git push でサイトを更新。

下のリンクは上記の手順で作ってみたサイトです。(まだほとんどページがありません)

[広告]

Amazon

スポンサーリンク

スポンサーリンク

スポンサーリンク

コメント

非公開コメント