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がうまく表示されないことについて調べてみる。