vue 项目如何用nginx反向代理WebSocket请求地址

原因

在VUE项目中使用WebSocket时，是将IP与端口进行固定，但是当环境地址发生变更时，就需要在代码中进行修改，并重新打包发布版本，很是麻烦，当然这样也是不可取的。因此使用nginx反向代理WebSocket就可以解决这个问题。

VUE项目代码片段

<script>
    export default {
        data(){
            return {
                webSocket: null
            }
        },
        mounted(){
            this.initWebSocket();
        },
        methods:{
            initWebSocket(){
                let vm = this;
                let wsServer = `${location.protocol === 'https' ? 'wss' : 'ws'}://${location.host}/websocket`;
                vm.webSocket = new WebSocket(wsServer);
                vm.webSocket.onopen = function(event) {
				    
                };
                vm.webSocket.onmessage = function(msg) {
				    
                };
                vm.webSocket.onClose = function(msg) {