4

Express(> 3.0)フレームワークを使用して、nodejs(v1.8.15)でページの一部を動的にロード/レンダリングする必要があります。通常、私は単一ページのアプリを作成したいと考えています。

ページの上部にリンク付きのメニューがあります。リンクをクリックすると、AJAX ページの読み込みと同様に、以下のコンテンツが変更されます。

例えば:

>home|login|signup|chat
..content for home..

「サインアップ」リンクを押すと:

home|login|>signup|chat
..content for signup..

Express では、サーバーにルートがあります。

var express = require('express');
var app = express();

app.get('/signup', function(req, res) {
    // render signup.jade
    res.render('signup');
}
app.post('/signup', function(req, res) {
    // .. work with information
    if (ok) res.send('ok', 200); else res.send(error, 200);
}

これを読んだ後、socket.io を使用する必要があることがわかりました。私はソケットをよく知っているので、「リンクのクリック」に関するデータをクライアントからサーバーに送信するのは簡単です。

Q1: Express で書いたように動的にページをレンダリング/ロードするにはどうすればよいですか?

はい、ページの読み込みに AJAX を使用できますが.post、express のメソッドでは機能しますか? このようなサイトを作るには、どのように考えを整理すればよいでしょうか。

ところで、DerbySocketStreamについて読んだことがありますが、わかりませんでした。

Q2: 私の目的 (サイト機能: ログイン、サインアップ、チャット) で Derby または SocketStream を使用できますか? どのように?

SocketStream が必要な場合、Heroku では動作しないため、非常に悪いことです。

4

1 に答える 1

10

Q1) これは実際には非常に単純で、Socket.io や Derby などは必要ありません。jQuery を使用すると、ajax が非常に簡単になります。あなたの例では、コンテナ HTML ファイルに id 'container' の div があるとします。これは、ajax で読み込まれたコンテンツを配置する場所です。

$.ajax({ url: 'http://yoursite.com/signup'
     , type: 'GET'
     , dataType: 'html'
    })
.done(function(data) {
  $('#container').html(data);
})
.fail(function() {
  console.log("Something went wrong!");
});

Express はすべての HTTP 動詞 (GET、POST、PUT など) をサポートします。ページを動的にロードするには、GET を使用します。ユーザーがログイン情報を入力すると、それが有効かどうかを通知する Express ルートに POST できます。jQuery を使用して、それに応じて DOM を変更します。

Q2) Q1 で述べたように、Derby や SocketStream を使用する必要はありません。普通の古い jQuery + 基本的な Express で、必要な場所に移動できます。

于 2012-11-27T08:30:36.190 に答える