Angular + Node.js HTTP 和 HTTPS (SSL)

Question

我想在我的付款视图中对 post 请求使用 https。我偶然发现了 diff 教程，现在我的设置如下（但我仍然不明白运行）：

证书

我使用本教程为我的开发环境生成了证书： http://greengeckodesign.com/blog/2013/06/15/creating-an-ssl-certificate-for-node-dot-js/

Node.js

我按照答案 #2 在节点中设置了 http 和 https 服务器：

看起来是这样的：

environment = require('./config/config.js')()

express  = require('express')
bodyParser = require('body-parser')
app      = express()
portHTTP     = process.env.PORT || 61361
portHTTPS = 3030
mongoose = require('mongoose')
morgan       = require('morgan')
http = require('http')
https = require('https')
socket = require('socket.io')

#SSL Server
fs = require('fs')
sslOptions = {
  key: fs.readFileSync(__dirname + '/config/ssl/server.key'),
  cert: fs.readFileSync(__dirname + '/config/ssl/server.crt'),
  ca: fs.readFileSync(__dirname + '/config/ssl/ca.crt'),
  requestCert: true,
  rejectUnauthorized: false
}

#Database
configDB = require('./config/database.js')(environment)
mongoose.connect(configDB.url,{auth:{authdb:configDB.authdb}}, (err)->
  if (err)
    console.log(err)
)
db = mongoose.connection
db.on('error', console.error.bind(console, 'connection error:'))
db.once('open', () ->
  console.log "Database established"
)

#Express Application
app.use(morgan('dev'))# log every request to the console
app.use(bodyParser.urlencoded({ extended: true }))
app.use(bodyParser.json())

rootPath = __dirname + '/../../'
app.use('/bower_components', express.static(rootPath + 'bower_components'))
app.use('/partials', express.static(__dirname + '/../partials'))

# Routes
require('./node/routes.js')(app, db) # load our routes and pass in our app and fully configured passport

# Launch the application
https.createServer(sslOptions,app).listen(portHTTPS, () ->
  console.log("Secure Express server listening on port #{portHTTPS}")
)
http.createServer(app).listen(portHTTP)
io = socket.listen(https)

#app.listen(portHTTP)
console.log('Unsecure Express server listening on port #{portHTTP} environment: #{environment}')

Angularjs

我安装了 angular 模块： https://github.com/btford/angular-socket-io

并将其添加到我的 index.coffee

angular.module "app", [lots of dependencies, 'btford.socket-io', 'myCodeService']
  .config ($stateProvider, $urlRouterProvider) ->
    ...states...
  .factory('mySocket', (socketFactory) ->
    return socketFactory({
      ioSocket: io.connect('https://localhost:3030/',{secure: true})
      #ioSocket: io.connect('https://cdn.socket.io/socket.io-1.3.4.js',{secure: true})
    })
  )

我在 index.html

中添加了两个脚本标签

<script src="../bower_components/angular-socket-io/socket.js"></script>
<script src="http://localhost:3030/socket.io/socket.io.js"></script>

Gulp 设置

我在 gulp 服务于 nodemon 和 browsersync

gulp.task('serve',['watch'], function(cb){
  var called = false;
  return nodemon({
    script: paths.tmp + '/serve/server.js',
    watch: [paths.src + '/node', paths.src + '/config'],
    ext: 'coffee',
    tasks: ['templateCache', 'partials_tmp'],
    env: { 'NODE_ENV': 'development' } ,
    nodeArgs: ['--debug=9999']
  })
  ....

 function browserSyncInit(files, browser) {
  browser = browser === undefined ? 'default' : browser;
  browserSync.instance = browserSync.init(files, {
    startPath: '/#/',
    browser: browser,
    proxy: "http://localhost:61361"
  });
}

我从 socket.io 收到一个空的响应，并且我在浏览器中没有看到任何让我接受证书的错误。

browsersync 有一个 https 选项，但我真的不知道如何拆分流量/或者这是否在 node.js 中自动完成。

Answer 1

io = socket.listen(https) 不正确。您应该传递服务器实例，而不是 https 模块：

// ...
var srv = https.createServer(sslOptions,app);
srv.listen(portHTTPS, () ->
  console.log("Secure Express server listening on port #{portHTTPS}")
)
io = socket.listen(srv);
// ...

另外你指向 socket.io.js 的 <script> src 应该是 https 而不是 http.

Answer 2

在前端拆分路由可以使用：

.run ($rootScope, $window, authUserService) ->
    #Listens for state changes and redirects User if he is not logged in
    $rootScope.$on "$stateChangeStart", (event, toState, toParams, fromState, fromParams) ->
      #After login send user to share
      if toState.name is "payment" and !authUserService.isSecure()
        event.preventDefault()
        $window.location.href='https://localhost:3030/#/spenden'
        true

Angular + Node.js HTTP 和 HTTPS (SSL)

Angular + Node.js HTTP & HTTPS (SSL)

ssl

node.js

angularjs

证书

Node.js

Angularjs

Gulp 设置