Question

使用vue-cli 3，我在开发模式中有一个vue app。我打电话给npm run serve，我看......

DONE  Compiled successfully in 431ms                                                                                                                                                                   
16:26:43
App running at:
- Local:   http://localhost:8080/mobileapp/v/
- Network: http://172.18.55.202:8080/mobileapp/v/

（路径/mobileapp/v/来自baseUrl配置变量。域notilusdev.dimosoftware.com/mobileapp指向iis中的vdir，对/ mobileapp / v /的请求反向代理到webpack-dev-服务器）

在浏览器中，应用程序启动没问题。然后它开始触发https://172.18.55.202:8080/sockjs-node/info?t=1529072806971的请求。这些请求失败，因为该端口上没有ssl。我甚至不希望ip作为网站的公共地址。 Webpack（或sockjs）如何构建此URL？当它给我一个直接的http链接时，为什么它认为这个端口上有ssl？如果它基于地址栏协议的协议，为什么它忽略地址栏主机名。我可以配置什么来使这些请求成功？

Answer 1

这是一场斗争，但现在正在努力......

在vue.config中向public对象添加devServer属性。

我需要的属性是public，而不是publicPath，并且知道vue会忽略configureWebpack{ devServer: {中的配置更改。您需要使用顶级devServer属性。

所以我的工作vue.config.js是......

module.exports = {
  baseUrl: process.env.NODE_ENV === 'production'
    ? '/production-sub-path/'
    : '\/mobileapp\/v\/',
    devServer :{
      public : 'notilusdev.dimosoftware.com',
      host : '0.0.0.0',
      disableHostCheck : true
    }  
}

然后我需要通过express来反向代理https和wss：//请求，在express中终止ssl，但那是另一个故事。

Answer 2

Web套接字根据配置的URL推断架构。

您需要明确地向devServer配置提供key/cert/pem?以支持此功能。否则，它将尝试使用自签名证书，当然，在您的情况下，该证书不起作用。

devSever: {
  ...,
  key: fs.readFileSync('/path/to/server.key'),
  cert: fs.readFileSync('/path/to/server.crt'),
  ca: fs.readFileSync('/path/to/ca.pem'),
}

这将使用正确的SSL并解决您的问题。

作为旁注

您也不能仅仅决定不使用https进行websocket连接。但是，您可以完全不使用HTTPS，如果您不想这样做，只需按常规使用localhost:8081。

我该如何解决这些SockJS ssl错误？

2 个答案: