おしらせ:CDN対応しました+α

PC・モバイル報告忘備録
この記事は約6分で読めます。

いくつかのお知らせと、それに伴うトラブル対応を簡潔に。
雑記的に書いているので、悩みがあって藁にもすがる思いで検索してたどり着いた場合、ページ内検索したほうが早いかも

変更点

テーマの変更

今回の変更ではないけれど、先日このブログのテーマをcocoonに変えた。

理由はgoogleの「モバイル ユーザビリティ」へより対応するため

もともと使ってたSimplicityの事実上の後継テーマ。同じ作者なだけあって基本的な使い方は同じ。
移行自体はすんなりと出来た。

URL変更

URLの形が変更になりました。
最近では一番大きな変更点1

各ページのURLの末尾に「?p=数字」が付く形から「/post/数字/」に変わりました。

今までのURLもそのまま使えるので、かたかけぽしぇっとにリンクをして下さってる場合、変更とかは不要です。

本当はURLは少しでも短くしたい派2なので「/p/数字/」にする予定だったけど、postなのかpage3なのかが紛らわしかったのでこの形に。
数字ベースを使ったのは『今の時代、いちいちURLの細部まで見ないし、そもそも表示されないこともザラ』と言う経験から4

まとめページ(固定ページ)見直し

固定ページのURLは以前の「数字がつく形式」から、一目で内容がわかる単語を含んだURLに変更しました5
こちらも以前のURLでもアクセス出来ます

ナマコブシまとめページ作成

ブログ変更告知とは少し趣旨が変わりますが
まとめページの見直しついでに、ナマコブシのまとめページを独立させて、せっかくなので本格的にまとめ直してみました

ナマコブシまとめ
個人的に大好きなポケモンの1匹「ナマコブシ」に関するネタ。主にナマコブシグッズ紹介。(・大・)ぶっし……ナマコブシ公式グッズ公式グッズを発売日順に。立体物はほぼ網羅。2017年モンコレGET発売日:2017/1月上旬世界初の公式ナマコブシグ...

1記事書くには足りなかったナマコグッズ・ナマコネタもこの機会に合わせて記載。

CDN対応・高速化

かかった手間6的な意味では、今回最大の変更点。

最近googleのモバイルページの通信速度の判定が厳しくなってきたので、これを機にCDNサービスを使用することにしました

情報が多い物7を使うのもいいけれど、発展途上の世界の方が面白い。
そんな理由で、「QUIC.cloud」という新CDNを採用8

それに伴い最新の規格「QUIC」や 「HTTP/3」にも対応しました

作業メモ+ハマったところ

環境依存のトラブルも多いので参考にならないと思うけれど、情報皆無なのと何かとっかかりが有るのでは雲泥の差があるので忘備録も兼ねて記載。
ここからは一応技術情報系のネタ
悩んで検索した時に引っかかることを想定しているので、細かい用語の説明は省略。

QUIC.cloudとLiteSpeed Cache関連

基本設定

今回はこちらのサイトを参考にさせていただいた。

Cloudflare DNSのみ利用してQUIC.cloud CDNを使う準備 | デフよん
LiteSpeed CacheプラグインのQUIC.cloud CDNを使い始めました | デフよん

基本的にはこのサイトのとおりにやったおかげでCDN対応できた。

ハマり:ネイキッドドメインの設定

今回最初のハマり。
上で紹介したサイトの内容と被ってしまうけど、苦労したことなので9

CDNを使うためには、現在使用中のドメインが「オリジンサーバ」10ではなく「CDNのサーバー」に繋がるように変更する

なので、DNSサーバーでCNAMの設定が必要になる

ところが、サイトにアクセスするURLとしてネイキッドドメイン(URLにwwwが付かないやつ)を使用している場合、一般的には「ネイキッドドメインにCNAMEは設定できない」という仕様のおかげで大苦戦。

結論を言うと、ネイキッドドメインにCNAMEを設定できる数少ない11DNSである「Cloudflare」のDNSを使用することで解決した

DNS設定後プライバシーエラーになる

今回ハマったところその2。

無事CDNのサーバーをCNAMEに設定した後も問題は続く。

切り替え後、サイトにアクセスしようとすると「プライバシーエラー」安全ではない接続扱いされてアクセスできなくなってしまった12

エラーの詳細「net::err_cert_authority_invalid”」。

エラーコード等で検索13してもさっぱりわからず、ここでも大苦戦。

こちらも解決方法はごく単純な話。
LiteSpeed CacheのQUIC.cloud CDNを使う設定を一度OFFにして再度ONにしたらエラーにならずアクセスできるようになった

解決してみれば非常にあっけない、誰も書き残していない(=検索しても情報がない)のも納得な話

cocoon関連

理由は正直わかってないけど、虱潰しの手法で解決したもの

トラブル:ページ幅が変わるとCSSが適応されない

何故か「ページ幅が変わるとCSSが適用されなくなって、白い背景に文字と画像が並ぶサイトになってしまうという」症状が発生。

cocoonの高速化設定のcssの圧縮を無効にすることで解決した

トラブル:画像が表示されない

文字通り画像が表示されなくなってしまった症状。

これもcocoonの高速化設定の変更で解決

ただし、「高速化を有効にすることで正常になる」珍しいケース。
これは流石に自分の環境だけな気もするけれど、参考までに。

 

以上、お知らせとトラブル対応のメモ書きでした。

 

注釈
  1. 告知ページを作った一番の理由。[]
  2. 数字ベースのデフォルト「/archives/数字/」にしなかったのはarchivesですら長すぎると感じるため。[]
  3. ページ遷移時に使われている。[]
  4. 最近の人はおすすめ表示を回るだけでURLすら意識しないという噂も聞くけど・・・?[]
  5. ぶっちゃけWordPressの仕様に合わせる都合。ただURLにpyukumukuと入れたかったというのもある。[]
  6. 知っていれば簡単なんだろうけど、知らないと意外なところでハマって時間を食う系。他のトラブル対処等も合わせて丸1日以上かかってしまった。[]
  7. 「最新版に対応した情報」となると意外と少なかったりするので、意外と手間が発展途上の物と変わらないことも多々ある。[]
  8. 使っている高速化プラグイン「LiteSpeed Cache」に合わせたのも理由。[]
  9. そもそもQUIC.cloudが公式で推奨している方法なので、きちんと目を通さなかった自分が悪い話。[]
  10. 本来のサーバー[]
  11. 正直、他に知らない。[]
  12. 厳密には一手間かければ繋がるけど、普通はアクセスしようとは思わなくなる。[]
  13. 最近のgoogleの検索エンジンの劣化っぷりが酷すぎるせいな気もする。怪しいワードサラダのようなサイトばかりがヒット。[]

コメント

タイトルとURLをコピーしました