Javascript (カレンダー011_Nodeへ移す)

■カレンダーのjavascriptをNodeへ移す。

Node.jsについて調べmysqlへのデータの登録ができたので、いよいよカレンダーのjavascriptをNode.jsで実施できるようにコードを修正していく。流れとしては、前回見たindex.js、requestHandlers.js、router.js、server.jsの中でhtmlのコードを扱っていたrequestHandlers.jsに対して、calenderXXX.htmlとして作成してきたコードを入れるようにする。早速コピーして、少し修正を入れつつ実行してみた。
No request handler foundといったエラーが出た。どうやらjavascriptの中で参照しているコードでエラーが出ているみたい。

サーバサイドのNode.jsを使う場合、クライアントサイドでjavascriptを実行するのとは違った方法が必要となるらしく、jQueryは「var $ = require('jquery')(window);」といった形でrequireを使用しての宣言のようなものが必要となる。それでもまだエラー(Error: jQuery requires a window with a document)が出ており、調べていくとjsdomというライブラリも必要となるらしい。

いろいろなサイトの記述を試してみて、下のようなエラー(TypeError: jsdom is not a function)も出つつ、なんとかエラーは出ないようになった。その時に追加しているコードが下のもの。

calender011.jsに対しては文頭に下のコード。
(calenderXXX.htmlのscriptの部分を別ファイルcalender011.jsとして保存している)

var jsdom = require('jsdom'); 
var { JSDOM } = jsdom;
var window = new JSDOM().window;
var $ = require('jquery')(window); 

requestHandlers.jsに対しては文頭に下のコード。

var querystring = require("querystring");
var cal = require('./calender011.js');
var jsdom = require('jsdom');
const { JSDOM } = jsdom;
const document = new JSDOM().window.document;

ただ、htmlの記述がそのまま画面に表示されるだけで、まだまだ改修がいりそう。

今回、いろいろ触ってみて、コードのrequire('jsdom')、require('jquery')のjsdom, jqueryはおそらくnpmでインストールしたバージョンが入っているのではと思う。WARNは出つつもnpm install XXXでインストールできたようで、npm lsで導入されていることが確認できた。

今後、htmlがうまく表示されないことについて調べてみる。