會話未持續開發（localhost：4200）

Question

我正在使用angular（前端）和node.js + express（后端）。 當我在localhost:3000 （Express應用程序正在運行的端口）上運行我的應用程序時，一切都是正確的，我注意到即使刷新頁面，請求會話ID也是一樣的。 但是，當我想在localhost:4200上以dev模式工作時，會話不再持久，每次刷新頁面時都會顯示一個新的會話ID。

app.js

const bodyParser = require('body-parser'),
  cookieParser = require('cookie-parser'),
  cors = require('cors'),
  express = require('express'),
  session = require('express-session');

const app = express();

app.use(cors());


const port = process.env.PORT || '3000';
app.set('port', port);

const server = http.createServer(app);

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  res.header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
  next();
});

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
  extended: false
}));

app.use(cookieParser());

app.use(session({
  secret: 'MY-KEY',
  resave: false,
  saveUninitialized: false,
  store: new MongoStore({ mongooseConnection: mongoose.connection })
}));

app.use(passport.initialize());
app.use(passport.session());

server.listen(port, () => console.log(`API running on localhost:${port}`));

我在開發模式下也使用代理如下：

代理conf.json

{
  "/api/*": {
    "target": "http://localhost:3000",
    "secure": false,
    "logLevel": "debug",
    "changeOrigin": true
  }
}

Answer 1

找到它，我不得不：將localhost:4200添加到白名單，在session中將cookie.secure設置為false

app.js

var whitelist = ['http://localhost:4200'];

var corsOptions = {
  origin: function(origin, callback) {
    if (whitelist.indexOf(origin) === -1) {
      callback(new Error('Not allowed by CORS'));
    } else {
      callback(null, true);
    }
  },
  credentials: true,
};

app.use(cors(corsOptions));
.
.
app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  res.header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
  next();
});
.
.
app.use(session({
  secret: 'My-Key',
  resave: false,
  saveUninitialized: true,
  cookie: { secure: false },
  store: new MongoStore({ mongooseConnection: mongoose.connection })
}));

並在每個Http請求標頭中添加：

withCredentials: true

如

isLoggedIn(): Observable < boolean > {
    return this.http.get(ip + 'api/isAuthenticated', { withCredentials: true }).map(response => response.json());
}