まだプログラマーですが何か?

プログラマーネタとアスリートネタ中心。たまに作成したウェブサービス関連の話も http://twitter.com/dotnsf

Node.js + Express の環境で SSL を使う(https でアクセスできるようにする)方法を調べたのでまとめました。


まず SSL を使うための鍵ファイルと証明書ファイルを用意します。公式なドメインを所有していて、本物の鍵/証明書ファイルを持っているのであればそれを使っても構いません。試験的に試すのであれば、いわゆる「オレオレ証明書」を作成します。Linux 環境であれば openssl コマンドを使って、以下のように入力します:
$ openssl genrsa -out server_key.pem 2048
Generating RSA private key, 2048 bit long modulus
...............+++
..........................+++
e is 65537 (0x10001)

$ openssl req -batch -new -key server_key.pem -out server_csr.pem -subj "/C=JP/ST=Chiba/L=Funabashi/O=Jugeme/OU=Dev/CN=juge.me"

$ openssl x509 -in server_csr.pem -out server_crt.pem -req -signkey server_key.pem -days 73000 -sha256
Signature ok
subject=/C=JP/ST=Chiba/L=Funabashi/O=Jugeme/OU=Dev/CN=juge.me
Getting Private key

$

↑この例では juge.me というホスト名で運用する前提での、サーバーの鍵ファイル(server_key.pem)と証明書ファイル(server_crt.pem)を作成しています。

この2つのファイルと同じディレクトリに app.js というファイル名で、Node.js のソースコードを以下の内容で作成しました。アプリケーションそのものはドキュメントルート(/)にアクセスがあった場合に「ハローワールド」と表示するだけの単純なものです:
//. app.js

var express = require( 'express' ),
    http = require( 'http' ),
    https = require( 'https' ),
    cfenv = require( 'cfenv' ),
    fs = require( 'fs' ),
    app = express();
var appEnv = cfenv.getAppEnv();

//. 鍵ファイルと証明書ファイル var options = { key: fs.readFileSync( './server_key.pem' ), cert: fs.readFileSync( './server_crt.pem' ) };
//. 鍵ファイルと証明書ファイルを指定して、https で待受け var server = https.createServer( options, app ).listen( appEnv.port, function(){ console.log( "server stating on " + appEnv.port + " ..." ); });
//. ドキュメントルートにリクエストがあった場合の処理 app.get( '/', function( req, res ){ res.write( 'ハローワールド' ); res.end(); });

このコードを実行すると待受ポート番号が動的に決定して表示されます(↓の例だと 6015 番ポートで https が待ち受けていることが分かります):
$ node app.js
server stating on 6015 ...

ではウェブブラウザで実際にアクセスしてみます。本当に使っている本物のドメイン/ホスト名であればそのままアクセスできると思いますが、試験的に実行している場合はこのホストに "juge.me" という名前でアクセスできる必要があります。必要に応じて hosts ファイルを編集するなどして、目的のホスト(node app.js を実行したホスト)に "juge.me" というホスト名でアクセスできるような準備をしておいてください。

そしてウェブブラウザで "https://juge.me:(ポート番号)" にアクセスします:
2017041301


オレオレ証明書名物「安全な接続ではない」という警告画面になると思います。ここからの手順はウェブブラウザの種類にもよりますが、FireFox の場合であれば「エラー内容」ボタンをクリックしてから「例外を追加」をクリックして、このサイトの警告を無視するための設定を行います。

そして「セキュリティ例外の追加」ダイアログにて、この URL の「セキュリティ例外を承認」します:
2017041302


すると警告が消えて、プログラムで用意したコードが実行され、「ハローワールド」というメッセージが表示されることが確認できます:
2017041303


IBM Bluemix のような PaaS 環境だと、このあたりも含めてアプリケーションサーバー環境が用意されるので楽ですが、素で Node.js 環境を構築する場合はアプリケーション側でも https 対応を実装する必要があり、意外と面倒ね。

超有名なコンテンツ管理システムであるワードプレスは数多くのプラグインも提供されており、プラグインを組み合わせるだけで色々な目的のサイトが構築できてしまいます。

ふとした事情でクラウドファンディング的なサイトを試験的に用意する必要が生じたのですが、「ワードプレスだけでサクッとクラウドファンディングサイトが作れたりしないだろうか?」と思い立って調べてみました。結論としては「色々あるけど、とりあえずクラウドファンディングが作れるプラグインは見つけた」ので、調べて構築した内容を以下に紹介します。


まず、クラウドファンディング用のワードプレスプラグインは有料/無料あわせて数多く存在しています。その中で以下に紹介するのは IgnitionDeck という団体(?)から提供されている IDCF(IgnitionDeck CrowdFunding) (及び IDCF 対応のテーマ)です:
2017040812



IDCF をワードプレスに導入するにはワードプレス管理画面のプラグイン導入から "IgnitionDeck" を検索し、"IgnitionDeck Crowdfunding & Commerce" を見つけて「今すぐインストール」します:
2017040801


他のプラグイン同様に、インストール後「有効化」をクリックすると、このプラグインが有効になります:
2017040802


IDCF プラグインを有効にしても、この段階では IgnitionDeck 未登録のためまだ使えません。管理画面に "IgnitionDeck" というメニューが追加されているので、メニューから IDCF を選び、 "Activate Now" ボタンをクリックして登録画面に遷移します:
2017040803


登録といっても名前、メールアドレス、そしてパスワードを入力するだけです。簡単:
2017040804


登録が完了すると次に行うべき手順が紹介された画面が表示されます。↓下図の3ステップです:
2017040805


1ステップ目、(ここまでの作業でいつの間にか導入されていた)"500 Framework" テーマを有効にします:
2017040806


2ステップ目、IDCF の設定を行います(そのまま Save でも可):
2017040807


そして3ステップ目、というかクラウドファンディングサイトとしてのスタート地点です。クラウドファンディングのプロジェクトが開始できるようになったので、何か1つ追加してみます:
2017040808


プロジェクトを保存すると、ワードプレスのトップ画面のプロジェクト一覧から確認できるようになります:
2017040802


プロジェクトを選択して開くと、クラウドファンディングの説明や目標額が確認でき、支援表明もできるようになっていることが確認できます:
2017040803


IDCF には有料のオプションもあり、サポートや追加で使えるツールキットが用意されているようです。が、まだあまり調べていません。こちらは気が向いたらということで。。


軽く使ってみた限りでの感想ですが、管理画面が英語なのはともかくとして、目標額などを入力すると自動的に米ドル扱いになってしまうことに気付きました(要は金額のデータとして "100" と入力すると、自動的に「100 米ドル」扱いになってしまう)。これをカスタマイズするには IDC メニューの CURRENCY SETTINGS から "JPY" を選択して更新しておくことで変更できました:
2017040801


もう一点、ファンディングの支援レベル(例えばレベル1はステッカーのみ、レベル2は商品そのもの1つ、レベル3は商品を10個まとめて、・・・みたいなもの)を複数追加しようとしたのですが、うまくできませんでした。ググってみると、同じ現象で悩んでるっぽい人向けの FAQ っぽいページを見つけたのですが「会員専用ページです」みたいなメッセージから先に進めず、未だに原因やワークアラウンドが分かっていません。会員としてログインしてるはずなんだけどな・・・ もしかすると、ここが無料版の制限なのかもしれません:
2017040801


もう一点。実際にユーザーがこのプロジェクトを支援しようと "Support Now" して、"Next Step" に進もうとすると、、:
2017040901


こんな画面に推移します:
2017040902


ここで何らかの入力フォーム(project_purchase_form ?)が出て来る想定なんだろうけど、ここをどうすると表示できるようになるのか? カスタマイズするにはどうするのか? といった情報を探していたのですが、どうやらここから先は無料版では提供されていない機能のようでした:
Ignitiondeck does not redirect me to Purchase Page


というわけで、まだ IDCF のフル機能を試せたわけではないのですが、ここまでは超簡単に作れてしまったことも事実。便利なプラグインをまた1つ発見してしまった。。


以前に紹介した SaaS 型のデータ解析サービス IBM Watson Analytics は強力な解析エンジンが安価で使えて、面白いサービスだと思っています:
2017040501



ただちょっと不便に感じたのは、データのインポート方法でした。手元に CSV などのファイルがあれば Watson Analytics 側に用意された機能でインポートできます。またデータが Box や Twitter などのクラウドに公開されたものであれば、やはり Watson Analytics に用意された機能で取り込むことができました:
2017040502


しかし現実的にはデータベースサーバーから直接取り込むことができると便利です。更に言うと、インターネットに公開されたデータベースサーバーではなく、プライベートネットワーク内にあるデータベースのデータを簡単に取り込むことができると、プライベートデータを(いちいち CSV にしてから手動インポートする必要がなくなって)便利なのですが、現在 Watson Analytics 単体にそこまでの機能は提供されていません。


しかし、単体では提供されていなくても、IBM Bluemix から提供されるいくつかの機能を組み合わせることで上記の要件は可能になります。具体的には Secure Gateway サービスと Data Connect サービスを使います。Secure Gateway でプライベートネットワークのデータベースに対してセキュアなトンネリングを貼った上で Data Connect を使い、そのプライベートデータベースと Watson Analytics との間での自動データマイグレーションが実現できます(そのマイグレーションを定期的に実行するようなスケジューリングまで含めて可能になります)。






以下に実際の手順を紹介しますが、実際にこの手順を行うにはプライベートネットワーク内のデータベースに加えて、IBM Bluemix および IBM Watson Analytics 両方のアカウントが必要です。そして IBM Bluemix では Secure Gateway と Data Connect の2つのサービスインスタンスが有効になっている必要があります。無料版にサインアップするなどして、あらかじめご用意ください。


まずプライベートネットワーク内のデータを確認しておきます。今回対象とするのはプライベートネットワーク内のデータベースサーバーで管理されている(仮想の)人事情報とします。名前(name)や年齢(age)、収入レベル(income)、容姿(looking)、血液型(blood_type)、出身地(prefecture)といった情報が格納されているものです(注 乱数で生成した偽データです)。これは認証は当然ですが、現時点ではプライベートネットワーク内からのアクセスしか許可していないものです。目的はこれらのデータを(一度 CSV ファイルにして取り出して手動アップロードしたりするのではなく)Watson Analytics で解析可能なデータとしてシステマチックにインポートすることとします:
2017040513


では実際の手順を紹介します。まずは Secure Gateway でこのプライベートネットワーク内のデータベースを IBM Bluemix 環境からアクセスできるようにします。その手順はこちらを参照してください。
SecureGateway で Bluemix とプライベートネットワークをセキュアに接続する


次に Secure Gateway で参照できるようになったプライベートデータを Data Connect のデータセットとして定義します。この手順についてはこちらを参照してください。
Data Connect サービスでデータベースをマイグレーションする


ここまで完了したら、次は Data Connect の接続先として利用できるよう、Watson Analytics を追加します。Data Connect サービスのダッシュボード画面左メニューから "Connections" を選択し、画面右上の "Create New" をクリックします:
2017040501


接続先のデータベースタイプの選択画面では "IBM Watson Analytics" を選択します:
2017040502


詳細設定画面に移動しますが、ここで設定する項目は接続名称を入力するだけです。最後に画面右上の "Create Connection" をクリックします:
2017040503


この接続情報が保存される際に IBM Watson Analytics への認証が行われます。IBM Watson Analytics を利用している IBM ID とパスワードを指定してログインしてください:
2017040504


正しく有効な ID が確認されると、Data Connect の接続情報として IBM Watson Analytics が追加されます:
2017040505


では作成した Watson Analytics にプライベートデータベースからデータをマイグレーションします。引き続き Data Connect ダッシュボードの画面左メニューから "Activities" を選び、右上の "Create New" をクリックします:
2017040506


まずマイグレーション元を指定します。あらかじめ作成してある Secure Gateway 経由の(プライベートデータベースの)データセットを選択します。選択したら画面右上の "Copy to Target" をクリックします:
2017040507


次にマイグレーション先を指定します。今回のマイグレーション先は IBM Watson Analytics なので、Connections から上記で定義した IBM Watson Analytics の接続名を選択します。このままマイグレーション実行スケジュールの指定("Schedule Activity")も可能ですが、まず1回手動で実行してみることにします。画面右上の並んだボタンから "Run" をクリックします:
2017040508


指定したとおりの(プライベートデータベースから Watson Analytics への)マイグレーション処理が実行され、アクティビティとして記録されます。なお、このアイコンから実行スケジュール(定期実行など)を編集することも可能です:
2017040509


実際にマイグレーションが行われたかどうかを確認してみます。改めて IBM Watson Analytics にログインすると、元々は存在していなかったデータセットが作られているはずです。これをクリックして、実際に解析してみます:
2017040510


解析テンプレートが表示されます。いくつかありますが、"What is the trend of looking over age by blood_type?"(血液型別に年齢と容姿にどういったトレンドがあるか?)が面白そう(笑)なので選択してみます:
2017040511


この解析用の画面に移動します。画面左側に年齢ごとの容姿の推移が血液型ごとの折れ線になって表示されます。また画面右にはこれらの分析からの発見として、「43歳の収入が一番高い」とか「年収をトータルすると AB 型が一番低い」といったインサイトも併せて表示されています(※繰り返しますが、乱数を使って生成した偽データです):
2017040503


特別何もしなくてもデータを与えるだけでここまで分析してくれる Watson Analytics もすごいのですが、その Watson Analytics に直接プライベートデータや社内データをセキュアにマイグレートしてくれる Secure Gateway や Data Connect と併せて利用することで、より便利に大事な情報を簡単に解析できるようになると感じます。


このページのトップヘ