express에서 페이지를 동적으로 렌더링 /로드하는 방법은 무엇입니까?

Question

express (> 3.0) 프레임 워크를 사용하여 nodejs (v1.8.15)의 페이지 일부를 동적으로로드/렌더링해야합니다. 일반적으로 단일 페이지 앱을 만들고 싶습니다.

페이지 상단에 링크가있는 메뉴가 있습니다. 링크를 클릭하면 AJAX 페이지 로딩과 마찬가지로 아래 내용이 변경됩니다. 예를 들어

:

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

나는 '가입'링크를 누르면 : Express에서

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

을 나는 서버의 경로가 있습니다

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); 
} 

this을 읽은 후를, socket.io를 사용해야한다는 것을 알아 냈습니다. 나는 소켓을 잘 알고 있으므로 클라이언트에서 서버로 '링크를 클릭하는'것에 대한 데이터를 보내는 것이 쉽습니다.

1 : 내가 명시 적으로 쓴 것처럼 동적으로 페이지를 렌더링 /로드하려면 어떻게해야합니까?

예, 페이지로드에는 AJAX를 사용할 수 있지만 .post 방법은 명시 적으로 작동합니까? 그런 사이트를 만들기 위해 내 생각을 어떻게 구성해야합니까?

한편, 나는 Derby과 SocketStream에 대해 읽었지만 이해하지 못했습니다.

Q2 : 내 목표 (사이트 기능 : 로그인, 가입, 채팅)에 Derby 또는 SocketStream을 사용할 수 있습니까? 방법?

SocketStream이 필요한 경우 Heroku가 작동하지 않기 때문에 매우 나쁠 것입니다.

Answer 1

Q1) 사실 이것은 매우 간단합니다. Socket.io, Derby 등은 필요 없습니다. jQuery를 사용하면 ajax를 통해 모든 메소드를 사용하여 모든 비명 경로를 호출 할 수 있습니다. (GET, POST, PUT이

$.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 동사를 지원하여 예에서의 당신의 컨테이너 HTML 파일을 사용하면 아약스 -로드 된 내용이 가고 싶은 곳이다 아이디 '용기'와 사업부를 가지고 가정하자 기타.). 페이지를 동적으로로드하려면 GET을 사용하십시오. 그러면 사용자가 로그인 정보를 입력하면 익스프레스 라우트에 POST하여 유효한지 여부를 알려주고 jQuery를 사용하여 그에 따라 DOM을 수정할 수 있습니다.

Q2) Q1에서 말한 것처럼 Derby 또는 SocketStream을 사용할 필요가 없습니다. Plain old jQuery + Basic Express를 사용하면 원하는 곳으로 가실 수 있습니다!