受託会社のCTOのメモ

チラシの裏

bitnamiでwordpressが落ちる時のMySQL php-fpm周りのチューニングメモ

ログ内容

[26-Sep-2019 12:59:26] WARNING: [pool wordpress] server reached pm.max_children setting (5), consider raising it
[26-Sep-2019 13:00:55] WARNING: [pool wordpress] server reached pm.max_children setting (5), consider raising it
[26-Sep-2019 14:04:56] WARNING: [pool wordpress] server reached pm.max_children setting (5), consider raising it
[26-Sep-2019 21:29:14] WARNING: [pool wordpress] seems busy (you may need to increase pm.start_servers, or pm.min/max_spare_servers), spawning 8 children, there are 2 idle, and 16 total children
[26-Sep-2019 21:29:15] WARNING: [pool wordpress] seems busy (you may need to increase pm.start_servers, or pm.min/max_spare_servers), spawning 16 children, there are 3 idle, and 18 total children
[26-Sep-2019 21:29:16] WARNING: [pool wordpress] seems busy (you may need to increase pm.start_servers, or pm.min/max_spare_servers), spawning 32 children, there are 1 idle, and 19 total children
[26-Sep-2019 21:30:50] WARNING: [pool wordpress] server reached pm.max_children setting (25), consider raising it

エラーログの場所

$ /opt/bitnami/php/var/log/php-fpm.log
$ /opt/bitnami/mysql/data/mysqld.log
$ /var/log/syslog

設定ファイル

$ /opt/bitnami/php/etc/php.ini 
$ /opt/bitnami/apps/wordpress/conf/php-fpm/php-settings.conf
$ /opt/bitnami/php/etc/php-fpm.conf
$ /opt/bitnami/mysql/bitnami/my.conf

再起動コマンド

$ sudo /opt/bitnami/ctlscript.sh restart apache
$ sudo /opt/bitnami/ctlscript.sh restart php-fpm
$ sudo /opt/bitnami/ctlscript.sh restart mysql

確認コマンド

$ free
$ free -g
$ top #負荷平均わかる

プロセス数確認

$ ps -ef | grep 'php-fpm: pool' | wc -l

$ ps ax | grep mysql

負荷テスト

$ ab -n 100 -c 100 http://3.113.234.85.xip.io/

n : リクエストの総数を数値で指定 c : 同時に発行するリクエストの数を数値で指定

参考サイト

docs.bitnami.com

yakst.com

背景がボーダー(とか単色ではない)の吹き出し

f:id:fujitora:20190403213211p:plain
背景がボーダーのデザイン

こんなやつ

・レスポンシブでもデザインの背景に切れ目が入らない

・複数行でも対応できる を満たす実装

html

<div class="title">背景がボーダーの吹き出しのタイトル</div>
<br><br><br>
<div class="title">背景がボーダーの吹き出しのタイトル改行が入っても大丈夫です。<br>背景がボーダーの吹き出しのタイトル改行が入っても大丈夫です。<br>背景がボーダーの吹き出しのタイトル改行が入っても大丈夫です。</div>

css

.title {
  position: relative;
  padding: 16px 10px 35px;
  font-weight: bold;
  text-align: center;
  background-image: linear-gradient(-45deg, #Fe4d40 25%, #ff978a 25%, #ff978a 50%, #Fe4d40 50%, #Fe4d40 75%, #ff978a 75%, #ff978a);
  background-repeat: repeat;
  background-position: center;
  background-size: 8px 8px;
}
.title::before,
.title::after {
  position: absolute;
  content: "";
  display: block;
  bottom: 0;
  border-bottom: 20px solid white;
  width: 50%;
  box-sizing: border-box;
}
.title::before {
  left: 0;
  border-right: 20px solid transparent;
}
.title::after {
  right: 0;
  border-left: 20px solid transparent;
}

Railsにnpmでfullcalendarを導入

課題

  • gemもあるけど公式から入れたい
  • jqueryは未導入

方法

$ npm install jquery moment fullcalendar

application.jsに以下を追加

//= require jquery/dist/jquery
//= require moment/moment
//= require fullcalendar/dist/fullcalendar
//= require fullcalendar/dist/locale/ja
$(document).ready(function() {
  $('#calendar').fullCalendar({
  // オプションはここに追加
  })
});

application.scssに以下を追加

@import 'fullcalendar/dist/fullcalendar';

表示させたいviewファイルに追加

#calendar

サーバー再起動すれば動く

Docs

fullcalendar.io

ライブ配信のポイント購入画面のUI

ライブ配信のポイント購入画面のUIのスクショ

ツイキャス

f:id:fujitora:20190104164512p:plain
ツイキャス

LINE LIVE

f:id:fujitora:20190104163944p:plain
LINE LIVE

17 live

f:id:fujitora:20190104164032p:plain
17live

Mirrativ

f:id:fujitora:20190104165011p:plain
Mirrativ

mix channel

f:id:fujitora:20190104164301p:plain
mixchannel

showroom

f:id:fujitora:20190104164344p:plain
showroom

spoon

f:id:fujitora:20190104164421p:plain
spoon

MacbookをMojaveにアップデートしたらbundle installでこける

問題

MacbookをMojave 10.14にアップデートしたらbundle installでこける

(略)
An error occurred while installing ffi (1.9.25), and Bundler cannot continue.
Make sure that `gem install ffi -v '1.9.25' --source 'https://rubygems.org/'` succeeds before bundling.

In Gemfile:
  selenium-webdriver was resolved to 3.14.0, which depends on
    childprocess was resolved to 0.9.0, which depends on
      ffi

f:id:fujitora:20190102225244p:plain

解決方法

  1. xcodeをアップデート App Storeからxcodeをアップデート

  2. コマンドラインツールをインストール

$ sudo xcode-select --reset

今まで入ってたはずなのに

  1. パッケージのインストール
$ open /Library/Developer/CommandLineTools/Packages

でFinderにインストール用のパッケージがあるのでダブルクリックでインストール

参考サイト

qiita.com

qiita.com

macOS を Mojave にあげた後に Homebrew を使うとエラーが出る問題 | gotohayato

All-in-One WP Migrationの"Maximum upload file size: 40 MB."の解決方法

問題

All-in-One WP Migrationでエクスポートしたデータが容量制限のせいでインポートできない f:id:fujitora:20181128150458p:plain

"Maximum upload file size: 40 MB."

Bitnamiで構築したサーバーなので

$ vi /opt/bitnami/php/etc/php.ini 

post_max_sizeupload_max_filesize の16を512にして

$ sudo /opt/bitnami/ctlscript.sh restart

Docs

Modify the PHP file upload limit

AdminLTEのサイドバーを固定した時にスクロールすると背景色がかからない

問題

f:id:fujitora:20181109135253p:plain

AdminLTEでヘッダ固定、サイドバー固定をして、スクロールすると画像の赤枠以降に背景色が適用されない。 bodyについてるクラスはこれ

body class="skin-blue fixed sidebar-mini sidebar-mini-expand-feature"

解決方法

cssを書く

.content-wrapper {
  overflow-y: auto;
}

RailsでFUJISSLのファイル認証をする

NginxでなくRails側でファイル認証をする

routes.rb

get "/.well-known/pki-validation/fileauth.txt" => "top#ssl"

top_controller.rb

class TopController < ApplicationController
  def index
    hogehoge
  end

  def ssl
    render plain: "(ファイル認証の文字列)"
  end
end

スクロールしたときに要素が画面上部からどの位置にいるか取得する

coffeescript

$ ->
  $(window).scroll ->
    console.log $('.target-element').offset().top - $(window).scrollTop();

スクロールするたびにコンソールに画面上部からの位置が表示される

f:id:fujitora:20180905154144p:plain

bitnamiをssl化する

csrの作成

秘密鍵を作成

$ sudo openssl genrsa -out /opt/bitnami/apache2/conf/server.key 2048

秘密鍵からCSRを作成

$ sudo openssl req -new -key /opt/bitnami/apache2/conf/server.key -out /opt/bitnami/apache2/conf/cert.csr

作成のための質問項目に回答する

You are about to be asked to enter information that will be incorporated
into your certificate request.
What you are about to enter is what is called a Distinguished Name or a DN.
There are quite a few fields but you can leave some blank
For some fields there will be a default value,
If you enter '.', the field will be left blank.
-----
Country Name (2 letter code) [AU]:JP
State or Province Name (full name) [Some-State]:Tokyo
Locality Name (eg, city) []:Minato-ku
Organization Name (eg, company) [Internet Widgits Pty Ltd]:hogehoge, inc.
Organizational Unit Name (eg, section) []:development
Common Name (e.g. server FQDN or YOUR name) []:hogehoge.com
Email Address []:info@hogehoge.com

Please enter the following 'extra' attributes
to be sent with your certificate request
A challenge password []:
An optional company name []:
$ mv cert.csr server.csr

ファイル認証

$ sudo vi /opt/bitnami/apache2/conf/bitnami/bitnami.conf
<VirtualHost _default_:80>
  DocumentRoot "/opt/bitnami/apache2/htdocs"
  RewriteEngine on←追加
  RewriteCond %{REQUEST_URI} !=/.well-known/pki-validation/fileauth.txt←追加

/home/bitnami/apps/wordpress/htdocs/.well-known/pki-validation にfileauth.txtを作成

各種ファイル作成

crtとcaを作成する。

$ sudo vi /opt/bitnami/apache2/conf/server.crt
$ sudo vi /opt/bitnami/apache2/conf/server-ca.crt

権限変更

$ sudo chown root:root /opt/bitnami/apache2/conf/server*
$ sudo chmod 600 /opt/bitnami/apache2/conf/server*

conf file編集

$ sudo vi /opt/bitnami/apache2/conf/bitnami/bitnami.conf
<VirtualHost _default_:80>
  DocumentRoot "/opt/bitnami/apache2/htdocs"
  RewriteEngine On←追加
  RewriteCond %{HTTPS} !=on←追加
  RewriteRule ^/(.*) https://%{SERVER_NAME}/$1 [R,L]←追加
<VirtualHost _default_:443>
  DocumentRoot "/opt/bitnami/apache2/htdocs"
  SSLEngine on
  SSLCertificateFile "/opt/bitnami/apache2/conf/server.crt"
  SSLCertificateKeyFile "/opt/bitnami/apache2/conf/server.key"
  SSLCertificateChainFile "/opt/bitnami/apache2/conf/server-ca.crt" ←追加
$ sudo /opt/bitnami/ctlscript.sh restart apache

(注)

SSLCertificateChainFile "/opt/bitnami/apache2/conf/server-ca.crt"

ApacheのバージョンでSSLCACertificateFileかSSLCertificateChainFile変わる

Doc

Bitnami Application Stacks

Bitnami Application Stacks

AWS EC2のbitnamiにbasic認証をかける

環境

実装

$ cd /opt/bitnami
$ sudo apache2/bin/htpasswd -cb apache2/wordpress_users USERNAME PASSWORD
$ sudo vi /opt/bitnami/apps/wordpress/conf/httpd-app.conf

以下に書き換える。

4行追加 & Require all grantedコメントアウト

<Directory "/opt/bitnami/apps/wordpress/htdocs">
    ...
      AuthType Basic
      AuthName MyAuthName
      AuthUserFile "/opt/bitnami/apache2/wordpress_users"
      Require valid-user
    ...  

    <IfVersion >= 2.3>
    # Require all granted
    </IfVersion>
    ...
  </Directory>
$ sudo /opt/bitnami/ctlscript.sh restart apache

ドキュメント

docs.bitnami.com

docs.bitnami.com