自分専用クラウド Nextcloud の更新

Nextcloud 15がリリースされたのでNextcloud 14から更新してみた。
Nextcloudはマイナーバージョンの更新はウェブUIでワンクリック更新が可能だが、メジャーバージョンの更新はそこまで簡単にはなっていない。とはいえ、ある程度は自動化されているので難しくはない。 更新方法はNextcloudの公式サイトにあるドキュメントを参照。一番確実なのは自分でファイルをダウンロードして展開する方法。この記事ではそれで。

Nextcloud 15に更新 1
以前からだけど、Nextcloudはメジャーバージョンを超えた更新はワンボタンではできないみたい。

また、Nextcloudにアプリを追加していることがあるかと思うが、過去の経験では新しいメジャーバージョンがリリースされてから、アプリがそのバージョンに対応するまで結構かかることが多いかと。利用中のアプリが新しいバージョンに対応しているか対応する開発版が出るまでは迂闊に新しいメジャーバージョンには更新しない方が良いことも。

更新作業

FreeBSDのNginx上で動かしているということもあってNextcloud本体は/usr/local/www/nextcloudに、Nextcloudのデータは/usr/local/www/nextcloud_data (今回は触る必要無し)に置いているとする。

Nextcloud本体更新の為のコマンドラインの操作
# mv /usr/local/www/nextcloud /usr/local/www/nextcloud14
# cd /usr/local/www
# wget https://download.nextcloud.com/server/releases/nextcloud-15.0.0.zip
# unzip nextcloud-15.0.0.zip
# chown -R www:www nextcloud
# cp -p /usr/local/www/nextcloud ./nextcloud14/config/config.php ./nextcloud/config/

ようするに、これまで使っていたNextcloud本体のディレクトリを退避して新しいバージョンをダウンロードして展開する。古いNextcloudの config/config.php を新しいNextcloudディレクトリにコピー。ファイル/ディレクトリのオーナーを正しく指定することだけ忘れない。

アプリについては後回しとする。

Nextcloud 15に更新 2
コマンド打ちの作業が終わったらブラウザで更新するNextcloudのトップURLを開く。 (例: https://nextcloud.example.com/)
ここまで間違っていなければ上の画像のような更新画面が表示される筈なので「アップデートを開始」ボタンを押す。

Nextcloud 15に更新 3
更新が完了するとこの画面が表示されるので「Nextcloudに進む」ボタンを押す。このとき、ボタンの上にアプリが無効だとか表示されるが基本的に無視で問題なし。

Nextcloud 15に更新 4
右上のから「 アプリ」を選択。

Nextcloud 15に更新 5
いわゆるNextcloudの標準アプリであれば、左列から「アプリバンドル」を選択。右列に表示されるアプリ名を確認してこれまで使っていたアプリの「ダウンロードして有効にする」ボタンを押す。 上の画像ではCalendar (GoogleカレンダーのようなやつのNextcloud用、Googleにカレンダーを預けたくない人に)と Contacts (Googleの連絡帳のようなやつのNextcloud用、Googleに連絡帳を預けたくない人に)をダウンロードして有効にする。
これらはCalDav, CardDAVに対応しているのでPCやスマートフォンから使うことができるのでオススメ。がとらぼの中の人はDavdroidを利用することで、Androidスマホの標準のカレンダーと連絡帳をGoogleではなくNextcloudにしているのでGoogleにはデータを預けていない。

こんな感じで公式に近いアプリはアプリリストから有効にするだけで更新前と同様にそのアプリが使用可能になる。もちろん、更新前のデータはそのまま利用可能。(この更新の仕方で問題ないか事前に確認した方が安全ではある。)
次は完全なサードパーティアプリで、しかもNextcloud 15にはまだ完全対応していないという場合。
http://apps.nextcloud.com/で目的のアプリを検索する。

Nextcloud 15に更新 6
ここではパスワード管理アプリのPasswordsをこれまで利用していたとする。2018年12月18日の時点ではPasswordsはNextcloud 15には完全対応していないが、「不安定版」とされるNightly版がNextcloud 15対応として提供されているのでダウンロードする。(ダウンロードリンクをコピーして実際のダウンロードは次の手順)

Passwordsの場合
# cd /usr/local/www/nextcloud/apps
# wget https://git-中略-/passwords.tar.gz
# tar zxvf passwords.tar.gz
# chown -R www:www passwords

wgetで目的のアプリをダウンロードして解凍してNextcloudのappsディレクトリの下に置く。ファイルのオーナーを正しく指定する。
ブラウザに戻り、一度念の為にNextcloudをログアウトして再度Nextcloudの「管理者」アカウントで再ログインする。 (でないと、インストールしたアプリがアプリリストに表示されない場合がある。)

Nextcloud 15に更新 7
再び管理者としてログインして、右上のから「 アプリ」を選択。
左列から「 無効なアプリ」を選択。
右列で有効にしたいアプリ(今回はPasswords)の「有効にする」を押す。

Nextcloud 15に更新 8
Nextcloudの管理者をログアウトしてユーザーアカウントでログインする。
Passwordsアプリを有効にしたので一番上のメニューにPasswordsタブ?が表示されている。それを押すと上の画面のようにNextcloud更新前に利用していたのと同じ状態(更新前のデータが生きた状態)で表示される。一安心。

同様にカレンダーや連絡先も確認し、異常がなければNextcolud 15への更新は完了。

クラウドにデータを置くのは良いが、そうしたが最後そのデータがどう使われるかどこに流出してしまうかわからない怪しい企業に個人情報を含むデータを預けるのは絶対に嫌だという場合は、やはり自分で管理する自分専用のクラウド?が良い。 個人的にはファイルをネットに置くということはしないのでそういう使い方は未だにNextcloudでも殆ど行わないが、パスワード、ブックマーク、連絡先、カレンダーが完全に自分の管理下で、しかもPCやスマホと連携して使えるというのは凄く良い。Nextcloudは今後も使い続けるつもりなのでメジャーバージョンの更新がもっと簡単になって欲しいところ。また、サードパーティのアプリの新しいバージョンへの対応が遅いのももう少しなんとか・・・というか、対応するバージョンの制限をもう少し緩くして欲しい。

WordPress 5.0の新テーマTwenty Nineteenを縦書き段組化改造

WordPress 5.0がリリースされたが、それには新しい公式テーマのTwenty Nineteenが入っている。一応、「Gutenberg 対応の新テーマ」と書かれているが、そんなことは全くどうでも良くて、とてもシンプルげな見た目が一部の人に好まれそうな感じ。全く触らない標準状態だとPCでは字が大きすぎるし殺風景すぎるので当然少しは手を入れないといけないけど。
で、おそらく手を入れて使う前提のテーマなら触りやすい筈と思って例の縦書きブログ用に改造した。 実際Twenty Nineteenを縦書きブログ用に改造してみて思ったが、本当に手は入れやすい。ただし、標準のCSSの設定の一部が縦書きには全く合わなくて苦労されられる部分も無くはない。
この記事はそのTwenty Nineteen縦書き化のメモ。前回のTwenty Seventeen縦書き化がベースで大して違いはない。

縦書きの段組を行うと、段組したブロックの高さが正常に認識されなくなるので段組のブロック要素に続く別のブロックが段組の下部に上書きされてしまう(または覆い隠されるか)。

本当の段組ブロックの高さであるElement.scrollHeightの値とブラウザが認識している段組ブロックの高さであるElement.heightの値が違うのが問題なので、Element.scrollHeightの値を求めてElement.heightの値でそれを上書き指定してやる。それはCSSだけではできないのでJavascriptを使うのは前回と同じ。
そのJavascriptは(正直どこでも良いけど)、footer.phpに書くとする。 footer.php (途中に挿入)
<?php wp_footer(); ?>
<!-- ここから -->
<script type="text/javascript">
  jQuery(window).load(function () {
    reDesign();
  });
  jQuery(window).resize(function () {
   reDesign();
  });

  function reDesign() {
    var vrh = jQuery('.entry').prop('scrollHeight');
    jQuery('.entry').css({ height: vrh });
  };
</script>
<!-- ここまで -->
</body>
</html>

<?php wp_footer(); ?>と</body>の間くらいに書いてやる。 今回はarticleタグのentryクラスの高さ2種を求めた。
前回のTwenty Seventeenでは「前の記事」「次の記事」のナビケーションとサイドバーにあたるsecondaryを下にずらす処理を入れていたが、今回はそういうのは無しで処理はシンプル。
前回はHTMLを読み込んだ時点で高さ計算を行い再描画にしていた。その方が圧倒的に実行タイミングが早いので。それが jQuery(document).ready(function () {処理}); だった。しかし、よく考えると、例えば画像だけが表示される段があると画像読み込み前に高さを計算してしまうので高さが足りないという事象が発生することに気付いた。そこで、今回はjQuery(window).load(function () {処理}); にして、画像まで読み込んでから高さ計算を行うようにした。これで高さ合わせは正確になるが、ページの表示途中はずっとレイアウトが崩れた状態で表示されるという欠点がある。なんとも難しいところ。jQuery(document).ready(function () {処理});も入れるいうのもありかも。つまり3段階表示。
または、HTML中に画像の高さを必ず書くなら前回同様jQuery(document).ready(function () {処理});だけでも行けるかな?広告などサイズが事前にわからないものもあるので難しいと思うけど。

style.css (最後に追加)
.vr-cont {
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -ms-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  -webkit-column-width: 24em;
  -moz-column-width: 24em;
  -ms-column-width: 24em;
  column-width: 24em;
  -moz-column-gap: 53px;
  -webkit-column-gap: 53px;
  -ms-column-gap: 53px;
  column-gap: 53px;
  column-rule-style: dashed;
  column-rule-width: 1px;
  column-rule-color: grey;
  column-fill: auto;
  margin: 0 auto;
  display: inline-block;
  font-size: 1em;
  line-height: 2.0em;
  width: 100% !important;
  height: 25em;
}

.vr-box {
  position: relative;
  right:7px;
}

.navigation {
    position: relative;
    top: 60px;
}
#colophon {
    position: relative;
}

.navigationと#colophonをposition: relative;にすることで、無駄な位置(高さ)合わせを不要にしている。

template-parts/content/content-page.php (途中に挿入)
template-parts/content/content-single.php (途中に挿入)
前略
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
        <div class="vr-cont">
        <div class="vr-box">
中略
        </div><!-- .vr-box -->
        </div><!-- .vr-cont -->
</article><!-- #post-<?php the_ID(); ?> -->

上の例では前回同様にコンテンツの本文の中にvr-cont、さらにその内側にvr-boxクラスのブロックを置いているが、サイト中の全てのコンテンツ縦書きで構わないということであれば、vr-contのブロックは不要でCSSのクラス名 .vr-cont を .entry に書き換えればほぼ同じ結果になる。ちなみにarticleタグのentryというクラス名はテーマディレクトリのinc/template-functions.phpにあるtwentynineteen_post_classes()で指定されている。
vr-boxのブロックは前回同様にルビを振る場合に段の境でルビが縦に切れるのを防止するために指定している。

この記事では本文だけを縦書き段組にしているが、もちろん、#colophon (これまでの#secondaryに相当)の中、実際にはwidget別に縦書きを加えたいというのもある筈。それはとても簡単なのでこの記事では省略。

Twenty NineteenではCSS中でcalc()が多用されているが、縦書きにするとそのclac()は指定されている要素を意図していない位置にズラしたりバカみたいに幅を取ったりと非常に厄介な結果をもたらすので必要に応じて削除するなり変更するなり。

Twenty Nineteenを改造して縦書き段組化したブログの参考例はhttps://jokujinshou.xyz/。このブログはChromeとFirefoxの最新版以外では表示確認していないので他のブラウザでは正しく縦書き表示されなかったり、中の要素が正しくない位置に表示されたりするかもしれない。

中国の3大通信グループのIPアドレスリスト更新

中国の3つの通信メガグループ、中国移動通信(China Mobile)、中国聯合通信(China Unicom)、中国電信(China Telecom)のIPアドレスリストを最新状態に更新しました。
China Mobileはあまり変わらず。
China UnicomはIPアドレスが集約されたようで、以前はサブネットマスク20ビット以下の小さなネットワークが多かったのがかなり減った印象。リストもすっきり。
China Telecomも小さなネットワークが減って大きなネットワークに集約が進んでいるのかもしれないが、それでも小さなネットワークはまだ多い。調べるのがとても面倒な切りの悪いネットワークも多いかも。

一応、リスト内すべてのCIDRを調べ直して、追加・変更・削除しています。

pf_table_cn_telecom.txt  

しょうもないリストだけど作るのとメンテナンスはとんでもなく面倒。
なので、こういうリストが欲しいからと各自で無駄な苦労するを省くために公開している。
3大通信グループの全てのIPアドレスを網羅しているわけではないので念の為。過去に不正なSMTP認証やIMAP認証を繰り返すなどの迷惑行為があってうちのメールサーバのfail2banが弾いたIPアドレスからCIDRをひいて集めたもの。

ところで、これを何に使うのか。
メールサーバで使うのが目的。かなりニッチ。 いまどきIPアドレスベースで中国の3大通信グループをだけをどうこうしても無駄じゃないかと思われるかもしれないが、意外とこれで多くの迷惑さんを弾ける。
あとはブラジル・ロシア・インドネシア・米国といったところか。ブラジルは割と簡単だけど、ロシアとインドネシアはアホみたいに小さなネットワークのISPが多いようでかなり厄介。
外国でもすべての個人用ISPでOP25Bを採用して欲しいとつくづく思う。とはいえ、SMTPはこれで弾くのはあまり好ましくないかな?POP3やIMAP4は良いかと思う。