Question

我有一个带服务器端渲染的Angular应用程序。我不会仅在服务器端执行一个休息请求，所以我将这些代码放在if（isPlatformServer（this.platformId））块中。

app.component.ts

import {Component, Inject, OnInit, PLATFORM_ID} from "@angular/core";
import {HttpClient, HttpHeaders} from "@angular/common/http";
import "rxjs/add/operator/map";
import {Http} from "@angular/http";
import {isPlatformBrowser, isPlatformServer} from "@angular/common";

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit{
  constructor(private http: HttpClient, @Inject(PLATFORM_ID) private platformId: Object){ }

  ngOnInit(): void {
    if (isPlatformBrowser(this.platformId)) {
      /* Client only code. */
    }

    if (isPlatformServer(this.platformId)) {
      /* Server only code. */
      this.http.get('http://localhost:8080/tracking', { withCredentials: true }).subscribe(data => {
        console.log("Init tracking")
      });
    }
  }
}

一切都好，这个http.get仅在服务器端调用，但我的API上的httprequest没有cookie。所以，在我的节点服务器中，我添加了cookie throw cookie-parser：

let cookieParser = require('cookie-parser');
app.use(cookieParser());

我在console.log（req.cookies）中看到了它们，但它们仍然没有进入API。

server.ts

import "zone.js/dist/zone-node";
import "reflect-metadata";
import {enableProdMode} from "@angular/core";
import * as express from "express";
import {join} from "path";
import {readFileSync} from "fs";
// Express Engine
import {ngExpressEngine} from "@nguniversal/express-engine";
// Import module map for lazy loading
import {provideModuleMap} from "@nguniversal/module-map-ngfactory-loader";
import {CookieService} from "ngx-cookie-service";

// Faster server renders w/ Prod mode (dev mode never needed)
enableProdMode();

// Express server
const app = express();
let cookieParser = require('cookie-parser');
app.use(cookieParser());

const PORT = process.env.PORT || 4200;
const DIST_FOLDER = join(process.cwd(), 'dist');

// Our index.html we'll use as our template
const template = readFileSync(join(DIST_FOLDER, 'browser', 'index.html')).toString();

// * NOTE :: leave this as require() since this file is built Dynamically from webpack
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main.bundle');

// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
app.engine('html', ngExpressEngine({
  bootstrap: AppServerModuleNgFactory,
  providers: [
    CookieService,
    provideModuleMap(LAZY_MODULE_MAP)
  ]
}));

app.set('view engine', 'html');
app.set('views', join(DIST_FOLDER, 'browser'));

/* - Example Express Rest API endpoints -
  app.get('/api/**', (req, res) => { });
*/

// Server static files from /browser
app.get('*.*', express.static(join(DIST_FOLDER, 'browser'), {
  maxAge: '1y'
}));

// ALl regular routes use the Universal engine
app.get('*', (req, res) => {
  console.log('Cookies req: ', req.cookies);
  res.render('index', { req });

});

// Start up the Node server
app.listen(PORT, () => {
  console.log(`Node Express server listening on http://localhost:${PORT}`);
});

如何通过cookie throw节点＆amp;让他们在API的休息终点？

如何将Cookie throw节点服务器传递给Angular Universal中的REST API？

0 个答案: