DockerでMediaWikiとVisualEditorを入れたログ


DockerでMediaWikiを入れたときのメモ。Docker初めて触った。

- 扱うもの
    - MediaWiki（1.34.0）の導入（Dockerでごり押す）
    - parsoidの導入（Dockerでごり押す）
    - VisualEditorの導入
    - いくつかの拡張機能の導入
- 扱わないもの
    - MySQL
        - 既に入っている状況下に構築したので
    - RESTBase
        - むずすぎて投げた

# 環境

- ホストOS
    - Ubuntu 18.04.3 LTS

# 手順

すべてsudo権限下で行ったが、別に要らない可能性もある（知らない）。

Dockerインストール済みを想定。

`ホスト:dir# `とは、ホストマシン上のディレクトリ`dir`でsudo権限でbashコマンドを実行するの意味。ディレクトリは省略された場合どこでコマンドを実行してもよい。

## MediaWikiのDockerイメージを見つける

```
ホスト:# docker search mediawiki
NAME                                   DESCRIPTION                                     STARS               OFFICIAL            AUTOMATED
mediawiki                              MediaWiki is a free software open source wik…   201                 [OK]
synctree/mediawiki                     Docker packaging for MediaWiki. Based on off…   79                                      [OK]
wikimedia/mediawiki                    MediaWiki is the wiki package used by Wikipe…   50
kristophjunge/mediawiki                MediaWiki with VisualEditor plugin and Parso…   29                                      [OK]
以下省略
```

とりあえず安直に`mediawiki`を使うことにした。既に色々入っているイメージとかあるみたいだけど、最初に入れたこれで最後まで要求が満たされたので結局これを採用した。

## とりあえずMediaWikiのサーバーを建ててみる

### まずは目当てのイメージをダウンロードしてくる

別にやらなくてもrun時に自動的にダウンロードされるかもしれない。

```
ホスト:# docker pull mediawiki
```

### コンテナを新造して立ち上げる

```
ホスト:# docker run -d --net=host --name mw mediawiki
```

`-d`を付けることでバックグラウンドで起動する。

`--net=host`でホストのコンピュータと同じネットワーク上で起動する。今回は同マシン上で建っているparsoidサーバーにアクセスするためにこれを指定した。

`--name mw`で名前をmwにする。名前は何でもいい。省略すると適当に変な名前が振られる。

### 中に入ってみる

このコマンドで、Dockerの中でbashを起動できる。

```
docker exec -it mw bash
```

### コンテナ内のファイルシステムをホスト上で直接書き換えられるようにしてみる

おもむろにホスト側にjsonを色々できるjqをインストールする。

```
ホスト:# apt install jq
```

- jq コマンドを使う日常のご紹介 - Qiita https://qiita.com/takeshinoda@github/items/2dec7a72930ec1f658af

----

さっきrunしたmwの情報を以下のコマンドで見れる。

```
ホスト:# docker container inspect mw
```

これを実行するとJson形式のデータが得られるので、次のようにディレクトリを取り出せる。

```
ホスト:# docker container inspect mw | jq -r '.[0].GraphDriver.Data.MergedDir'
/var/lib/docker/overlay2/c39bc935abfaaedc65e96d7b6cb7985db77687f7d62b867e4a1a6bd059c94734/merged
```

mergedの中はコンテナの内部からリアルタイムに参照されるルートディレクトリである。

```
ホスト:/var/lib/docker/overlay2/c39bc935abfaaedc65e96d7b6cb7985db77687f7d62b867e4a1a6bd059c94734/merged# ls
bin  boot  dev  etc  home  lib  lib64  media  mnt  opt  proc  root  run  sbin  srv  sys  tmp  usr  var
```

### ポート変更

エディタとか色々と入っていなくて萎えるので、ホスト側のファイルシステム上に見えているコンテナのファイルシステムの本体を直接書き換えて済ます。

```
ホスト:merged# nano etc/apache2/ports.conf
```

好きなように変えることができる。

```:編集
- Listen 80
+ Listen 12345
```

Dockerの機能の方でポートフォワーディングもできるみたいだけど、理解するのが面倒なので置いておく。

----

後からポート番号を変更する場合、`LocalSettings.php`の上の方にあるサイト名もポートも更新しなければならない。

```:LocalSettings.php/編集
  ## The protocol and server name to use in fully-qualified URLs
- $wgServer = "http://www.example.com:12345";
+ $wgServer = "http://www.example.com:8000";
```

このファイルはサーバーをインストールしたときに自動生成される。

### コンテナ再起動

```
docker restart mw
```

### 接続

アクセスしてみるとこんなのが出る

![20200119-192555-001451.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280627/51b36f57-f6fc-6beb-454b-1e48a83741ce.png)

### インストール

![20200119-192940-001452.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280627/92c5d182-fae8-49eb-e769-bdb0ec16b4c5.png)

この辺はウィザードに従ってうまいことやる。Dockerで環境ごと入れたのでそんなに困らないんじゃないかと思う。

データベースはホスト上で既に動いているMySQLを使用したので「MariaDB、MySQLまたは互換製品」を選択。

「データベースのホスト」には`127.0.0.1`を指定。

データベースとユーザの用意は以下の情報に従って作成する。

- Manual:MediaWiki のインストール - MediaWiki https://www.mediawiki.org/wiki/Manual:Installing_MediaWiki/ja#MariaDB/MySQL

```
> CREATE DATABASE wikidb;
> CREATE USER 'wikiuser'@'localhost' IDENTIFIED BY 'password';
> GRANT ALL PRIVILEGES ON wikidb.* TO 'wikiuser'@'localhost' WITH GRANT OPTION;
```

「オプション→拡張機能」欄はよくわからないので全部チェックを入れた。

全部うまくいくと「データベースは正常にセットアップされました」と出て`LocalSettings.php`をダウンロードさせられるので、ダウンロードして配置する。

配置は、面倒なのでTerapadで開いてコピーしたあと、配置先のファイルをnanoで開いてコマンドプロンプトに右クリックで貼り付けた。

```
ホスト:merged# nano var/www/html/LocalSettings.php
```

インストールが成功していればトップページが次のようにWikiらしい表示になる。

![20200119-195453-001453.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280627/5acae4c2-da10-926d-abf3-8a537f9d2c82.png)

## いくつかの拡張機能のインストール

「特別ページ→バージョン情報→インストール済み拡張機能」を見てみる。ここがハイフンになっている奴が導入されていないという声が上がったので、インストールする。

![20200119-195938-001454.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280627/38b52e9c-ba00-bd6e-ddea-7ec7bee6159e.png)

とりあえず欲しいものを手動で手あたり次第ダウンロードし、圧縮ファイルを一つのディレクトリにまとめてホストコンピュータに転送する。

仮に`~/mediawiki`にまとめた場合、以下のようにすると拡張機能のインストールが完了する。

```
ホスト:merged# d='~/mediawiki'
ホスト:merged# for f in $(ls -1 "$d"); do tar -xzf "$d/$f" -C var/www/html/extensions; done
```

## VisualEditorを導入する

VisualEditorの導入は闇である。しかし、導入に成功した時の恩恵も大きい。

VisualEditorを利用するにはparsoidというサーバー用にポートを1個確保しなければならない。これはマシン内でのみ通信されるので、ポートを外部に向けて公開する必要はない。

- 参考
    - MediaWikiにVisualEditorをインストールする | 東北ギーク http://tech.respect-pal.jp/mediawiki_install/

### VisualEditorのインストール

いきなりVisualEditorをインストールする。

```
ホスト:marged/var/www/html/extensions# git clone https://gerrit.wikimedia.org/r/p/mediawiki/extensions/VisualEditor.git
ホスト:marged/var/www/html/extensions# cd VisualEditor
ホスト:marged/var/www/html/extensions/VisualEditor# git checkout remotes/origin/REL1_34
ホスト:marged/var/www/html/extensions/VisualEditor# git submodule update --init
```

インストール完了。

### VisualEditorの設定

共通設定ファイルを編集する。

```
ホスト:marged/var/www/html# nano LocalSettings.php
```

```:末尾に追加
wfLoadExtension('VisualEditor');
$wgDefaultUserOptions['visualeditor-enable'] = 1;
$wgHiddenPrefs[] = 'visualeditor-enable';
$wgVirtualRestConfig['modules']['parsoid'] = [
  'url' => 'http://localhost:12346/',
  'domain' => 'localhost',
];
```

ここで、12346はparsoidのポート番号である。domainにはポートまでは書かない。URLの末尾には/を入れる。

これで動いた。

### parsoidを建てる

parsoidもDockerで建てる。

```
# docker search parsoid
NAME                  DESCRIPTION                                     STARS               OFFICIAL            AUTOMATED
thenets/parsoid       Containerized MediaWiki parsoid service.        4
benhutchins/parsoid   Container to run MediaWiki's Parsoid            2                                       [OK]
formwandler/parsoid   Parsoid image for the VisualEditor of MediaW…   1
irasnyd/parsoid       Docker container of the Mediawiki Parsoid ap…   1                                       [OK]
```

よくわからんがとりあえず`thenets/parsoid`を使う。

- thenets/parsoid - Docker Hub https://hub.docker.com/r/thenets/parsoid

コンテナを製造。公式にはrun時のパラメータで色々できることが書いてあるが、それをするとポートの変更方法がなんかよくわかんなかったので使わない。

```
ホスト:# docker run -d --net=host --name ps thenets/parsoid:0.10
```

### parsoidを設定

thenets/parsoidの中では全然コマンドが打てないのでこっちもファイルシステムに直接アクセスする。

```
docker container inspect ps | jq -r '.[0].GraphDriver.Data.MergedDir'
```

中に入るとこうなっている。

```
ホスト:merged# ls
bin  dev  etc  home  lib  media  mnt  opt  proc  root  run  run-parsoid.sh  sbin  srv  sys  tmp  usr  var
```

`run-parsoid.sh`を編集する

```
ホスト:merged# nano run-parsoid.sh
```

```:先頭付近を編集
  #!/bin/bash

+ PARSOID_DOMAIN_localhost=http://localhost:12345/api.php
+ 
  set -e
```
```:中腹付近を編集
          # Allow override of port/interface:
-         serverPort: 8000
+         serverPort: 12346
          #serverInterface: '127.0.0.1'
```

ここで、12345はMediaWikiのポート番号、12346はparsoidのポート番号である。

あとは再読み込みする。

```
docker restart ps
```

### VisualEditorの導入が完了

これでVisualEditorの導入が完了した。

![20200119-212510-001455.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/280627/8292c85a-69bc-e83b-07fd-21b0e1b9032b.png)

Parsoidとの連携がうまくいっていないとここで404が出たとか言われた。そのときはURLの指定が間違っていた。

「ブラウザ→MediaWiki API→Parsoid」のうちどの部分の呼び出しが404になっているのか注意しなければ、どこが間違っているのかが把握できない。