在Devstack基礎上開發dashboard（一）——遵循官方文檔初步嘗試

定製自己的頁面

本文要介紹如何在devstack基礎上，定製自己的dashboard。

1. 準備

首先要準備一套devstack環境，可以參考https://blog.csdn.net/stpice/article/details/81274803
devstack搭建比較簡單，不過過程中可能會遇到一些奇怪的問題，總之多嘗試幾次一般都可以搞定。

2. 按照官方教程操作

要想定製自己的dashboard，首先要參考OpenStack官方網站給的教程：
https://docs.openstack.org/horizon/latest/contributor/tutorials/dashboard.html
目前最新版使用的應該是Rocky，按照裏面的說明進行。
第一步：

$ mkdir openstack_dashboard/dashboards/mydashboard

$ tox -e manage -- startdash mydashboard \
  --target openstack_dashboard/dashboards/mydashboard

$ mkdir openstack_dashboard/dashboards/mydashboard/mypanel

$ tox -e manage -- startpanel mypanel \
  --dashboard=openstack_dashboard.dashboards.mydashboard \
  --target=openstack_dashboard/dashboards/mydashboard/mypanel

這幾個命令按照順序執行就行，肯定會報錯了，文檔中也說了，運行這幾個命令會幫助我們初步生成dashboard需要用的一些骨架文件，具體的每一個文件還需要自己後邊手動進行定製加工。

這裏我初次運行的時候，由於系統中沒有安裝Python3，只有Python2.7，結果tox運行的時候還報了一些錯，對應的將Python3的環境和Python2的環境都準備好就沒問題了。tox會使用pyenv 管理Python的各個版本，對應找到pyenv的項目首頁對照配置就好了。

緊接着就對照着官方文檔中的說明，將裏面的各個文件在對應的目錄中分別創建好，這裏只是做了一個最簡單的例子，最後可以顯示一個空的列表。最後按照步驟將各個文件都準備好了以後，在/opt/stack/horizon/openstack_dashboard/dashboards/mydashboard目錄中，運行命令tree .，可以看到類似如下的文件結構：

.
├── dashboard.py
├── dashboard.pyc
├── __init__.py
├── __init__.pyc
├── mypanel
│   ├── index.html
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── panel.py
│   ├── panel.pyc
│   ├── __pycache__
│   │   ├── __init__.cpython-37.pyc
│   │   ├── panel.cpython-37.pyc
│   │   ├── tables.cpython-37.pyc
│   │   ├── tabs.cpython-37.pyc
│   │   ├── urls.cpython-37.pyc
│   │   └── views.cpython-37.pyc
│   ├── tables.py
│   ├── tables.pyc
│   ├── tabs.py
│   ├── tabs.pyc
│   ├── templates
│   │   └── mypanel
│   │       └── index.html
│   ├── tests.py.tmpl
│   ├── urls.py
│   ├── urls.pyc
│   ├── views.py
│   └── views.pyc
├── __pycache__
│   ├── dashboard.cpython-37.pyc
│   └── __init__.cpython-37.pyc
├── static
│   └── mydashboard
│       ├── js
│       │   └── mydashboard.js
│       └── scss
│           └── mydashboard.scss
└── templates
    └── mydashboard

11 directories, 29 files

這些文件都是按照文檔中的說明進行填寫的，其中有一些文件是以.tmpl 結尾的，這些都是最開始運行那幾個命令自動生成的文件，其實是一種模板，裏面的內容尚不完全，我們可以在此文件的基礎上進行修改，然後將最後的後綴刪除即可。這裏官方教程並沒有介紹js以及其他靜態頁面如何編寫。

注意：所有的這些文件都準備好了以後，如果按照官方教程說的，使用tox -e runserver 命令啓動的話，會在訪問的時候，找不到進行登錄的驗證頁面。這個問題還沒有深入研究，尚不清楚。

3. Apache配置文件

後來，經過查找資料瞭解到horizon前端部署的是Apache服務，所以我們devstack搭建好了以後，可以直接通過ip地址就可以訪問OpenStack的dashboard。

所以直接找到Apache的配置文件的目錄/etc/httpd/conf.d/，可以看到這個目錄中如下的配置文件：

autoindex.conf    glance-wsgi-api.conf  keystone-wsgi-admin.conf   nova-api-wsgi.conf       README    userdir.conf
cinder-wsgi.conf  horizon.conf          keystone-wsgi-public.conf  nova-placement-api.conf  ssl.conf  welcome.conf

打開horizon.conf，對應的爲horizon的配置文件：

<VirtualHost *:80>
    WSGIScriptAlias /dashboard /opt/stack/horizon/openstack_dashboard/wsgi/django.wsgi
    WSGIDaemonProcess horizon user=stack group=stack processes=3 threads=10 home=/opt/stack/horizon display-name=%{GROUP}
    WSGIApplicationGroup %{GLOBAL}

    SetEnv APACHE_RUN_USER stack
    SetEnv APACHE_RUN_GROUP stack
    WSGIProcessGroup horizon

    DocumentRoot /opt/stack/horizon/.blackhole/
    Alias /dashboard/media /opt/stack/horizon/openstack_dashboard/static
    Alias /dashboard/static /opt/stack/horizon/static

    RedirectMatch "^/$" "/dashboard/"

    <Directory />
        Options FollowSymLinks
        AllowOverride None
    </Directory>

    <Directory /opt/stack/horizon/>
        Options Indexes FollowSymLinks MultiViews
        AllowOverride None
        # Apache 2.4 uses mod_authz_host for access control now (instead of
        #  "Allow")
        <IfVersion < 2.4>
            Order allow,deny
            Allow from all
        </IfVersion>
        <IfVersion >= 2.4>
            Require all granted
        </IfVersion>
    </Directory>
    <IfVersion >= 2.4>
      ErrorLogFormat "%{cu}t %M"
    </IfVersion>
    ErrorLog /var/log/httpd/horizon_error.log
    LogLevel warn
    CustomLog /var/log/httpd/horizon_access.log combined
</VirtualHost>

WSGISocketPrefix /var/run/httpd

4. 看日誌

具體的每一條的配置還不清楚，不過可以看到的是，這個虛擬主機的配置，將80端口直接映射到了DJango的服務上去了，所以就可以直接通過ip地址進行訪問dashboard了。另外最下邊配置了日誌的路徑，目前的日誌級別是warn，然後到日誌目錄中去，可以看到如下的日誌文件：

總用量 1472
-rw-r--r--. 1 root root  191242 7月  29 06:35 access_log
-rw-r--r--. 1 root root   24972 7月  29 11:08 error_log
-rw-r--r--. 1 root root 1152011 7月  29 12:00 horizon_access.log
-rw-r--r--. 1 root root   19491 7月  29 11:30 horizon_error.log
-rw-r--r--. 1 root root     122 7月  29 09:38 ssl_access_log
-rw-r--r--. 1 root root    6016 7月  29 11:08 ssl_error_log
-rw-r--r--. 1 root root     150 7月  29 09:38 ssl_request_log

注意：如果默認的話，安裝完devstack後，會在stack用戶下進行操作，同時，horizon的目錄下的文件都是在stack用戶下進行編輯的。日誌的目錄都是root權限，雖然stack用戶在安裝devstack時候，添加了sudoer的權限，但是還是切換到root看日誌比較方便。這樣就可以跟蹤horizon的訪問日誌和錯誤日誌了。如果需要看更具體的日誌，就將上邊的配置文件裏面的日誌級別改爲debug之類的。

5. 重啓服務

好了，所有以上都配置好了以後，就可以運行下邊的命令重啓httpd服務，然後觀察horizon中添加的自定義的dashboard了。

sudo systemctl restart httpd

如果是root就不用sudo了。

6. 結果

然後訪問devstack服務器地址，登錄系統後，就可以看到如下頁面：