一部のサイトの Web スクレイピングを行い、データを PostgreSQL データベースに保存してから、このデータを (D3.js で) 視覚化して Web ページに表示する Node.js アプリケーションを作成したいと考えています。フロントエンド部分 (ビジュアライゼーションの作成と表示) とバックエンド部分 (Web スクレイピングとデータベースの更新) を分割することを考えました。

2つのアプリ（タスクを2つのアプリに分けているので2つあります）の骨格は以下の通りです。

バックエンド アプリ ( scraper):

• データベースへの接続
• テーブルが存在しない場合の作成
• データのスクレーパー
• データベースにデータを保存する
• データベースからの切断。

このバックエンド アプリケーションは、年に数回だけ起動する必要があります (たとえば、Unix を使用している場合は、これを行うために CRON ファイルを構成できます)。

フロントエンド アプリ ( viz):

• データベースへの接続
• ポート 3000 で待機しているサーバーを起動します (可視化のために必要です)
• ユーザーがページを更新するたびに ( onLoad())、アプリはSELECTデータベースからデータを取得するクエリを作成します ( )。このようにして、データは常に更新されます。

このアプリケーションは、プログラマーによって (理想的には) 1 回だけ開始されます。

このタイプのフォルダー構造を作成しました (私は と を使用npm initしましたExpress):

この構造では、解決方法がわからない2つの問題がすでにあります。

  1.postgreSQLlib.jsファイル (およびutilFunc.js) は と の両方scraperで同じvizです。このコードの重複を避けるにはどうすればよいですか?

  2. 一部のモジュール (たとえばexpress-handlebarsand )を andフォルダーexpressに 2 回インストールする必要がありました。scraperviz

これはproject/scraper/app.js次のとおりです。

これはproject/viz/app.js次のとおりです。

最初のアプリケーション ( project/scraper/app.js) は完全に機能します。

第二の申請（project/viz/app.js）番号。私はあなたにこれをしてもらいたい：

• データベースへの接続[完了。できます]
• ポート 3000 で待機しているサーバーを起動します (視覚化のために必要です) [どうすればよいですか? 下を向いて(*) ]
• ユーザーがページを更新するたびに ( onLoad())、アプリはSELECTデータベースからデータを取得するクエリ ( ) を作成します [どうすればいいですか?]

(*)私は次のようなことを考えていました:

dataHomeとは、クエリdataWorkを使用してデータベースからダウンロードされたデータを含む 2 つのオブジェクトですSELECT。ただし、この方法では、ユーザーがページを更新するたびにデータが破棄されるわけではなく、1 回だけ破棄されます。

助けていただければ幸いです。ありがとうございました！

編集

もっと正確に言えますか？私はそれをやろうとしましたが、うまくいきません:

project/viz/app.js :

project\viz\view\index.handlebars :

project\viz\view\script.js :

どこが間違っていますか？

編集2

わかりました、viz/app.jsコードを再度変更します。

アプリを実行するとエラーは発生しませんが、http://localhost:3000/に接続すると、ブラウザーはサイトにアクセスできないと通知します。ちょっとバカな気がする…

編集3

私があなたのコードを正しく理解していれば、あなたのコードには (気を散らすような) エラーがあります。returnOBJ()代わりに（ファイルに関連する）にres.render('index', viewData);する必要があります。右？res.render('obj', viewData);obj.hbs

この方法で index.hbs ファイルを変更します。

しかし、私は得る：

このコードもわかりません。

app.set('view engine', ...)異なる値で 2 回呼び出すのはなぜですか?

編集4

コードをさらに単純化しました。

/viz/app.js :

/viz/views/test.hbs :

次に、プロンプト コマンドで に移動しproject/viz、node app.js+ Enter と入力します。プロセスが開始され、待機します。エラーはありません。http://localhost:3000/に行くとConnection failed が表示されます。

私は夢中になっています。

編集5

問題はconnect選択を行った関数でもなかったので、コードを少し単純化しました。そして今、それはほとんど動作します!

これがコードです。

viz/app.js :

viz/views/index.hbs :

問題は、json ではないデータ型を取得することです。たとえば、タイムスタンプと exString を出力しようとするとエラーが発生します。なんで？

また、コードを少しクリーンアップして、javascript の部分をを使用してscript.js呼び出されるファイル内に配置したいと思います。index.hbs<script src='/script.js'></script>

編集6

私にとって非常に役立つこのチュートリアルを見つけました。

index.hbscssファイル、画像、スクリプトを追加してファイルを編集しました（これにはaのみが含まれていますconsole.log('here');が、script.jsにviewData変数を配置することを考えています）。

project/viz/views/index.hbs :

私のファイル構造は次のとおりです。

これで画像が表示され、css が使用されます。しかし、ここに文字列が出力されていないため、スクリプトは機能していないようです。

スクリプトタグから外部jsファイルに変数を渡す方法についてインターネットで検索しましたが、自分に合ったものが見つからなかったようです。ハンドルバー API を読みましたが、役に立ちませんでした。

エクスプレスの基本を学んでいるだけで、ノードでフロントエンドアプリケーションを提供しようとしています。私が抱えている問題は、SRC を介して html にリンクした JavaScript が DOM にアクセスできないことです。console.log(document) の場合、ドキュメント オブジェクト全体を文字列として表示できますが、フォームや本文などの内部にアクセスしようとすると、NULLが返されます。ヌルヌルヌルヌルヌル。たとえば、 console.log( document.getElementById('input') ) はブラウザーに null を記録しますが、 console.log(document) はドキュメントをブラウザーに記録します。同じ方法でロードされた私の CSS は問題なく動作します。どうしてこれなの？それを回避する方法は？

パス: weather/src/weather.html

html:

パス: weather/router.js

Router.js:

ノード アプリの高速ルートが 404 エラーを返しています。ローカルでは動作しますが、運用サーバーでは 404 エラーが返されます (アップロードする前に AJAX URL を運用サーバーの URL に変更したことに注意してください)。私のコード:

サーバー.js:

index.js: