javascript 使用Webpack-dev-middleware对Express.js配置示例,以允许后端身份验证。

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript 使用Webpack-dev-middleware对Express.js配置示例,以允许后端身份验证。相关的知识,希望对你有一定的参考价值。

/**
 * Created by Phil on 02/23/17.
 */
// BASE SETUP
// ================================================================================================
// Imports
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const path = require('path');
const https = require("https");
const fs = require("fs");
let request = require("request");
const webpackDevMiddleware = require("webpack-dev-middleware");
const webpack = require("webpack");
const webpackConfig = require("./webpack.config");

// Webpack
const compiler = webpack(webpackConfig);

// Instructs request to save cookies
request = request.defaults({jar: true});

// Setup SSL
const key_file   = "privatekey.pem";
const cert_file  = "certificate.pem";
const config     = {
    key: fs.readFileSync(key_file),
    cert: fs.readFileSync(cert_file)
};

const router = express.Router(); // get an instance of the router
const port = process.env.PORT || 8282;
const ssl_port = process.env.PORT || 8223;
// WARNING: this is really insecure, and is only for local testing
// http://stackoverflow.com/questions/10888610/ignore-invalid-self-signed-ssl-certificate-in-node-js-with-https-request
process.env.NODE_TLS_REJECT_UNAUTHORIZED = "0";

// Login dev or test
const loginUriEnv = process.argv[4] !== undefined ? process.argv[4] : 'test';
const uriPrefix = 'https://server-' + loginUriEnv + '.com/';
const loginUri = uriPrefix + 'pkmslogin.form?token=Unknown';
request({
    method: 'POST',
    uri: loginUri,
    form: {
        'username': process.argv[2],
        'password': process.argv[3],
        'isubmit': 'Sign+In',
        'login-form-type': 'pwd'
    }
}, function(error, response, body) {
    if(!error && response.statusCode == 200) {
        console.log('Successfully signed-in in: ' + loginUriEnv);
    }
});

// Router definition
router
    .get(/^\/api*/, function(req, res) {
        request(uriPrefix + req.originalUrl).pipe(res);
    })
    .post(/^\/api*/, function(req, res) {
        request.post({
            headers: {'content-type': 'application/json; charset=utf-8'},
            url: uriPrefix + req.originalUrl,
            body: JSON.stringify(req.body)
        }, function(error, response, body) {
            res.write(body);
            res.end();
        });

    });

app.use(bodyParser.json());
app.use(express.static(__dirname + '/bower_components'));
app.use(express.static(__dirname + '/'));

// REGISTER OUR ROUTES
app.get('/app', function(req, res) {
    res.sendFile('index.html', { root: path.join(__dirname, '.') });
});
app.use(webpackDevMiddleware(compiler, {
  publicPath: "/app" // Same as `output.publicPath` in most cases.
}));
app.use('/', router);

// START THE SERVER
// ================================================================================================
https.createServer(config,app).listen(ssl_port, "localhost");
console.log("Browse to: https://localhost:8223/app");

以上是关于javascript 使用Webpack-dev-middleware对Express.js配置示例,以允许后端身份验证。的主要内容,如果未能解决你的问题,请参考以下文章

webpack配置

万字长文解密webpack-基本使用/高级用法/性能优化 你想要的全都有!!!

vue.js环境搭建踩坑记

webpack-dev-server和webpack-dev-middleware的区别

Vue axios调用第三方接口跨域解决

'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序