httpClient的会话问题(Angular + Node Js)

时间:2019-02-25 11:32:30

标签: node.js session http-post angular-cli angular-httpclient

我正在尝试在服务器端保留会话。但是Node服务器无法跟踪客户端会话。

此代码有什么问题?
为什么我没有会话对象?

节点Js(服务器) -app.js

const express = require('express')
var bodyParser = require('body-parser');
var session = require('express-session');
var cors = require('cors');
const app = express()
const port = 3000

app.use(cors())
app.use(session({ secret: '2C44-4D44-WppQ38S', resave: true, saveUninitialized: true }));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.get('/', (req, res) => res.sendFile(__dirname + '/index.html'))

app.post('/dashboard', function(req, res) {
  if (req.session.username) {
    res.send({ "msg": "Dashboard Page" });
  } else {
    res.send({ "msg": "Please Login First" });
  }
});

app.route('/login').post(function(req, res) {
  if (req.session.username) {
    req.session.username = "someone";
    res.header("Content-Type", 'application/json');
    res.send({ "msg": "already logged in!" });
  } else {
    req.session.username = "someone";
    res.send({ "msg": "successfully logged In!" });
  }
});

app.route('/logout').post(function(req, res) {
  if (req.session.username) {
    req.session.destroy();
    res.send({ "msg": "successfully logged out!" });
  } else {
    req.session.destroy();
    res.send({ "msg": "session not found!" });
  }
});

app.listen(port, () => console.log(`Example app listening on port ${port}!`));

Angular 6(客户端) -app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Angular 6(客户端)-app.component.ts

import { Component,OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
  constructor(public http: HttpClient) {}
  public loginStatus = "-"
  public dashboardStatus = "-"
  public logoutStatus = "-"
  ngOnInit(){
    this.http.post("http://192.168.1.93:3000/login",{username:"someone",password:"1234"})
    .subscribe(res => { this.loginStatus = res["msg"] });
    this.http.post("http://192.168.1.93:3000/dashboard",{data:"nothing"})
    .subscribe( res => { this.dashboardStatus = res["msg"] } );
    this.http.post("http://192.168.1.93:3000/logout",{data:"nothing"})
    .subscribe( res => { this.logoutStatus = res["msg"] });
  }
}

Angular 6(客户端)-app.html.ts

<div>
  <h1> loginStatus :  {{ loginStatus }} </h1>
  <h1> dashboardStatus :  {{ dashboardStatus }} </h1>
  <h1> logoutStatus :  {{ logoutStatus }} </h1>
</div>

输出-

loginStatus : successfully logged In!
dashboardStatus : Please Login First
logoutStatus : session not found!

预期输出-

loginStatus : successfully logged In!
dashboardStatus : Dashboard Page
logoutStatus : successfully logged out!

0 个答案:

没有答案