ホームページ  >  記事  >  ウェブフロントエンド  >  Nodejsチュートリアル環境のインストールとoperation_node.js

Nodejsチュートリアル環境のインストールとoperation_node.js

WBOY
WBOYオリジナル
2016-05-16 16:30:451532ブラウズ

nodeJS を実行させます

最初のステップは、もちろん、nodeJS 環境をインストールすることです。今では、nodeJS を Windows に直接ダウンロードする方が速いです。

http://www.nodejs.org/download/

必要に応じてここからダウンロードしてください。ダウンロードが完了したら、次のステップに進みます。

2 番目のステップでは、その後の操作を容易にするために、D ドライブにフォルダー ブログを直接作成しました

次に、Windows コマンド ライン ツールを開き、d ドライブに入り、次のように入力します。

コードをコピー コードは次のとおりです:
express -e blog

内部に依存パッケージが存在する可能性がありますので、インストールするにはブログ ディレクトリを入力する必要があります (インストール構成は package.json によって提供されます)。

コードをコピー コードは次のとおりです:
npm install
このようにして、依存関係パッケージがダウンロードされました。依存関係パッケージ、Java パッケージ ファイル、および .net bll ファイルは同じ概念である必要があります。

現時点で、プログラムを実行する準備ができています:

コードをコピー コードは次のとおりです:
ノード アプリ

コードをコピー コードは次のとおりです:
D:blog>node appExpress サーバーがポート 3000 でリッスン
この時点でブラウザを開くと、次のような反応が起こります:

ここでは、Express (人気のある NodeJS Web 開発フレームワーク) と ejs テンプレート エンジンを使用しています

ファイル構造

初期化ファイルのディレクトリ構造は次のとおりです:

app.js はエントリ ファイルです

package.json はモジュールの依存関係ファイルです。npm install を使用すると、その構成に基づいて関連するパッケージがインターネットからダウンロードされます。

node_modules はダウンロードされたモジュール ファイル (package.json) です

パブリックストア静的リソースファイル

routes にはルーティング ファイルが保存されます

ビューには、関連するビュー テンプレート ファイルが保存されます

このようにして、基本的なディレクトリ構造が明らかになります。node_modules ディレクトリについて簡単に説明します。

node_modules/ejs

先ほども述べたように、ダウンロードしたモジュールはここに保存されます。簡単に言うと、これは js ファイルの集合です。

コードをコピー コードは次のとおりです:

var parse = exports.parse = function(str, options){
  var オプション = オプション || {}
    、オープン = options.open ||エクスポート.オープン || '     、閉じる = options.close ||エクスポート.閉じる || '%>'
    、ファイル名 = オプション.ファイル名
    、compileDebug = options.compileDebug !== false
    、 buf = "";

buf = 'var buf = [];';
  if (false !== options._with) buf = 'nwith (locals || {}) { (function(){ ';
  buf = 'n buf.push('';

var lineno = 1;

varconsumEOL = false;
  for (var i = 0, len = str.length; i
    var stri = str[i];
    if (str.slice(i, open.length i) == open) {
      i = open.length
 
      var prefix、postfix、line = (compileDebug ? '__stack.lineno=' : '') lineno;
      switch (str[i]) {
        case '=':
          prefix = "',escape((" line ', ';
          postfix = ")), '";
          私;
          休憩;
        ケース '-':
          prefix = "', (" line ', ';
          postfix = "), '";
          私;
          休憩;
        デフォルト:
          プレフィックス = "');" 行 ';';
          postfix = "; buf.push('";
      }

var end = str.indexOf(close, i)
        、js = str.substring(i, end)
        、開始 = i
        、インクルード = null
        、n = 0;

if ('-' == js[js.length-1]){
        js = js.substring(0, js.length - 2);
        ConsumerEOL = true;
      }

if (0 == js.trim().indexOf('include')) {
        変数名 = js.trim().slice(7).trim();
        if (!filename) throw new Error('インクルードにはファイル名オプションが必要です');
        var path =solveInclude(name, filename);
        include = read(path, 'utf8');
        include =exports.parse(include, { filename: path, _with: false, open: open, close: close,compileDebug:compileDebug });
        buf = "' (function(){" include "})() '";
        js = '';
      }

while (~(n = js.indexOf("n", n))) n , lineno ;
      if (js.substr(0, 1) == ':') js = filtered(js);
      if (js) {
        if (js.lastIndexOf('//') > js.lastIndexOf('n')) js = 'n';
        buf = プレフィックス;
        buf = js;
        buf = 後置;
      }
      i = 終了 - 開始 close.length - 1;

} else if (stri == "\") {
buf = "\\";
} else if (str == "'") {
buf = "\'";
} else if (str == "r") {
// 無視します
} else if (str == "n") {
If (消費EOL) {
consumEOL = false;
} else {
buf = "\n";
lineno ;
}
} else {
buf = stri;
}
}

if (false !== options._with) buf = "'); })();n} nreturn buf.join('');";
else buf = "');nreturn buf.join('');";
戻りバフ;
};

たとえば、ここでは ejs テンプレートと Express モジュールを使用しましたが、その違いを確認するために興味深く ejs プログラムに入りました

ejs.js を開いたら、いくつかのコードを見てみましょう。このコードは、テンプレートを文字列に解析するアンダースコアのテンプレート エンジン コードと同じ考え方を持っています。

その後、eval メソッドまたは new Function メソッドを通じてそれを関数に変換し、分析を容易にするために独自のデータ オブジェクトを渡します

具体的なワークフローについては、まだわかりません。後で勉強するだけです。

app.js

エントリ ファイルとして、app.js は重要な役割を果たします。

コードをコピーします コードは次のとおりです:
/**
 * モジュールの依存関係。
 */
var Express = require('express');

var Routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');

var app =express();

// すべての環境

app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('ビューエンジン', 'ejs');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.json());
app.use(express.urlencoded());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// 開発のみ

if ('開発' == app.get('env')) {
app.use(express.errorHandler());
}

app.get('/', Routes.index);

app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), function(){

console.log('Express サーバーがポートでリッスンしています ' app.get('port'));
});

require() コマンドを通じて Express モジュールと http モジュールをロードし、インデックス ユーザーなどのテンプレート ファイルをルート ディレクトリにロードします

app.set('port', process.env.PORT || 3000) は起動時にポートを設定します

app.set('views', __dirname '/views') は、テンプレート ファイルを保存するパスを設定します。__dirname は、現在のスクリプトが配置されているディレクトリを保存するグローバル変数です。このように:

コードをコピーします コードは次のとおりです:
console.log(__dirname);//次のコードをindex.js
に追加します /**
D:ブログ>ノードアプリ
エクスプレスサーバーli
D:ブログルート
*/


この __dirname がどのように取得されたかについては、当面は注意する必要はありません

app.set('view Engine', 'ejs') はテンプレート エンジンを ejs に設定します

app.use(express.favicon()) はアイコンを設定するためのもので、変更したい場合は、public

の下にある画像ファイルに移動するだけです。

app.use(express.logger('dev')); Express は接続に依存しているため、組み込みミドルウェアがログを出力します

app.use(express.json()); はリクエストの本文を解析するために使用され、文字列は動的に json オブジェクトに変換されます

app.use(express.methodOverride()); connect にはポストリクエストを処理するための組み込みミドルウェアがあり、put

などの http メソッドを偽装できます。

app.use(app.router); 呼び出しルーターの解析ルール

app.use(express.static(path.join(__dirname, 'public'))); 組み込みミドルウェアを接続し、静的ファイルを保存するためにルート ディレクトリに public を設定します

コードをコピーします コードは次のとおりです:
if ('開発' == app.get('env')) {
app.use(express.errorHandler());
}


この文は、開発中にエラーメッセージが出力されるべきであることを意味します

コードをコピーします コードは次のとおりです:

app.get('/', Routes.index);
app.get('/users', user.list);

この2文はアクセス時の具体的な処理ファイルです。例えばここに直接アクセスする場合、デフォルトのアクセスはroutes.index

です。

次に、テンプレート データが実際に内部で解析されます。

コードをコピーします コードは次のとおりです:

exports.index = 関数 (req, res) {
console.log(__dirname);
res.render('index', { title: 'Express' });
};

最後に、上記のコードを呼び出して http サーバーを作成し、ポート 3000 をリッスンします。成功すると、Web ページからアクセスできるようになります

ルーティング

以前にルーティングを構築するためにこの方法を使用しました

コードをコピー コードは次のとおりです:
app.get('/', Routes.index) ;

上記のコードは、このコード (アプリ内で記述) に置き換えることができます

コードをコピーします コードは次のとおりです:

app.get('/', function (req, res) {
res.render('index', { title: 'Express' });
});

このコードは、ホームページにアクセスすると、ejs テンプレート エンジンが呼び出されて、index.ejs テンプレート ファイルをレンダリングすることを意味します

ここで、いくつかの変更を加えます。上記のコードはルーティング機能を実装していますが、ルートが多すぎるとアプリが肥大化するため、関連する設定をインデックスに追加します。

そのため、アプリ内の関連するルーティング関数を削除し、アプリの最後にコードを追加します。

コードをコピー コードは次のとおりです:
routes(app);

次に、index.js を変更します

コードをコピーします コードは次のとおりです:

module.exports = function(app) {
app.get('/', function (req, res) {
res.render('index', { title: 'Express' });
});
};

このコードがどのように構成されているかはまだ明らかではないので、後で見ていきます。

ルーティング ルール

Express はさまざまな http リクエストをカプセル化します。通常は get/post の 2 種類を使用します

コードをコピーします コードは次のとおりです:

app.get();
app.post();

最初のパラメータはリクエスト パス、2 番目のパラメータはコールバック関数、または 2 つのパラメータはリクエストとレスポンスです

次に、req(リクエスト)には次のようなルールがあります

req.query は取得リクエストを処理し、取得リクエストのパラメータを取得します

req.params は、/:xxx

の形式で取得リクエストまたは投稿リクエストを処理します。

req.body は投稿リクエストを処理し、投稿リクエストの本文を取得します

req.params は get リクエストと post リクエストを処理しますが、検索の優先順位は req.params->req.body->req.query

パスルールは正規表現もサポートしています。詳細については後ほど説明します...

ルーティング ルールを追加します

存在しないリンクにアクセスした場合:

/y にはルーティング ルールがなく、公開されているファイルについては言及されていないため、404

ここで、index.js に関連するルートを追加します。

コードをコピーします コードは次のとおりです:

module.exports = 関数 (アプリ) {
app.get('/', function (req, res) {
res.render('index', { title: 'Express' });
});
app.get('/y', function (req, res) {
Res.send('イェシャオチャイ');
});
};

ここで私のページが文字化けしています:

その理由は、ダウンロード後にファイルが utf-8 に変更されるだけなので、次のセクションに進みます。

登録機能

ここではオリジナルのブロガーに従って簡単な登録機能を作成します。ここではデータベースとして mongo db を使用し、後で順次機能を改善していきます。

新しい登録ルートを作成し、そのための新しい登録テンプレートを作成します。それでは始めてみましょう

①インデックスに新規ルートを作成

コードをコピーします コードは次のとおりです:
app.get('/register', function (req, res) {
res.render('index', { title: '登録ページ' });
});

コードをコピーします コードは次のとおりです:
module.exports = 関数 (アプリ) {
app.get('/', function (req, res) {
res.render('index', { title: 'Express' });
});
app.get('/y', function (req, res) {

Res.send('イェシャオチャイ');
});

app.get('/register', function (req, res) {

res.render('登録', { title: '登録ページ' });

});



コードをコピーします コードは次のとおりです:


<頭>
<%= title %>



<%= タイトル %>


<フォームメソッド="投稿">
ユーザー名:

パスワード:

                                                                                                                                




このようにして、私たちのページは次のように形成されます:

基本プログラムが利用可能になりました。データベースのサポートが必要になったので、mongoDB 環境をインストールする必要があります

MongoDB

MongoDB は、分散ファイル ストレージに基づく NoSQL の一種で、C で書かれています。MongoDB がサポートするデータ構造は、json と同様に緩いので、json はあらゆる型をサポートできるため、非常に複雑な構造を作成できることがわかっています。

コードをコピーします コードは次のとおりです:
{
ID: 1、
名前: 'イェ・シャオチャイ'、
友達: [
{ id: 2, name: '蘇桓振' },
{ id: 3, name: '1 ページの本' }
]
}


MongoDB をインストールします

まず http://www.mongodb.org/downloads にアクセスしてインストール ファイルをダウンロードし、次にそのファイルを D ドライブにコピーして名前を mongodb に変更し、その中に新しいブログ フォルダーを作成します


次に、コマンド ライン ツールを開き、ディレクトリを bin に切り替え、次のように入力します。

コードをコピー コードは次のとおりです。mongod -dbpath d:mongodbblog
ブログ フォルダーをプロジェクト ディレクトリとして設定し、データベースを起動します。将来の便宜のために、コマンドを記述し、クリックしてデータベースを起動できます。

コードをコピー コードは次のとおりです:d:mongodbbinmongod.exe -dbpath d:mongodbblog

MongoDB をリンク

データベースが正常にインストールされた後、プログラムはデータベースにリンクするために関連する「ドライバー」プログラムを必要とします。もちろん、この時点でパッケージをダウンロードする必要があります...

package.json を開き、依存関係に新しい行を追加します

コードをコピーします コードは次のとおりです:

{
"name": "アプリケーション名",
"バージョン": "0.0.1",
"プライベート": true、
"スクリプト": {
"start": "node app.js"
}、
"依存関係": {
"エクスプレス": "3.4.8",
"ejs": "*",
"mongodb": "*"
}
}

次に、npm install を実行して、新しい依存関係パッケージをダウンロードします。これで、mysql などのデータベースに接続するために、他の依存関係パッケージが必要になります。

このとき、ルートディレクトリにsetting.jsファイルを作成し、データベース接続情報を保存します

コードをコピーします コードは次のとおりです:
module.exports = {
cookieSecret: 'myblog',
db: 'ブログ',
ホスト: 'ローカルホスト'
};

db はデータベース名、host はデータベースのアドレス、cookieSecret は Cookie の暗号化に使用され、データベースとは関係ありません

次に、ルート ディレクトリに新しい models フォルダーを作成し、models フォルダーの下に新しい db.js を作成します

コードをコピーします コードは次のとおりです:
var settings = require('../settings'),
Db = require('mongodb').Db,
接続 = require('mongodb').Connection,
サーバー = require('mongodb').Server;
module.exports = new Db(settings.db, new Server(settings.host, Connection.DEFAULT_PORT), {safe: true});

コードをコピーします コードは次のとおりです。
new Db(settings.db, new Server(settings.ホスト、接続 .DEFAULT_PORT)、{ 安全: true });
データベース名、データベース アドレス、データベース ポートを設定してデータベース インスタンスを作成し、module.exports を通じてインスタンスをエクスポートします。これにより、require を通じてデータベースの読み取りと書き込みができるようになります

データベースに正常に書き込むためには、サーバー側プログラムで投稿情報を処理する必要があるため、models フォルダーに新しい user.js を作成します

コードをコピーします コードは次のとおりです:
var mongodb = require('./db');
関数 User(ユーザー) {

this.name = ユーザー名;
this.password = user.password;
};

module.exports = ユーザー;

//ストレージユーザー情報

User.prototype.save = 関数 (コールバック) {
//データベースに保存されるユーザードキュメント
var user = {
名前: this.name、
パスワード: this.password
};
//データベースを開く
mongodb.open(関数 (err, db) {
(エラー) {
の場合 Return callback(err); //エラー、エラー情報を返す
}
// ユーザー コレクションを読み取ります
db.collection('users', function (err, collection) {
(エラー) {
の場合 mongodb.close();
return callback(err) //エラー、エラー情報を返す
}
// ユーザー データをユーザー コレクションに挿入します
collection.insert(user, {
安全: true
}, 関数 (エラー、ユーザー) {
mongodb.close();
(エラー) {
の場合 return callback(err) //エラー、エラー情報を返す
}
callback(null, user[0]); //成功! err は null で、保存されているユーザー ドキュメント
を返します。 });
});
});
};

コードをコピーします コードは次のとおりです:

//ユーザー情報を読み取る
User.get = function(name, callback) {
//データベースを開く
mongodb.open(関数 (err, db) {
(エラー) {
の場合 Return callback(err);//エラー、エラー情報を返す
}
// ユーザー コレクションを読み取ります
db.collection('users', function (err, collection) {
(エラー) {
の場合 mongodb.close();
return callback(err);//エラー、エラー情報を返す
}
//ユーザー名 (name キー) の値が name
であるドキュメントを検索します collection.findOne({
名前: 名前
}, 関数 (エラー、ユーザー) {
mongodb.close();
(エラー) {
の場合 return callback(err);//失敗しました!エラー情報を返す
}
callback(null, user);// 成功!クエリされたユーザー情報を返します
});
});
});
};

ここにデータの書き込み用のプログラムとデータの読み取り用のプログラムがあります。次に、index.js の前に次のプログラムを追加する必要があります。

コードをコピー コードは次のとおりです。
var User = require('../models/user .js' );
app.post('/register') を変更します

コードをコピーします コードは次のとおりです:
app.post('/register', function (req, res) {
var name = req.body.name;
var pwd = req.body.password;
var newUser = 新しいユーザー({
名前: 名前、
パスワード: pwd
});
newUser.save(function (err, user) {
//関連する操作、セッションへの書き込み
res.send(ユーザー);
});
});

[登録] をクリックすると応答が表示されます

この時点でデータベースに書き込むかどうかわからない場合は、クエリするデータベースに入り、まずデータベース ディレクトリに切り替えます

コードをコピー コードは次のとおりです:
D:mongodbbin>
次のように入力します:

コードをコピーします コードは次のとおりです:
mongo
その後、データベース接続をブログに切り替えます

コードをコピー コードは次のとおりです:
ブログを使用します
最後の入力

コードをコピー コードは次のとおりです:
db.users.find()

データが書き込まれたのを見てみんな満足したので、今日の学習はひとまず終了です

結論

今日はブログに従って、インストールからデータベースへの書き込みまでの操作を完了しました。明日は他の要素を追加して、nodeJS の学習を徐々に深めていきます。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。