2014-09-15 3 views
1

내 node.js 웹 페이지를 코딩하려고합니다.전체 아약스 요청 이상 경로

특급 및 옥 템플릿과 함께 node.js를 사용합니다.

서버에 대한 POST AJAX 요청을 사용하여 완전히 비동기로 만들고 싶습니다. 옥 템플릿의

$("#logout").click(function(event){ 
    event.preventDefault(); 
    var payload = { 
     command: 'logout' 
    }; 
    $.ajax({ 
     url: "/main_page_ajax", 
     type: "POST", 
     datatype: "json", 
     contentType: "application/json; charset=utf-8", 
     processData: false, 
     data: JSON.stringify(payload), 
     success: function (result) { 
      var json = jQuery.parseJSON(result); 
      if(json.done==1){ 
       $('#login_screen_clear').fadeIn("slow"); 
       $('#login_screen_logged').hide(); 
       show_message('Logout successful!'); 
      } 
      else show_message('Something went wrong...!'); 
     } 
    }); 
}); 

부 (index.jade) :

#login_screen_logged 
    .log_div 
     h3 Hello 
      b#logged_name 
      | ! 
     br 
     br 
     a#logout(href='/logout') Logout 
#login_screen_clear 
    //login form 
    input#player_login(type='text', size='15', autocomplete='off') 
    input#player_pass(type='password', size='15', autocomplete='off') 
    input#login_button(type='submit', value='Login') 
내가 좋아하는 클라이언트 아약스를 통해 요청을 호출하고

router.get('/', function(req, res) { 
    res.render('index', { "some": 'parameters'}); 
} 

: 내가 좋아하는 단 하나의 경로가 될 것이라고 의미

서버 측으로 돌아갑니다. 취급 아약스 요청 :

  1. 이는 Node.js를 응용 프로그램에 대한 좋은 방법입니다 :

    router.post('/main_page_ajax', function(req, res) { 
        switch(String(req.body.command)){ 
         case 'logout': 
          var resultJson = { }; 
          req.session.destroy(function(err) { 
           resultJson.done=1; 
           res.end(JSON.stringify(resultJson)); 
          }); 
         break; 
        } 
    }); 
    

    좋아, 그래서 여기 내 질문은?

  2. 이 방법을 사용하면 특정 호출을 기다리는 index.jade 템플릿 (숨겨진 div)에 거의 모든 컨테이너를 저장할 수 있습니다. 따라서이 파일은 더 많은 앱 개발로 늘어날 것입니다. html/jade 코드를 유지하기에 더 좋은 곳이 있습니까? 어쩌면 아약스가 그걸 요구 했을까?

success: function (result) { 
    var json = jQuery.parseJSON(result); 
     if(json.done==1){ 
      $('#login_screen_clear').html("<a><bunch><of><html><code>") 
      $('#login_screen_clear').fadeIn("slow"); 
      $('#login_screen_logged').hide(); 
      show_message('Logout Successful!'); 
     } 
     else show_message('Something went wrong...!'); 
} 

그럼 나는 누군가가 내 문제를 이해하고 올바른 방법으로 날 지점 바랍니다.

추신. 내 가난한 영어 미안해.

+1

[angularjs] (https://angularjs.org/), [emberjs] (http://emberjs.com/), [backbone.js] (http : //www.blackberry.js)와 같이 SPA를 구축하기 위해 클라이언트 측 프레임 워크를 사용하십시오. //backbonejs.org/), [녹아웃] (http://knockoutjs.com/), [반응] (http://facebook.github.io/react/). – user3995789

답변

0

하지 마십시오. 평온한 서비스로 노선을 조정하는 방법에 대해 알아보십시오. 예를 들어, 사용자가 로그 아웃에 대한 경로는 다음과 같이 보일 것이다 :

router.post('/profile/:name/logout', function(req, res) { 
    req.session.name = null; //Flush session if you are using express 
    var token = req.session.token || ''; 
    token.invalidate(token); //Function to remove token from redis or whatever you are using 
    res.status(200); 
}); 

그래서이 경로는 계정에 연결된 모든 세션 및/또는 토큰을 플러시하고 200 응답을 다시 전송합니다.

옥의 템플릿은 템플릿과 핸들을 serve templates from the server에 표시하는 것이 좋습니다. 더 합리적인 것 외에도 더 빠릅니다. 나는 개인적으로 클라이언트 쪽과 서버 쪽 모두를 사용한다.

그리고 get 요청. 사람들은 보통 인증없이 html을 제공하고 브라우저가 페이로드를 받으면 클라이언트 쪽 javascript는 ajax 및/또는 jwt을 통해 사용자를 인증합니다.

아, 영어가 꽤 있습니다.

+0

그러면 경로가 더 좋습니다. 제이드 템플릿을 핸들과 함께 사용하는 것에 대한 몇 가지 예를 보여줄 수 있습니까? – Mortis

+0

옥 보석 대신에 손잡이 줄을 제안했습니다.익스프레스 용 핸들 바를 사용하려면 여기를 클릭하십시오 : https://www.npmjs.org/package/express-handlebars – shash7