Mackerel(マカレル)

はてなが開発した新世代のサーバ管理・監視サービス。
仮想サーバなどクラウドサービスをMackerelで統合管理および監視ができる。

-> box listを表示
MyCentOS>vagrant box list
bento/centos-6.7 (virtualbox, 2.2.7)
bento/centos-6.8 (virtualbox, 2.3.0)
trusty64 (virtualbox, 0)
ubuntu/trusty64 (virtualbox, 20161207.0.0)

Mackerelは入っていない。当然か。

これ打っていいのか。

vagrant box repackage mackerel/centos66 virtualbox 0.0.2

ちゃうちゃう、hatenaのサイトから無料トライアル

apacheとnginxの比較

まず、nginx
[vagrant@localhost local]$ nginx -v
nginx version: nginx/1.14.0

あれ、入ってますね。
起動してみます。
[vagrant@localhost local]$ sudo service nginx start
nginx を起動中: nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] still could not bind()
[失敗]
あ、ポート80はapacheが使ってるからか。

比較
Apacheは、プロセス駆動アーキテクチャでマルチプロセス。これは、各リクエストをプロセスに割り当てて処理を行う。リクエストが大量に来た際、プロセスが同時に起動するのでオーバーヘッドが非常に大きくなるというデメリットがある。

nginxは、イベント駆動アーキテクチャ、シングルスレッドモデル。 シングルスレッドでループ処理をまわし、キューに溜まったイベントを処理していく処理方式（イベントループ方式）（node.jsなどでも採用）。プロセス数はCPUコア数と基本的には同じに設定。

＝＞リクエストが多い場合は、単純にマルチプロセルの方が速そうだが。
＞nginxの方が、処理が軽く、大量のリクエストを処理するのに向いている。
なに？なぜだ？

>nginxは、CPUリソースがたくさん必要な処理には向いていない。処理時間が長くなる処理を実行した際、そこでプロセスがブロックされてしまい処理能力が落ちてしまう。
これはシングルだから、納得できますね。

>NGINXは大量処理、スピード重視を徹底的に追求
同時アクセスはnginxの方が良いと書かれている。
う～ん、イマイチ納得いかない。

コマンドを変えてみるが、
[vagrant@localhost local]$ sudo nginx
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] still could not bind()

あかん

MySQLにHTMLタグを保存する

とりあえずdatabaseから作ります。

mysql> create database if not exists send_mail;
Query OK, 1 row affected (0.30 sec)

続いて、table

mysql> create table send_mail.html(
    ->  'id' int AUTO_INCREMENT,
    ->  'html' MEDIUMTEXT,
    -> );
ERROR 1064 (42000): You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near ''id' int AUTO_INCREMENT,
 'html' MEDIUMTEXT,
)' at line 2

あれ、シングルクオテーションは必要ないか。。

sql文を編集します。

create table send_mail.html(
 id int AUTO_INCREMENT NOT NULL PRIMARY KEY,
 html MEDIUMTEXT
);

OK！ insertしていきましょう♪

mysql> INSERT INTO send_mail.html (html)
    ->   VALUES ('タイトルが入ります');
Query OK, 1 row affected (0.46 sec)

mysql> select * from html;
+----+--------------------------------------------+
| id | html                                       |
+----+--------------------------------------------+
|  1 | タイトルが入ります          |
+----+--------------------------------------------+
1 row in set (0.12 sec)

うお！きたきたきたきた！

titleタグ以外のタグを入れてみます。

mysql> INSERT INTO send_mail.html (html)
    ->   VALUES ('');
Query OK, 1 row affected (0.53 sec)

mysql> select * from html;
+----+-----------------------------------------------+
| id | html                                          |
+----+-----------------------------------------------+
|  1 | タイトルが入ります             |
|  2 |  |
+----+-----------------------------------------------+
2 rows in set (0.09 sec)

おうおう。OKだ。

pdoでmysqlからfetchする。

<?php

try {
$pdo = new PDO('mysql:host=localhost;dbname=send_mail;charset=utf8','root','',
	array(PDO::ATTR_EMULATE_PREPARES => false));
} catch (PDOException $e) {
 exit('データベース接続失敗。'.$e->getMessage());
}
$stmt = $pdo->query("SELECT * FROM html where id = 2");
while($row = $stmt -> fetch(PDO::FETCH_ASSOC)){
	$img = $row["html"];
	echo $img;
}

おいおいおい！！！！
それでは、ひっぱてきたhtmlタグをmb_send_mailで送信したいと思います。

<?php

try {
$pdo = new PDO('mysql:host=localhost;dbname=send_mail;charset=utf8','root','',
	array(PDO::ATTR_EMULATE_PREPARES => false));
} catch (PDOException $e) {
 exit('データベース接続失敗。'.$e->getMessage());
}
$stmt = $pdo->query("SELECT * FROM html where id = 2");
while($row = $stmt -> fetch(PDO::FETCH_ASSOC)){
	$img = $row["html"];
}

mb_language('Japanese');
mb_internal_encoding("UTF-8");
$header_info="From: admin@example.com"."\nContent-Type: text/html;charset=ISO-2022-JP\nX-Mailer: PHP/".phpversion();

$insert = "差し込み文章";

$body = <<< EOM
<!DOCTYPE>
<html lang="ja">
<head>
</head>
<body>
Look!<br>
<strong style="color:red;">apple</strong><br>
{$img}<br>
{$insert}が入ります。
</body>
</html>
EOM;
print $body;
mb_send_mail("hogehoge@hoge.com",'test',$body,$header_info);
?>

おおおおおおお、簡単だが、おおよその仕組みはわかった。

次は実際に届いてるHTMLメールのソースコードを見てみよう。

ヒアドキュメントに差し込む

$insert = "差し込み文章";

$body = <<< EOM
<!DOCTYPE>
<html lang="ja">
<head>
</head>
<body>
Look!<br>
<strong style="color:red;">apple</strong><br>
<img src="http://hpscript.com/app/apple.jpg">
{$insert}が入ります。
</body>
</html>
EOM;

レンダリングがおかしなことになってる。

続いてmysqlですね。

mb_send_mailで画像を送信

$body = <<< EOM
<!DOCTYPE>
<html lang="ja">
<head>
</head>
<body>
Look!<br>
<strong style="color:red;">apple</strong><br>
<img src="http://hpscript.com/app/apple.jpg">
</body>
</html>
EOM;

画像を置いてるパスを指定すれば、問題なく送信できます。
これはS3でもいいですね。

$body = <<< EOM
<!DOCTYPE>
<html lang="ja">
<head>
</head>
<body>
Look!<br>
<strong style="color:red;">apple</strong><br>
<img src="http://hpscript.com/app/apple.jpg">

<audio id="audio" preload="auto">
   <source src="http://hpscript.com/app/0.mp3" type="audio/mp3">
   <p>※ご利用のブラウザでは再生することができません。</p>
</audio>
<input type="button" onclick="audioPlay()" value="再生">
<input type="button" onclick="audioPause()" value="停止">
</body>
</html>
EOM;

mp3だと再生されないようです。
さあ、次は、

phpでHTMLメールの送信

vagrantから送信します。

<?php
mb_language('Japanese');
mb_internal_encoding("UTF-8");
$header_info="From: admin@example.com"."\nContent-Type: text/html;charset=ISO-2022-JP\nX-Mailer: PHP/".phpversion();

$body = <<< EOM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Type" content="text/html; charset=iso-2022-jp">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>sample</title>
<meta http-equiv="Content-Style-Type" content="text/css">
</head>
<body>
hogehoge<br>
<strong>Hello</strong>
</body>
</html>
EOM;
print $body;
mb_send_mail("hoge@career.com",'test',$body,$header_info);
?>

hotmail、携帯のキャリア　どちらにもhtmlメールで到着しますね。
bodyのEOMのところを(1)HTML5で送りたい、(2)CSSでスタイリングしたい、(3)動画を送りたい、(4)MySQLから引っ張て来て送信したい

html5でも問題ありません。

$body = <<< EOM
<!DOCTYPE>
<html lang="ja">
<head>
</head>
<body>
engineer<br>
<strong>meet up</strong>
</body>
</html>
EOM;

例えば、インラインスタイルでも

$body = <<< EOM
<!DOCTYPE>
<html lang="ja">
<head>
</head>
<body>
engineer<br>
<strong style="color:red;">meet up</strong>
</body>
</html>
EOM;

大丈夫ですね。

次は、youtubeのiframe、画像、mp3で行きましょう。

$body = <<< EOM
<!DOCTYPE>
<html lang="ja">
<head>
</head>
<body>
today's Video<br>
<strong style="color:red;">Michael Jackson - Thrillers</strong>
<iframe width="200" height="150" src="https://www.youtube.com/embed/sOnqjkJTMaA" frameborder="0" allowfullscreen></iframe>
</body>
</html>
EOM;

iframeだと上手く表示されません。何故でしょう。mail boxはserver上なので、headerが問題でしょうか？
XSS・クロスサイトスクリプティング対策か。。

雲

円を三つ書きます
続いて、effectのfree distort

ドラックして調整
形がおかしいですね。