Results for tag "heroku"

node.jsが使えるレンタルサーバー比較

Node Hostingから候補のサーバーのベンチマークをとってみた。
候補条件は独自ドメインでSSLが使えるプランである。
ベンチマークは開発中のサイトグルチャを動かしたときのユーザーページの表示速度である。
ベンチマークの結果は以下の通り。

サーバー プラン 料金(月) ベンチマーク
heroku SSL Addon $20=2334円 8秒
evennode 768MB RAM 3 instance €13=1757円 8秒
お名前.com vps メモリ2GBプラン 1315円(税抜),1420円(税込) 測定していないがめちゃ遅かった
AWS EC2 t2.small $13.14=1531円(バージニア1年間前払いなし) 30秒
Microsoft Azure 西日本Basic A0 1428円 30秒
openshift Bronze 3 Small gears 0円 30秒
bluemix 128MB RAM 1 instance 0円 30秒
Cloud Foundry 128MB RAM 1 instance $2.7=314円 1分30秒
NodeNinja 無料 0円 動かず
MODULUS 396MB RAM $14.4=1680円 動くがリロードで404エラー
Pogoapp 256MB RAM $5=583円 使い方分からず

為替レートは以下の通りの本日のレートで計算した。
$1=116.563702円
€1=135.232545円

サーバー コメント
heroku 独自ドメインSSL無しか、herokuサブドメインでSSL有りなら無料で使えるので最高の選択だろう。ただし、SSL Addonを入れると月$20かかってくる。
evennode 独自ドメインSSL有りでherokuより安くなり、速度もherokuと同等である。グルチャevennodeを使っている。
お名前.com vps 計測していないがめちゃ遅かった。30秒はかかっていただろう。あとSSL使う場合、別途初年度24,000円(税抜)かかるようだ。
AWS EC2 t2.smallでも30秒かかるので遅い。これより一段上のプランであるt2.mediumは3年間全前払いでも$16.86=1968円かかるのでevennodeより高くなるのでベンチマーク対象外とした。
Microsoft Azure 30秒かかった。ちなみに西日本StandardA0(1632円)、A1(5508円)、A7(78336円)も試してみたが速度は同じ。また、Microsoft Azure WebsitesのFREEを試してみたが、ブラウザのコンソールにwebsocketsのサーバー確立エラーが表示される。しかし、Azure Website での Socket.IO を使用する Node.js チャット アプリケーションの構築ではwebsocketが使えると書いてあるし、設定でもwebsocketを有効にしているのだが。
openshift 無料でSSLも使えるので非常に魅力的だったが速度が遅い。一段上のプランであるsmall.highcpuは$18.25=2130円かかるのでevennodeより高くなるのでベンチマーク対象外とした。
bluemix IBMが提供するCloud Foundryと同じシステムのPaaSである。Node Hostingには載ってないが、node.js使えるので使ってみたが、30秒かかるので遅い。
Cloud Foundry 最低$2.7は魅力的だが、めちゃ遅い。1GBも試してみたが同じ速度だった。SSLは使えない。ドキュメントにはCLOUD FLARE使いましょうと書いてあった。無料でSSLが使えるらしい。ってか、heroku + CLOUD FLAREで完全無料でSSL使えるんじゃね?
NodeNinja 無料で魅力的だがグルチャが動かなかった。SSLにできるかも不明。
MODULUS 動くには動くが、トップページの読み込みが異常に長いうえにリロードすると404エラーになってしまう。トップページさえ読み込めれば、他のページは速かった。SSLは無料で使える。
Pogoapp $5でSSLが使えるのでかなり魅力的だったが使い方が分からなかった。ドキュメントのページが404エラーになる。デプロイ用のgitもアドインで入れるっぽい。操作が特殊なので使うのを断念。

なお、各サーバーのデプロイ方法は下記のリンク参照。
node.jsをevennodeにデプロイしよう
node.jsをpivotal.ioにデプロイしよう
AWS EC2にnode.jsサーバーを構築しよう
angular-fullstackをherokuにデプロイする方法

他のサーバーのベンチマークをとらなかった理由は下記の通り。

サーバー 理由
appfog SSL有りが月$50するので高い
Baidu App Engine ホームページが中国語で分からない。中国国家の検閲が入って突然使えなくなっても困るし
clever cloud SSLが使えるか明記されていない。最低でも€14.4かかりevennodeより高いのでベンチマーク取らず
cloudnode ベータ版につき無料っぽいが、BaaSっぽい。SSLは使えるらしい。登録しようとしたが、短縮URLが表示されるだけで登録できない
dotCloud SSL付きだと$30.24するので高い。お試し期間もなさそう
exoscale apps リンク先エラー。PaaSは止めたっぽい
nodejitsu 最低でも月$25と高い。お試し期間もなし
JSApp.US Web IDE?ブラウザでコーディングする必要有り。プロプライエタリとして使うにはセキュリティが心配。
NAE(CN) リンク先エラー。どっちにしろ中国だし
RoseHosting 最低でも月$19.95するので高い。2CPUs 1GB RAM 30GB SSDは魅力的だが。SSL使えるかは不明

0

herokuのMEANからCloudinaryに画像をアップロードしよう

前提は下記の通り。
1.yeoman angular-fullstakでMEAN(MongoDB+Express+AngularJS+Node.js)アプリを作成済み
 この方法はYEOMANを使ってMEAN(MongoDB+Express+AngularJS+Node.js)を作成しようを参照すること
2.アプリをherokuにデプロイ済み
 この方法はangular-fullstackをherokuにデプロイする方法を参照すること
 
手順は下記の通り。
 

1.herokuにCloudinaryアドオンを追加

heroku toolbeltから下記コマンドを実行

heroku addons:add cloudinary --app foo

※fooはherokuのアプリ名
 

2.Gruntfile.jsに環境変数CLOUDINARY_URLを設定

herokuのConfig variablesを参照して環境変数CLOUDINARY_URLをGruntfile.jsに設定する。
下記はGruntfile.jsの例。

module.exports = function (grunt) {
  var localConfig;
  try {
    localConfig = //require('./server/config/local.env');
      {
        DOMAIN: 'http://localhost:9000',
        SESSION_SECRET: "foo-secret",

        FACEBOOK_ID: 'app-id',
        FACEBOOK_SECRET: 'secret',

        TWITTER_ID: 'app-id',
        TWITTER_SECRET: 'secret',

        GOOGLE_ID: 'app-id',
        GOOGLE_SECRET: 'secret',

        CLOUDINARY_URL: 'cloudinary://999999999999999:XXXXXXXXXXXXXXXXXXXXXXXXXXXX@xxxxxxxxx',

        // Control debug level for modules using visionmedia/debug
        DEBUG: ''
      };
  } catch(e) {
    localConfig = {};
  }

※本来環境変数は./server/config/local.env.jsに設定すれば良いはずだが、なぜかgruntが読み込んでくれないのでGruntfile.jsに直接記入している。
 

3.npmでcloudinaryをインストール

端末から下記コマンドを実行

npm install cloudinary --save

 

4.bowerでangular-file-uploadをインストール

参考文献:angular-file-upload#Yeoman with bower automatic include
端末から下記コマンドを実行

bower install ng-file-upload --save
bower install ng-file-upload-shim --save

 

5.npmでconnect-multipartyをインストール

参考文献:How to get uploaded file in Node.js Express app using angular-file-upload
connect-multipartyをインストールする。
端末から下記コマンドを実行

npm install connect-multiparty --save

 

6.bower.jsonのangular-file-uploadの読み込み順序を変更

参考文献:angular-file-upload#install
bower.jsonの依存順序を下記通りにする。
bower.jsonの依存順序を変更することでgrunt serve時にclient/index.htmlのbower管理のjavascript読み込み順序も変更される。

{
  "dependencies": {
    "ng-file-upload-shim": "~1.6.12",
    "angular": ">=1.2.*",
    "ng-file-upload": "~1.6.12"
  }
}

 

7.client側ソースコード追加

参考文献:angular-file-upload#usage
client側ソースコードを追加する。
サンプルとほぼ同じだがソースコード例を示す。
HTML例

<div ng-controller="MyCtrl">
  <input type="file" ng-file-select="onFileSelect($files)">
</div>

※scriptの読み込みはclient/index.htmlで行われる。
 
app.js

angular.module('myApp', [
  'ngCookies',
  'ngResource',
  'ngSanitize',
  'btford.socket-io',
  'ui.router',
  'ui.bootstrap',
  'pascalprecht.translate',
  'angularFileUpload'  //追加
])

 
javascript例

angular.module('myApp')
  .controller('MyCtrl', function($scope, $upload) {
    $scope.onFileSelect = function($files) {
      for (var i = 0; i < $files.length; i++) {
        var file = $files[i];
        $scope.upload = $upload.upload({
          url: 'api/myapi', // server側API例
          file: file
        }).progress(function(evt) {
          console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
        }).success(function(data, status, headers, config) {
          console.log(data);
        });
      }
    };
  });

 

8.server側ソースコード追加

参考文献:
angular-file-upload node.js example
How to get uploaded file in Node.js Express app using angular-file-upload
Cloudinary using with node.js
server側ソースコードを追加する。
yo angular-fullstack:endpointでserverにmyapiという名前のAPIを追加した場合の例を示す。
ファイル:server/api/myapi/index.js

'use strict';

var express = require('express');
var controller = require('./myapi.controller');

var router = express.Router();

var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();

router.post('/', multipartMiddleware, controller.create);

module.exports = router;

 
ファイル:server/api/myapi/myapi.controller.js

'use strict';

var fs = require('fs');
var cloudinary = require('cloudinary');

exports.create = function(req, res) {
  if(req.files.file) {
    var stream = cloudinary.uploader.upload_stream(function(result) {
      return res.send(200);
    });
    fs.createReadStream(req.files.file.path).pipe(stream);
  } else {
    return res.send(400);
  }
};

 
以上で完成。
clientで画像が選択されるたびにserver経由でcloudinaryに画像ファイルがアップロードされる。
 


3

angular-fullstackをherokuにデプロイする方法

angular-fullstack公式のherokuの項に書いてあるが、動作しなかったので動作する方法を説明する。
 
前提としている環境は下記の通り。
OS: ubuntu 14.04
node.js v6.3.1
angular-fullstack 3.7.6
 

gitをインストール

herokuにデプロイするのにgitを使うのでインストールする。
下記URL参照
Ubuntu 14.04 で Git の最新を使う
 

heroku toolbeltをインストール

下記URL参照
Heroku Command Line
 

herokuにMongoLabをアドオンする

参考文献:mLab MongoDB
下記コマンドを実行する(公式と同じ手順)

heroku addons:create mongolab --app foo

※fooはherokuのアプリ名を指定する
※アドオンを登録するにはherokuのアカウントに事前にクレジットカードを登録しておく必要がある。登録していないとエラーになる。
 

oAuthのキーを設定する

twitter, facebook, google+のoAuthを使う場合、下記コマンドを実行する(公式と同じ手順)

heroku config:set FACEBOOK_ID=id --app foo
heroku config:set FACEBOOK_SECRET=secret --app foo

※twitter, goolge+についても同様の手順で設定する
 

デプロイする

参考文献:Deploy to heroku is not working using yo angular-fullstack:heroku #1966
※ アプリ名がfooの場合

mkdir dist
cd dist
git init
heroku login (if you are not already authenticated)
heroku git:remote --app foo
cd ..
grunt build
grunt buildcontrol:heroku

typescriptを使っている場合の注意点

参考文献:
issue with postinstall script #74
fix(build): remove need for installing typings from the internet
typescriptを使っている場合、「grunt buildcontrol:heroku」で失敗する。
これは、dist/package.jsonに書かれている「”postinstall”: “./node_modules/.bin/typings install”」が不要なためのようだ。
おそらくdist/package.jsonはカレントのpackage.jsonをコピーしただけなので、カレントでは必要な「typings install」だが、デプロイでは不要のなのにコピーしてしまっているためと思われる。
よって、「grunt build」した後、dist/package.jsonに書かれている「”postinstall”: “./node_modules/.bin/typings install”」を削除してから「grunt buildcontrol:heroku」をすること。
※ 毎回「grunt build」でdist/package.jsonが生成されるので、面倒だが手作業で削除するのが必要があるようだ。

なお、上記手順でデプロイしたアプリは下記URLにある。
http://angularfullstack.herokuapp.com/
 


1

herokuでwebsocketsを有効にしよう

herokuはデフォルトではwebsocketsが無効になっているらしい。
どおりで、MMORPG風チャットが遅かったわけだ。
websocketsの有効にするやり方は公式ヘルプHeroku Labs: WebSocketsに書いてあるが、ここにも書いておく。

heroku CLIでログインした状態で以下のコマンドを打つ。

heroku labs:enable websockets -a myapp

※ myappは有効にしたいアプリ名を指定する。
以下のメッセージが出れば成功だ。

Enabling websockets for myapp... done
WARNING: This feature is experimental and may change or be removed without notice.

0

heroku CLIの使い方

忘れがちなのでメモ。

公式ヘルプheroku CLIに書いてあるけど、こちらでもあらためて説明しておく。

Windowsで使う場合を説明する。

説明

まずはtoolbeltをダウンロードしてインストールする。
次にコマンドプロンプトを開く。(管理者権限なしで良い)
カレントをtoolbeltがインストールされたフォルダ(デフォルトでは”C:\Program Files (x86)\Heroku\bin”)に移動させる。

cd C:\Program Files (x86)\Heroku\bin

以下のコマンドを打ってログイン

heroku login

ログイン時にE-mailとパスワードを聞かれるので打ち込む。
“Authentication successful.”と表示されればログイン成功だ。
普通のコマンドプロンプトに戻るが、herokuのコマンドが打てるようになっている。


0

node.jsとsocket.ioとenchant.jsで作ったMMORPG風チャットをheruokuと9leapにデプロイしよう


node+socket.io+enchant.jsでチャットゲーを作る9leapで動くように修正してみた。
 
ソースコードはgithubにあげている
https://github.com/SimtterCom/enchat-9leap-client
 
サーバー側ソースコードもgithubにあげている。
https://github.com/SimtterCom/enchat-9leap
 
サーバーはherokuにデプロイしている。
http://enchat-9leap.herokuapp.com/
 
なお、ベースとなるソースコードは有限会社ジーワークス 佐藤潔 氏によって作成されました。


0

node.jsのsocket.ioでIRCリレーサーバーを作ってherokuにデプロイしてみた

IRC Client
http://irc-client.herokuapp.com/
これはあくまでリレーサーバーであってIRCサーバーそのものではない。
図で説明するとこんな感じ。
irc.00.01
要はウェブブラウザから直接IRCサーバーには繋がらないので、両者を仲介するサーバーを作ったのだ。
 
ちなみにソースコードはgithubに置いた。
https://github.com/SimtterCom/irc-client
ソースコードのうち、リレーサーバーとIRCサーバーを繋ぐソースコード(irc.js)はKaedeさんのソースコードを使用したので、Kaedeさん作者への謝意とともにirc.jsの著作権はKaedeさん作者にあることを明記する
Node.jsで動くIRCBot、kaedeさんを作った
 
さらにちなみに開発はCloud9で開発した。
クラウドサービス使いまくって全部無料。
凄い時代だ。
 
では、IRC Clientの使い方を説明する。

画面説明

まずは、画面説明をする。
http://irc-client.herokuapp.com/にアクセスしたら下図の画面になる。
irc.01.01
 

テキスト入力欄

Host:アクセスするIRCサーバー名を指定する(デフォルトではWordPressのチャンネルがあるサーバーを設定している)
Port:IRCサーバーのポート番号(6667か6669)
User Nane:実際あまり使われることないが必要(実質どんな名前でも良い。スペースは使えない)
Real Name:これも使われることが無いが必要(スペースも使える)
Nick Name:IRCサーバーに繋がってるユーザー全てにユニークな名前でないといけない。チャットで表示されるのもこの名前
Channel Name:入りたいチャンネル名を指定する。指定したチャンネルが無い場合は自動で作られる。(デフォルトではWordPressの公式チャンネルを指定している)
Message:自分が発言したい内容を書き込む。
 

ボタン

Login:IRCサーバーにログインする。(ログインした後はボタンがLogoutに変更になる)
Logout:ログインしているIRCサーバーからログアウトする。
Join:チャンネルに参加する。(参加した後はボタンがPartに変更になる)
Part:参加しているチャンネルから離脱する。
Send:発言する。(Messageが空白だとボタンが無効になっている。Messageに何か文字を入れると有効になる)
 

表示

Channel Users:チャンネルに入っているユーザー一覧
Name:発言した人のNick Name
Message:発言内容
 

チュートリアル

次にチュートリアルを説明する。

IRCにログインする

irc.02.01
loginボタンを押してログインする
 
irc.02.02
Please Wait…ダイアログが表示されるのでしばらく待つ
 
irc.02.03
Successが表示されればログイン成功。
OKボタンを押す。
 
irc.02.11
Failedが表示されればログイン失敗。
Nicknameがすでに使われているので、違うNicknameに変更して再度Loginボタンを押す。
 

チャンネルに参加する

ログインが成功すれば次はチャンネルに参加する。
irc.02.04
Channel Nameに参加したいチャンネル名(デフォルトではWordpressの公式チャンネルになっている)を入力してJoinボタンを押す。
 
irc.02.05
Channel UsersとMessageに自分がジョインしたメッセージが表示されればジョイン成功。
 

発言する

次は実際発言してみよう。
irc.02.06
Messageに発言内容(この例ではHello!)を入力してSendボタンを押す。
 
irc.02.07
Nameに自分のニックネーム、Messageに発言内容が表示されれば発言成功。
 

チャンネルから離脱する

チャンネルからの離脱方法を説明する。
irc.02.08
Partボタンを押す。

IRCからログアウトする

IRCからのログアウト方法を説明する。
irc.02.09
チャンネルから離脱した状態でLogoutボタンを押す。
 
irc.02.10
ログイン前の状態に戻ればログアウト成功。


0