javascript - 使用 SSL 运行 vuejs 开发服务器(通过 HTTPS 提供服务)

标签 javascript node.js ssl vue.js

重要细节和解决方法:我遇到过这个:“Deprecating Powerful Features on Insecure Origins

这说明 HTTPS 是在外部主机上强制执行的。我的笔记本电脑上有我的开发环境,周末我通过 SSH 进入那个盒子,这就是我昨天遇到这个问题的原因。我在笔记本电脑上远程运行 vuejs 开发服务器,让它监听 0.0.0.0 并在我的桌面上打开页面。这导致了问题。

我试过使用 SSH 端口转发到 localhost。这行得通并且是我可以接受的解决方法。

原始问题仍然有效。我暂时将其打开。


我正在使用需要 SSL (WebRTC) 的 JS API。所以要进行开发,我需要通过 HTTPS 运行开发服务器。我如何使用 vuejs 做到这一点?

我已经使用 webpack 快速启动了这个项目。我找到了一些解释如何通过 SSL 运行 webpack-dev-server 的链接,但我不知道如何使用 vuejs 应用程序来做到这一点。考虑到 JavaScript 和 NPM 的一切,我非常环保。 webpack 链接都提到了配置文件,但我的项目中没有这样的文件。我看到的最接近的是“main.js”,但那里绝对没有任何配置。

本质上,我所拥有的是以下步骤的结果:

mkdir demo
cd demo
npm install --save-dev vue-cli
./node_modules/.bin/vue init vuetifyjs/webpack-advanced demo

# Use the defaults here (except for "Vue build" I used "Runtime-only")

cd demo
npm install
npm run dev  # <-- This is the command I would like to use SSL in

最佳答案

我不知道你是否还有这个问题,或者其他人是否仍然遇到这个问题,但我找到了解决方案。

按照上面的说明在您的工作文件夹中生成一个 openssl key 和证书。

/node_modules/webpack-dev-server/bin/webpack-dev-server.js 中更改此行:

 key: {

    type: 'string',

    describe: 'Path to a SSL key.',

    group: SSL_GROUP

  },

  cert: {

    type: 'string',

    describe: 'Path to a SSL certificate.',

    group: SSL_GROUP

  },

到:

key: {

    type: 'string',

    describe: fs.readFileSync('key.pem'),

    group: SSL_GROUP

  },

  cert: {

    type: 'string',

    describe: fs.readFileSync('cert.pem'),

    group: SSL_GROUP
  },

然后设置

argv.https = true;

这就是让我的代码从 https 提供服务所要做的一切。

请注意,命令行仍将显示为 http://localhost:8080 ,但是当你在浏览器中使用https时,你的应用会在浏览器发出警告后显示

关于javascript - 使用 SSL 运行 vuejs 开发服务器(通过 HTTPS 提供服务),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46864785/

相关文章:

javascript - 如何在 React Hooks 中使用 setTimeout 更新状态值?

javascript - 访问 jQuery 返回值

node.js - 与 socket.io 的匹配 - 依赖 setInterval 或套接字调用?

node.js - Node Express "favicon.ico"未找到错误

facebook - 在 Facebook 上开发应用程序时的自签名 SSL 证书

java - 如何忽略 Apache HttpComponents HttpClient 5.1 中的 SSL 证书错误

mysql - MySql SSl 连接问题

javascript - 如何在 JavaScript 中序列化一个文件?

javascript - 无法使用 TypeScript 和 Require.JS 引用对象

javascript - 在 Heroku Node.js/Express 应用程序上禁用 HTTPS