0

ログインシステムを構築するために使用している Node.js アプリがあります。ログイン システムは動作していますが、「ログインしているユーザー名」を表示するには、ページを手動で更新する必要があります。ログインするために入力する必要があるサインイン/サインアップ フィールドを非表示にできます。

ここに私のapp.jsコードがあります:

/**
  * Application Configuration
  */
app.configure(function(){
  app.set('port', process.env.PORT || 3000);
  app.set('views', __dirname + '/views');
  app.enable('jsonp callback');
  app.set('view engine', 'jade');
  app.set('view options', {layout : false});
  app.use(express.bodyParser());
  app.use(express.cookieParser());
  app.use(express.session({
    secret : 'sessionsecret'      
  }));
  app.use(express.methodOverride());
  app.use(express.static(__dirname + '/public'));
  app.use(function(req, res, next){
    res.locals.session = req.session;
    next();
  });
  app.use(app.router);
});

そしてlogin.js、これがログインフォームを隠している部分です。

    if(username && password){
      $.post('/login', $(this).serialize(), function(response){
        if(response.retStatus === 'success'){
          $('#loginForm').hide();
          $('#signup-btn').hide();
          //$(location).attr('href', '/admin');
        }else if(response.retStatus === 'failure'){
          $('#signup-error-modal').modal('show');
        }
      });
    }
  });

最後に、これはユーザー名を自動的に表示するビューの JADE/HTML コードです。

if(session.user)
        div#logoutsection.pull-right
          a#logout-btn.btn.btn-info.pull-right.top-bar-form-button(href='/logout') Logout
          p#loginprompt.pull-right.login-prompt #{session.user.username} 
            small logged In
      else
        a#signup-btn.btn.pull-right.top-bar-form-button(href='#signup-modal', data-toggle="modal") Sign Up
        form.pull-right.form-horizontal.top-bar-form(method="post", id="loginForm")
          input.input-small.top-bar-form-textbox(id="username", type="text", name="User", placeholder="Username")
          input.input-small.top-bar-form-textbox(id="password", type="password", name="Password", placeholder="Password")
          button.btn.btn-primary.top-bar-form-button(type="submit", value="Sign In") Sign In

これ以上コードを見たい場合はお知らせください。すべてここにあると思います。しかし、ユーザー名を表示するために手動で更新する必要がある理由が本当にわかりません。どんなアイデアでも歓迎しますか?

4

1 に答える 1

1

問題は、セッションに jade/html ファイルにユーザーがいる場合、ユーザー名が表示されているにもかかわらずです。Ajax 応答で自動的に更新されることはありません。代わりに、ajax 成功関数内の html を更新する必要があります。

これは、次のような login.js ファイルにあります。

if(username && password){
      $.post('/login', $(this).serialize(), function(response){
        if(response.retStatus === 'success'){
          $('#loginForm').hide();
          $('#signup-btn').hide();
          // Add the name of the user to the html here!
          // Edit: If you don't want to send the username from node.js
          $("p#loginprompt").html(username);
        }else if(response.retStatus === 'failure'){
          $('#signup-error-modal').modal('show');
        }
      });
    }

DOM に追加する前に、段落要素が DOM に存在する必要があることに注意してください。また、クロスサイト スクリプティング攻撃を回避するために、応答時にサーバーによってユーザー名が送信され、サニタイズされる必要があります。

それを行うための他の非ユーザーフレンドリーな方法は、プログラムでページを更新することです。しかし、このようにしないでください。

于 2012-12-15T03:54:50.250 に答える