AngularJS と Rails の form_for を組み合わせて使ってみました。 何より厄介なのは action 属性 が 自動でついてしまうことです。
環境
Rails 4.1.8
Ruby 2.2.2
AngularJS 1.4.7
Ubuntu 15.04
状況
Rails の form_for
を使うと、 Rails が action 属性 から すべて 設定してくれます。 もちろん、 form タグ の属性を 追加することもできます。 ただし AngularJS を使う上では問題がありました。
問題になるのは次のコードです。
<%= form_for ( @user , html : { 'data-ng-submit' : 'mainCtrl.create()' , novalidate : : novalidate , name : 'createForm' } ) do | f | %>
<%= f . label : name %>
<%= f . text_field : name , required : : required , 'data-ng-model' : 'user.name' %>
< button > submit < / button >
<% end %>
このコードでは、 ボタンをクリックすると AngularJS による処理が実行された後で 本来の form の処理が実行されます。
AngularJS は、 action 属性 がないときは 本来の form の処理を行わないのですが、 Rails で action 属性 が自動でつけられている以上どうしようもありません。 いや、 action 属性 を消す方法があるのかもしれませんが、 私は見つけることができませんでした。
解決法
form タグ に onsubmit="return false;"
を付け加えます。
<%= form_for ( @user , html : { 'data-ng-submit' : 'mainCtrl.create()' , novalidate : : novalidate , name : 'createForm' , onsubmit : "return false;" } ) do | f | %>
<%= f . label : name %>
<%= f . text_field : name , required : : required , 'data-ng-model' : 'user.name' %>
< button > submit < / button >
<% end %>
button タグ で type="button"
とすると、 ボタンクリック時はどうにか二重処理を防げますが、 入力欄で Enter を押されたときは防げません。
また AngularJS: How to prevent form submission after click on button? に記載されているような方法もありますが、 javascript として 他のところで使えないので、 上に書いたやり方の方がきれいに見えます。
無限小数になる有理数は循環小数になることを証明します。 無限小数になる有理数というのは、 有理数になる小数の中で有限小数でないものになります。
割り算の操作をよく観察すればわかりそうなものですが、 感覚的なものを証明としてしっかり書いてみます。
感覚
たとえば 89 を 13 で小数の位まで順次割った場合、 余りは次のようになります。
\begin{eqnarray*}
89 \div 13 & = & 6 \; \textrm{余り} 11 \\
110 \div 13 & = & 8 \; \textrm{余り} 6 \\
60 \div 13 & = & 4 \; \textrm{余り} 8 \\
80 \div 13 & = & 6 \; \textrm{余り} 2 \\
20 \div 13 & = & 1 \; \textrm{余り} 7 \\
70 \div 13 & = & 6 \; \textrm{余り} 5 \\
50 \div 13 & = & 3 \; \textrm{余り} 11 \\
110 \div 13 & = & 8 \; \textrm{余り} 6
\end{eqnarray*}
7 回目 の割り算で 1 回目 と同じ余りが出てきました。 13 で 割った時の余りの数は 1 から 12 の 12 種類しかありませんから、 13 回 割り算をやっても割り切れなかったら どこかで同じ余りが出ていて循環小数になることがわかります。
続きを読む 証明: 無限小数になる有理数は循環小数 →
有理数の定義は既知とします。 有理数でない実数を無理数といいます。
ここでは \( \sqrt{2} \) が無理数であることを証明します。
続きを読む 証明: \( \sqrt{2} \) は無理数 →
Perl でメールを送信する方法を紹介します。 私はこの仕組みを、サーバの状態を必要な時にメールで通知するスクリプトなどで利用しています。 (参考: Perl の経験皆無の私が作ったサーバ監視スクリプト )
環境
スクリプトを実行するコンピュータ
今回は2種類の環境でやってみました。
ケース2
EC2 Amazon Linux 2015.03
Perl 5.16.3
SMTPサーバ
EC2 Amazon Linux 2015.03
Postfix
コード
一番単純なサンプルコードを掲載します。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
#!/usr/bin/perl
use strict ;
use utf8 ;
use warnings ;
use Digest:: MD5 ;
use Authen:: SASL ;
use Net:: SMTP ;
my $header = "From: from@sample.com" ;
$header . = "nTo: to@sample.com" ;
$header . = "nSubject: subject" ;
$header . = "nMIME-Version: 1.0" ;
$header . = "nContent-Type: text/plain; charset=UTF-8" ;
$header . = "nContent-Transfer-Encoding: Base64n" ;
$smtp = Net:: SMTP-> new ( 'mail.sample.com' , Port = > 587) ;
$smtp -> auth ( 'user@sample.com' , 'password' ) ;
$smtp -> mail ( 'from@sample.com' ) ;
$smtp -> to ( 'to@sample.com' ) ;
$smtp -> data ( ) ;
$smtp -> datasend ( $header ) ;
$smtp -> datasend ( "n" ) ;
$smtp -> datasend ( 'message body' ) ;
$smtp -> quit ;
パスワード認証をしない場合は、 Digest::MD5
も Authen::SASL
も必要ありません。 もちろん auth
と書いてある行も不要です。 しかし今回は CRAM-MD5 でパスワード認証をしているので、 モジュールが必要になります。 Net::SMTP
の auth
メソッド が Authen::SASL
を利用し、 Authen::SASL
の中で Digest::MD5
が利用されるという流れです。
Authen::SASL
が入ってないと auth
を実行しても認証がおこなわれません。 Digest::MD5
が入っていないと、 Error: No SASL mechanism found と表示されます。
パスワードの認証方式は 自動で判別されています。 認証サーバで Digest-MD5 が有効であれば CRAM-MD5 よりも Digest-MD5 を優先的に使います。
そして、認証をするにはインストールしなければならないパッケージがあります。
Ubuntu の場合
libdigest-hmac-perl
libauthen-sasl-perl
Amazon Linux の場合
Amazon Linux の場合、 MD5 のモジュールが入っているパッケージ perl-Digest-MD5 はあらかじめインストールされています。
perl は最初からインストールされていることが多く、 Net::SMTP
モジュール は最初から使えるのですが、 認証するとなると別途インストールが必要になります。
Passenger, Nginx で Rails を動かすこととなりました。 しかし、デフォルトのインストール方法ではレスポンスに不要なヘッダが含まれてしまいますので、これを除去するために モジュールを含めて nginx のコンパイル・インストールを行いました。 以下はその記録です。
環境
Ruby 2.2.2
Nginx 1.8
Passenger 5.0.18
EC2 Amazon Linux 2015.03
手順
ruby はインストールされているものとして進めます。
Passenger の インストール
Nginx のインストール
Nginx 及び 必要なモジュールのダウンロード
コンパイル・インストール
nginx の設定
nginx の再起動 (または起動)
Passenger のインストール
gem install passenger
を実行して、 Passenger をインストールします。
Nginx のインストール
ここで root 権限 を使って passenger-install-nginx-module
とやれば、 nginx のインストールはできます。 nginx のソースをダウンロードしてコンパイルしてくれます。 しかし、その状態だと レスポンスヘッダに Nginx や Passenger の名前・バージョンが出力されます。
そういったヘッダを出力させないために、 モジュールを含めて Nginx をコンパイルする必要があります。
Nginx 及び 必要なモジュールのダウンロード
まずは Nginx と 必要なモジュールをダウンロードします。
sudo su -
で root ユーザ に変更して、 cd /usr/local/src
を実行します。
Nginx のダウンロード
Nginx (tar.gz形式) をダウンロードします。 このとき最新の安定版だったのは Nginx 1.8.0 でした。 Nginx の公式ダウンロードページ からダウンロードできます。
wget http : / / nginx .org / download / nginx - 1.8.0.tar.gz
ダウンロードができたら展開しておきます。
tar xvfz nginx - 1.8.0.tar.gz
headers-more-nginx-module のダウンロード
シンプルな Nginx と Passenger で運用すると、 ヘッダに Nginx や Passenger のバージョン、 処理時間などが出力されます。 サーバの内側の情報をできるだけ外に出さないようにするために、 Nginx では headers-more-nginx-module というのを使って対処します。
こちらのモジュールは github から最新のバージョン(tar.gz形式)のURLを取得します。
リリース一覧ページ : Releases · openresty/headers-more-nginx-module
wget https : / / github .com / openresty / headers - more - nginx - module / archive / v0 . 261.tar.gz
ダウンロードができたら展開しておきます。
展開後は、展開前のファイル名をわかりやすいものに変更しておきます。 Tab を使えば、 展開後のディレクトリ名を利用して(ある程度)簡単に入力できます。
mv v0 . 261.tar.gz headers - more - nginx - module - 0.261.tar.gz
コンパイル・インストール
インストールの際には 次のものが必要ですので、 ない場合はあらかじめインストールしておいてください。 なかったとしてもメッセージが表示されますので心配はいりません。
C コンパイラ (/usr/bin/cc)
C++ コンパイラ (/usr/bin/c++)
wget または curl
SSL をサポートしている curl の development header
Openssl development header
Zlib development header
rake, rack, ruby development header, rubygems
Nginx を過去に同じ場所に同じようにインストールしていた場合は、古い nginx 実行ファイル が nginx.old
という名前になります。
スワップ領域
EC2 micro instance などを使っている場合で、 メモリが十分に無い場合(1GB以下の場合)はスワップ領域が必要になります。 root 権限 で次のコマンドを実行します。
sudo dd if = / dev / zero of = / swap bs = 1M count = 1024
chmod 644 / swap
sudo mkswap / swap
sudo swapon / swap
メモリが足りないままインストールを実行した場合でも、インストール中に案内が表示されますので心配はいりませんが。
passenger-install-nginx-module
を実行します。 特にオプションは必要ありません。
passenger - install - nginx - module
ここからインストールが始まります。
まずは 処理の説明が表示され、 Press Enter to continue, or Ctrl-C to abort. と表示されます。 Enter を押して続行します。 途中で止( や ) めたくなったら いつでも Ctrl-C を押せば止められます。
続いて Which languages are you interested in? と表示されるので 必要なものを画面の指示にしたがって選択し、 Enter を押します。
インストールされているソフトウェアのチェックが終わると、Do you want this installer to download, compile and install Nginx for you? と、 インストール方法を聞かれます。 ソースからコンパイルを行うので 2. No: I want to customize my Nginx installation. (for advanced users) を選びます。
また、 私の場合は PCRE というのがインストールされていなかったようで、 途中で自動的にダウンロードされました。
次にソースファイルの場所とオプションの入力が必要になります。 次のように入力しました。
Where is your Nginx source code located?
/usr/local/src/nginx-1.8.0
nginx のソースの場所です。
Where do you want to install Nginx to?
デフォルトのまま何も入力せず Enter を押しました。
nginx のインストール先です。
Extra Nginx configure options
--add-module=/usr/local/src/headers-more-nginx-module-0.261
nginx をコンパイルする際のオプションです。 headers-more-nginx-module を使用するため、 --add-module
オプションを設定しています。 デフォルトで設定されるオプションはコンソール上に表示されます。
最後の意志確認をされますので、 まちがっていなければ Enter を押します。 コンパイルとインストールが実行されます。
nginx の設定
私は /opt/nginx/conf/nginx.conf.default
をコピーして /opt/nginx/conf/nginx.conf
を作って編集しました。 (もっときれいなやり方もあると思いますが。)
Rails を動かすだけなら 次のようにすれば OK です。 抜粋してサンプルを掲載します。 client_max_body_size
はクライアントからの画像アップロードのために設定しています。 (デフォルトでは1Mだそうです。) その他の設定値の意味は Phusion Passenger users guide, Nginx version などに説明がありますのでそちらをご参照ください。
http {
passenger_root / path / to / passenger - x . x . x ;
passenger_ruby / path / to / bin / ruby ;
server {
location / {
index index . html index . htm ;
client_max_body _ size 10M ;
passenger_enabled on ;
root / var / rails / root / public ;
passenger_base_uri / var / rails / root ;
rails_spawn_method smart ;
rails_env development ; # or production
}
}
}
そこにヘッダレスポンス変更のための記述を追加します。
http {
more_clear_headers Server ;
more_clear_headers ETag ;
more_clear _ headers X - Powered - By ;
more_clear _ headers X - Runtime ;
}
設定が間違っていないことを次のコマンドでチェックします。 エラーが表示されなければ OK です。
Nginx の再起動 (または起動)
再起動のときには /opt/nginx/sbin/nginx -s reload
とやることが多いのですが、 今回はそれではうまくいきませんでした。
/opt/nginx/sbin/nginx -s stop
で nginx を止めてから /opt/nginx/sbin/nginx
を実行するとうまくいきました。
初めて起動する場合は /opt/nginx/sbin/nginx
のみ実行すれば OK です。
投稿ナビゲーション
A Life Summary of an Gypsy