Https请求在Angular Universal上失败

时间:2018-10-15 17:24:43

标签: angular nginx

我正在使用Angular Universal,NGINX和Express Framework。 我想通过https运行我的网站。如果我将URL设置为http://test.com作为请求的基本URL,则它工作正常。如果我将基本URL更改为https://test.com,那么我将无法再发送请求。由于此问题,我的网站无法加载。

我可以看到NGINX的配置正确,并且https证书也可以正常工作。

Start page

但是URL请求失败。

enter image description here

我也尝试过卷曲https://test.com:4100/api/load

  

卷曲:(35)OpenSSL SSL_connect:SSL_ERROR_SYSCALL连接到   test.com:4100

NGINX配置:

server {

        server_name test.com www.test.com;


        location / {
            proxy_pass http://localhost:4200;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }

        listen 443 ssl; # managed by Certbot
        ssl_certificate /etc/letsencrypt/live/test.com/fullchain.pem; # managed by Certbot
        ssl_certificate_key /etc/letsencrypt/live/test.com/privkey.pem; # managed by Certbot
        include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot


    }

    server {
        if ($host = www.test.com) {
            return 301 https://$host$request_uri;
        } # managed by Certbot


        if ($host = test.com) {
            return 301 https://$host$request_uri;
        } # managed by Certbot


        listen 80;

        server_name test.com www.test.com;
        return 404; # managed by Certbot

    }

更新Node.js服务器app.ts文件

import * as express from "express";
import * as compression from 'compression';
import * as path from "path";
import { json, urlencoded } from "body-parser";
import { readFileSync } from 'fs';
import { join } from 'path';
var cors = require('cors');
var mosca = require('mosca');
var passport = require('passport');
var BearerStrategy  = require('passport-http-bearer').Strategy;
var mongoose = require('mongoose');
var api = require('./routes/api');
var messages = require('./routes/messages');
var user = require('./routes/user');
var exp = require('./routes/experiences');
var passport = require('passport');
var image = require('./routes/image');
var session = require('cookie-session');
var busboy = require('connect-busboy');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var flash    = require('connect-flash');

const PORT = 4100;


const app = express();
app.use(cors());


//app.disable("x-powered-by");

app.use(cookieParser()); // read cookies (needed for auth)
app.use(bodyParser.json()); // get information from html forms
app.use(compression());

app.use(urlencoded({ extended: true }));
app.use(busboy());


// Mongoose connection to MongoDB (ted/ted is readonly)
mongoose.connect('mongodb://localhost/testDB', { useNewUrlParser: true }, function(error) {
    if (error) {
        console.log(error);
    }

});
// configuration ===============================================================
require('./config/passport')(passport); // pass passport for configuration

app.use("/api", api);
app.use("/messages", messages);
app.use('/user',user);
app.use("/exp", exp);
app.use('/image',image);


app.use(session({ secret: 'ilovescotchscotchyscotchscotch',  // Cookie Options
  maxAge: 24 * 60 * 60 * 1000 })); // session secret

app.use(passport.initialize());
app.use(passport.session()); // persistent login sessions
app.use(flash()); // use connect-flash for flash messages stored in session
require('./routes/routes.js')(app, passport,express);

app.listen(PORT, () => {
    console.log(`listening on http://localhost:${PORT}!`);
  });

Angular Universal server.ts

// These are important and needed before anything else
import 'zone.js/dist/zone-node';
import 'reflect-metadata';

import { enableProdMode } from '@angular/core';

import * as express from 'express';
import { join } from 'path';

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

// Express server
const app = express();

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

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

// Express Engine
import { ngExpressEngine } from '@nguniversal/express-engine';
// Import module map for lazy loading
import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';



app.engine('html', ngExpressEngine({
  bootstrap: AppServerModuleNgFactory,
  providers: [
    provideModuleMap(LAZY_MODULE_MAP)
  ]
}));

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

// TODO: implement data requests securely
app.get('/api/*', (req, res) => {
  res.status(404).send('data requests are not supported');
});

// Server static files from /browser
app.get('*.*', express.static(join(DIST_FOLDER, 'browser')));

// All regular routes use the Universal engine
app.get('*', (req, res) => {
  res.render('index', { req });
});

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

0 个答案:

没有答案