Qve [design communication]

Communication Design Studio.

カテゴリー「WEB」の一覧

7/30
2016

Page Speed Insights

ここ数年は SSL だの サイトの応答速度だの………
書いている内容に関することよりも、ページが早く安全に見えることが重要っぽいですね。
まぁ、パクリ記事が多いからしょうがないんですかね。
調べ物をしていると、ほとんど同じ内容でいくつものサイトが出てくるのも本当の話。

そう思うと、数秒待って開かないサイトは、間違いなく閉じちゃいますね。
なんであんなに開かないんだろう。Javascript? CSSが巨大? 画像が重い?
エントリーが多すぎるとか?

ということで気になったのでやってみた次第。
Googleのサービス Page Speed Insights

広告も全部外して、CSSもミニファイして影響のない物は非同期に。Javascriptも同様。さらにデスクトップとモバイルの表示エリアが異なるので、読み込まれるJSとCSSもUAで振り分けて非同期読み込み。

致命的な警告は出なくなり、緑のサインになったようです。
まずまずな感じですね。

mobile

desktop

あとは「ページ表示のどこに時間がかかったかチェック」のブックマークレットでも試して見ましたが、
「ごっつい速いですね。」と褒めていただきました。
ま、ページのソースも短いですし (^^;

gottu

7/15
2016

調子に乗ってオンラインストレージもSSLに

Let’s Encrypt で SSL 化がうまくいったもんだから、調子に乗って ownCloud も常時SSL化。
でも遅い……なんとか高速化できないものかと情報を漁ってみると……

owncloud

ownCloud9 + php7 で爆速オンラインストレージ構築というスライドを発見。
どうやら細々としたノウハウがあるようだけど、ownCloud9 + php7 という組み合わせは試してみる価値がある様子。

幸か不幸か、本体はこの前9にアップデートしたところなのでphp7に切り替えるだけ。早速やってみると……なんと体感できるぐらい早くなってるじゃないですか。

しばらくこの感じで使ってみることにします。

そう。誰しもが考えますよねぇ。
wordpressもphp7で動かしたら早くなるんじゃねぇの?
プラグインを一つ諦めましたが……
速くなりました。うひひ。

こちらもしばらく様子見。

7/15
2016

Apple ID保護のためパスワードのリセットが必要です

先日 Facebook にシェアした「「最大4000万人分のiCloudパスワードが漏れた可能性があるので今すぐパスワード変更すべき」と有名アンチウイルスソフトメーカーのカスペルスキーが警告」を見て、すぐにパスワード変更をしたんですが、今朝になってAppleからメールが(笑)

「Apple ID保護のためパスワードのリセットが必要です」ですと?

AppleID

すでに変更しているのに……面倒な話です。
胡散臭い気がしたので、直接 Apple Store にログインしてみます。
どうやら本物っぽいようで AppleIDにアクセスしようと思うと、すでにアカウントがロックされているではありませんか。

くどいようですが…やはり本物っぽいようですが、最近はフィッシングも多いので、メールで届いたURLをクリックするのはできる限り避けたいですね。

皆さまもお気をつけあそばせ。

7/13
2016

今さらながら Let’s Encrypt で SSL化

あれ以来マシンも順調に動いております。
残念ながら、MacPro Early2008 は、次期 macOS Sierra の対象外となってしまいましたが……OSもようやく OS X El Capitan‎ に。そして AdobeCC2015 に完全移行しました。
幸いユーティリティ類も全て問題なく動作しておりますし、ちょっともたつく以外は(笑)特に問題はありません。
余っていたSSDによく使うアプリを移動して、アプリフォルダにシンボリックリンク……とすると、インストール済みアプリとして認識してない様子。
しばらくの辛抱なので、このまま続行です。

さて閑話休題、紆余曲折しながらもようやく常時SSLとしました。
以前に使っていた coreserver が SNI に対応したとのことで、固定IP契約不要でSSLが使えそうなので欲をかいてやってみようと思ったのがきっかけでした。
最初は Cloud Flare (https://www.cloudflare.com)を試すも、ネームサーバを書き換えたら、DNS も Cloud Flare で管理されていることに気づかず……かなりハマりました。
証明書を見てみると、複数のドメインがひとまとめ、ものすごいパックになっていてビックリ。どことなく挙動もおかしかったので、いったんすべて抹消。

共用サーバーなので自動更新は無理なのですが、そんなに手間でもなさそうですし、面倒で嫌になるまでやってみようかと思って Let’s Encrypt をインストール。
幸いベータ版からの先人が数多く存在するので、環境を整えるまでの時間はさほどかかりませんでした。
というかそのあとも、証明書を発行してサーバーにインポートするのもあっけなく終了。

誰かの役に立つかもしれないので、備忘録として拙いログを晒しておきます。

El Capitan (10.11.5)
Mac Pro (Early 2008)
Coreserver (core-A)
Xserverで他のドメインは使用(AレコードのみCoreserverに向けている)
value-domain でドメイン管理
GoogleApps 使用

なんとも特異な環境ですが(笑)

Let’s Encrypt のインストールは「ウェブタタン」さんのエントリーが、非常にわかりやすく解説されていて助かりました。

Let’s encryptのSSL証明書をMacで作成!さくらレンタルサーバーに導入する方法

あちこちを見ながらやったので、私の環境は新旧織り交ぜた環境になってるような気がします。
まず公式を見て、言われるがまま Git から certbot を……

git clone https://github.com/certbot/certbot

として云々。
途中で権限エラーや get できないからソースからコンパイルしちゃうよ〜みたいなメッセージがズラズラと……。
半ばあきらめていたところ、先ほどの「ウェブタタン」さんのエントリーを発見。

じっくり読み進め、表示されているエラーを解説通りに進めていき、なんとか動作するように(笑)
まぁこの辺りは本職でないので、基本結果オーライで行っちゃってます。
そして、待望の証明書発行へ。

$ cd certbot
$ ./certbot-auto certonly --manual -d example.com -d www.example.com -d sub.example.com

とすると、UNIXっぽいスクリーンが表示されますので、ガイドに沿って進めていきます。

 

 

今回はサブドメインも含めて、3つをひとまとめにしたSSL証明書を発行しますので、-d オプションでドメインを3つ並べます。

Make sure your web server displays the following content at
http://example.com/.wexx-xxxn/acme-challenge/OdNmEVBSEvJJqvqZmGdmB_1yVBSEvJJqdmDFyo before continuing:

OdNmEVBSEvJJqvqZmGdmB_1yVBSEvJJqdEvJJqmDFyoFyo.uh6sL2eW-jvA6CMmUz-Hs67e4bBU_doPOlIjxnzRGvg

If you don't have HTTP server configured, you can run the following
command on the target server (as root):

mkdir -p /tmp/certbot/public_html/.well-known/acme-challenge
cd /tmp/certbot/public_html
printf "%s" OdNmEnv12_540PB_1yW6KDkIVBSEvJJqvqZmGdmDFyo.uh6sL2eW-jvA6CMmUz-Hs67e4bBU_doPOlIjxnzRGvg > .well-known/acme-challenge/OdNmEnv12_540PB_1yW6KDkIVBSEvJJqvqZmGdmDFyo
# run only once per server:
$(command -v python2 || command -v python2.7 || command -v python2.6) -c \
"import BaseHTTPServer, SimpleHTTPServer; \
s = BaseHTTPServer.HTTPServer(('', 80), SimpleHTTPServer.SimpleHTTPRequestHandler); \
s.serve_forever()"
Press ENTER to continue

こんなスクリーンで [Press ENTER to continue]と云うプロンプトで待機してます。
cui 操作が楽な人は、SSHでサーバーに接続した後サイトルートに移動して

mkdir -p .well-known/acme-challenge
printf "%s" OdNmEnv12_540PB_1yW6KDkIVBSEvJJqvqZmGdmDFyo.uh6sL2eW-jvA6CMmUz-Hs67e4bBU_doPOlIjxnzRGvg > .well-known/acme-challenge/OdNmEnv12_540PB_1yW6KDkIVBSEvJJqvqZmGdmDFyo

とかでいいんじゃないでしょうか。
私はFTPでディレクトリを作ってファイルをアップしました。
結果は目的のファイルにアクセスできればいいだけの話だと思うので、お好みでどちらでもいいと思います。

ドメインが3つあるので、ドメインごとに3回認証作業を行います。

無事終了すると

/private/etc/letsencrypt/live/[ドメイン名]

にシンボリックリンクが出来上がります。

root権限のあるサーバーだと、この証明書のシンボリックリンクを然るべき場所に置いて、cron で回せば自動更新……ということのようです。

あとは Value Dmain のコントロールパネルで「SSL証明書のインポート」をするだけ。

/private/etc/letsencrypt/live/[ドメイン名]/cert.pem (証明書)
/private/etc/letsencrypt/live/[ドメイン名]/chain.pem (中間証明書)
/private/etc/letsencrypt/live/[ドメイン名]/fullchain.pem (ひとまとめになった証明書)
/private/etc/letsencrypt/live/[ドメイン名]/privkey.pem (プライベートキー パスフレーズなし)

証明書はテキストファイルなので、テキストエディタで開いて貼り付けます。
必要なファイルを選んで貼り付けてください。

coreserver のドメイン設定でSSLに割り当てるドメインの設定を忘れずに。

SSL 配下でうまくリファラっぽく送る方法を思いついたので、ついでにダウンロードサーバーの php も SSL 配下で正常動作するように書き換えました。

4/7
2013

Functions.php って……

wordpress のテーマで使うアレです。
ココにかくphpって、単独ファイルにしてプラグインヘッダ(っていうんですかね)を追加すると、プラグインとして動作するんですね。
トップページに「最近のPOSTはこんな感じです」ってのを載せてますが、functions.php に書いてる内容を反映させてます。
で、iPhone 等のモバイル端末から見ると残念なことになってたのですが(笑)、プラグイン化することで、どこから見ても見えるようになりました。