//tips
//smart contract
きちんとcodementorの方との打ち合わせ時間確定とサイトでのスケジュールconfirmation手続きなどを完了。chatで話していたら、少し前までニセコにいらっしゃってて、仕事とスノボやってたぜとのこと。充実した働き方をしているよう。日本語も少し話せるようだったので尚よし。
打ち合わせに合わせて、少しでも全体構成の解像度を上げていきたい。説明補足資料も作る必要あり。
特にサーバ周りの設定は未知の世界なので、node.jsをより深く理解することで少しでも穴が少なくなるように準備する。
Node.jsを使うことでサーバ側もクライアント側も全てjsでかけて管理が楽になる。
また今まではwebサーバにフレームワークのプログラムをアップロードする従来の形ではなく、webサーバーまでnode.js側で作れてしまい、それもwebサーバ機能のライブラリから引っ張ってくるだけで良いので、数行書くだけでwebサーバーが実行できるような仕組みになっているとのこと。
バージョン番号の横につくLTSはlong term supportの略で長い期間メンテナンスされる事が保証されているバージョン。
node -vしてみると今自分のosにはv16.2.0が入っている事が確認できた。
Nodeのみのコマンドを行うと、その場でスクリプトをかけるモードに突入する。
Node.jsを用いたアプリケーション開発の流れは、
・アプリケーションフォルダーの作成
・フォルダー内にnode.jsに必要なjsファイルを作成
・その他必要なファイルを作成
・ファイル一式が揃ったらターミナルで、このフォルダに移動し、nodeコマンドを実行。このコマンドでフォルダー内のファイルを利用するwebサーバーを起動させる。
早速この手順をなぞりながらサンプルを作成する。
app.jsを作成。
const http=require('http');
var server=http.createServer(
(request,response)=>{
response.end('Hello Node.js!');
}
);
server.listen(3000);
これを
node app.js
とコマンドすることでapp.jsがnode.jsで実行される。
その後にhttp://localhost:3000/に入ればapp.jsの内容が表示されている。
//インターネットアクセスをするhttpオブジェクトを読み込み
//node.jsはオブジェクトをモジュールかして管理しているので必要に応じてロードする必要がある
const http=require('http');
//httpからサーバのオブジェクトを作成
//http.createServerでサーバオブジェクトhttp.Serverオブジェクトを作成
//createServerは関数を引数にする(request,response)=>{処理内容}
var server=http.createServer(
//function(request,response)=>の略
//(request,response)はクライアントからサーバへの要求とサーバからクライアントへの返信を管理
//誰かがサーバにアクセスしてくるとこの関数が呼び出される
(request,response)=>{
//responseはサーバからクライアントへの返信に関するオブジェクト
//endはクライアントへの返信を終了するメソッドで引数テキストを出力して通信を終了する
//なので、ここが表示画面となる
response.end('Hello Node.js!');
}
);
//http.Serverオブジェクト、サーバオブジェクトを待ち受け状態に
//待ち受けは、サーバに外部からアクセスするのをずっと待つ状態にしておくこと
server.listen(3000);
さらに詳しくrequestとresponseを見ていくと
http.ClientRequest:request引数に入っているオブジェクト
http.ServerResponse:response引数に入っているオブジェクト
となり、サーバプログラムとして常に、クライアントから送られてきた情報とサーバから送り返す情報を意識する必要がある。
サーバというと、デッキに収まったDB情報を保存しているパソコン群とセキュリティおよび通信に用いるプログラムなどを思い浮かべてしまうが、よりシンプルに考える必要がありそう。冗長性とかは別の要素なのか。
Htmlに記載内容を変更して再度アップ。
(request,response)=>{
//responseはサーバからクライアントへの返信に関するオブジェクト
//endはクライアントへの返信を終了するメソッドで引数テキストを出力して通信を終了する
//なので、ここが表示画面となる
response.end('<html><body><h1>hi</h1><p>welcome to node.js</p></body></html>');
}
これはnode app.jsを再度実行する必要がある。
Node.jsは起動時にメモリにファイルをアップロードし、それをもとに実行する性質を持つので都度中断する必要がある。nodemonなどでこれを解消する手もある。
Chromeではこれでもきちんと表示できたがブラウザの種類によってはうまく認識されない場合もある。
そのために表示コンテンツにあらかじめヘッダー情報(使用言語、エンコードUTF-8、コンテンツHTMLなど)を渡すことも考える。
ヘッダー情報はアクセスに関する情報のやり取りなので、ページには現れない情報。サーバからクライアントに送る際にはヘッダー情報もつけると親切。
ヘッダー情報の記載方法として、サーバーからの送信内容を管理するhttp.ServerResponseオブジェクトの下記のようなメソッドが考えられる。
・ヘッダー情報の設定
response.setHeader(名前、値)
・ヘッダー情報を得る
response.getHeader(名前)
・ヘッダー情報を出力する、これはステータスコードを表すもの
response.writeHead(コード番号、メッセージ)
ヘッダー情報は、名前と値がセットになったさまざまな情報が用意されている。
(request,response)=>{
response.setHeader('Content-Type','text/html');
response.write('<!DOCTYPE html><html lang="ja">');
response.write('<head><meta charset="utf-8">');
response.write('<title>Hello</title></head>');
response.write('<body><h1>hi</h1>');
response.write('<p>this is a サンプル page</p>','utf8');
response.write('</body></html>');
response.end();
}
Writeの記述がいささか面倒。
これは普通にhtmlファイルを読み込んで表示する方法を使えば良い。その場合はfile systemオブジェクトを使用することになり、require(fs)で使用できる。これはDappを作ったときも使用したかと思う。
Fs.readFile(ファイル名,エンコーディング,読み込み完了後に実行する関数)
読み込み完了後に実行する関数を設けているのは、読み込み待機時間は、次の処理に移行させ、別の処理も同時並行で実行させるため。ファイルが重すぎる場合は何も表示されなくなるのを避ける事ができる。
読み込みはバックグラウンドで処理される。
ということでhtmlのファイルを作成のうえ、それを読み込ませる。
const http=require('http');
const fs=require('fs');
var server=http.createServer(
(request,response)=>{
//処理が完了次第呼び出されるコールバック関数
fs.readFile('./index.html','UTF-8',
(error,data)=>{
//errorはエラーがなかったら空、dataはファイルから読み込んだデータ
response.writeHead(200,{'Content-Type':'text/html'});
//ここでhtmlファイルの内容を書き出している
response.write(data);
response.end();
});
}
);
server.listen(3000);
console.log('server start');
