【苍穹】完美解决由于nginx更换端口号导致无法使用Websocket
一、报错信息
进行到websocket开发的过程中,遇到了前端报错,无法连接的提示:

经过F12排查很明显是服务端和客户端并没有连接成功。这里就涉及到之前的坑,现在需要填上了。
二、报错原因和推导
应该还记得刚开苍穹的第一天配置前端环境时,会发现ngnix启动不了吧?排查原因后,发现是默认的80端口被系统进程占用了,你为了方便后续的测试,将ngnix的默认端口改成了8888。
与此同时,苍穹的前端环境几乎是固定死了的,也就是有一些配置方面的东西,还是按照着80端口来的,这样一来,Websocket自然是连接不上的。
所有就衍生出下面两种解决方法
三、解决方法
1. 修改ngnix配置文件 为80端口,同时终止原先系统进程占用的80端口
修改配置文件ngnix.conf server listen 80


停用80 端口服务
C:\Users\goodboy>net stop http
下面的服务依赖于 HTTP Service 服务。
停止 HTTP Service 服务也会停止这些服务。World Wide Web 发布服务SSDP DiscoveryPrint Spooler你想继续此操作吗? (Y/N) [N]: y
World Wide Web 发布服务 服务正在停止.
World Wide Web 发布服务 服务已成功停止。
SSDP Discovery 服务正在停止.
SSDP Discovery 服务已成功停止。
Print Spooler 服务正在停止.
Print Spooler 服务已成功停止。
HTTP Service 服务已成功停止。
重启ngnix服务器
2. 一劳永逸,保持ngnix端口不变,修改前端环境信息(推荐)

在前端代码js中,先后找到app.d0aa4eb3.js 和 app.d0aa4eb3.js.map文件
打开: app.d0aa4eb3.js
查找: localhost
修改:在localhost后添加 现在你的ngnix监听的端口号
例如我的: localhost:8888

打开: app.d0aa4eb3.js.map
查找:process.env.VUE_APP_SOCKET_URL
替换成: ws://localhost:8888/ws/

四、测试
重启服务器

还是报错,考虑浏览器缓存(可以清除浏览器缓存),开一个InPrivate 浏览


成功,测试一下能否及时响应新订单:

相关文章:
【苍穹】完美解决由于nginx更换端口号导致无法使用Websocket
一、报错信息 进行到websocket开发的过程中,遇到了前端报错,无法连接的提示: 经过F12排查很明显是服务端和客户端并没有连接成功。这里就涉及到之前的坑,现在需要填上了。 二、报错原因和推导 应该还记得刚开苍穹的第一天配置前…...
Qt中在pro中实现一些宏定义
在pro文件中利用 DEFINES 定义一些宏定义供工程整体使用。(和在cpp/h文件文件中定义使用有点类似)可以利用pro的中的宏定义实现一些全局的判断 pro中实现 #自定义一个变量 DEFINES "PI\"3.1415926\"" #自定义宏 DEFINES "T…...
bash XXX.sh文件和直接运行XXX.sh的区别
区别: bash XXX.sh 明确说明使用bash作为脚本的解释器不需要文件有执行权限 XXX.sh 需要指定相关解释器。如果第一行是#!/bin/bash则使用bash,如果是#!/bin/sh,则使用sh作为解释器需要有执行权限:通过chmod x 文件名指定 注意: #!是特殊标…...
【Python机器学习】k-近邻算法简单实践——改进约会网站的配对效果
需求背景: XX一直使用约会网站寻找适合自己的约会对象,ta会把人分为3种类型: 不喜欢、魅力一般、非常有魅力 对人分类轴,发现了对象样本的以下3种特征: 1、每年获得的飞行里程数 2、玩视频游戏所耗时间百分比 3、…...
vue3前端开发-小兔鲜项目-登录组件的开发表单验证
vue3前端开发-小兔鲜项目-登录组件的开发表单验证!现在开始写登录页面的内容。首先这一次完成基础的首页按钮点击跳转,以及初始化一些简单的表单的输入验证。后期还会继续完善内容。 1:首先还是准备好login页面的组件代码内容。 <script …...
Winform上位机TCP客户端/服务端、串口通信
Winform上位机TCP客户端/服务端、串口通信 背景 日常练习,着急换工作,心态都快乱了。 工具 串口调试助手 网络调试助手 代码 客户端 using Microsoft.VisualBasic.Logging; using System.Net.Sockets; using System.Text;namespace TcpClientDem…...
Linux基础复习(二)
前言 本文介绍了一下Linux命令行基本操作及网络配置 一、 命令行提示含义 [当前用户主机名 工作目录]$ 若当前用户是root,则最后一个字符为# 否则,最后一个字符为$ 二、常用Linux命令及其解释 修改主机名 一般在创建一台主机后会使用hostname相关命…...
nginx漏洞修复 ngx_http_mp4_module漏洞(CVE-2022-41742)【低可信】 nginx版本升级
风险描述: Nginx 是一款轻量级的Web服务器、反向代理服务器。 Nginx 的受影响版本中的ngx _http_mp4_module模块存在内存越界写入漏洞,当在配置中使用 mp4 directive时,攻击者可利用此漏洞使用使用ngx_http_mp4_module模块处理特制的音频或视…...
网格布局 HTML CSS grid layout demo
文章目录 页面效果代码 (HTML CSS)参考 页面效果 代码 (HTML CSS) <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"…...
Java算法之递归算法-如何计算阶乘的值
上一篇学了递归之后,练习一下递归算法。 题目:使用递归算法计算阶乘的值,也就是5!5*4*3*2*1,直接使用循环是非常简单的,这边练习一下递归算法。 先写一下两个条件 基线条件:等于1的时候返回1…...
python爬虫入门小案例
python爬虫 以下内容仅供学习交流,请勿用作其他用途,若涉及隐私和版权问题,请及时联系我删除 闲来无事,学了学爬虫小知识,适合入门,文笔拙劣,还望见谅 爬虫是什么: 爬取网页上的文字,图片,视频,音频 自动化操作浏览器,比如填写表单,打卡,提高工作效率爬虫的注意事项: 爬虫…...
【昇腾AI创新大赛集训营南京站学习笔记】-Ascend算子开发课程
昇腾AI创新大赛训练营 14:00-14:30 基础知识-理论课 一、CANN 、达芬奇架构和算子 1.AI Core逻辑架构 达芬奇架构包含三部分: 1)计算类:矩阵计算单元(两个矩阵扔进去相乘)、向量计算单元、标量计算单元 2)控…...
系统架构设计师教程 第4章 信息安全技术基础知识-4.5 密钥管理技术4.6 访问控制及数字签名技术-解读
系统架构设计师教程 第4章 信息安全技术基础知识-4.5 密钥管理技术&4.6 访问控制及数字签名技术 4.5 密钥管理技术4.5.1 对称密钥的分配与管理4.5.1.1 密钥的使用控制4.5.1.1.1 密钥标签4.5.1.1.2 控制矢量4.5.1.2 密钥的分配4.5.1.2.1物理方式14.5.1.2.2 物理方式24.5.1…...
C语言日常练习Day13
目录 一、设半径r1.5,圆柱高h3,求圆周长、圆面积、圆球表面积、圆球体积、圆柱体积 二、编写程序,用getchar函数读入两个字符给c1,c2,然后分别用putchar函数和printf函数输出这两个字符 三、输入4个整数,要求按由小…...
map、foreach、filter这些方法你还不知道什么时候该用哪个吗?那就看过来
forEach:主要用于遍历数组并对每个元素执行某种操作,通常用于改变当前数组里的值。它不会返回新数组,而是直接在原数组上进行操作。forEach方法不支持return、break、continue等语句,因为这些语句在forEach中不会…...
6.3 面向对象技术-设计模式
设计模式 创建型模式 结构型模式...
Mac 中安装内网穿透工具ngrok
ngrok 是什么? Ngrok 是一个网络工具,主要用于在网络中创建从公共互联网到私有或本地网络中运行的web服务的安全隧道。它充当了一个反向代理,允许外部用户通过公共可访问的URL访问位于防火墙或私有网络中的web应用程序或服务。Ngrok 特别适用…...
python count返回什么
描述 count() 方法用于统计字符串中某个子字符串出现的次数,可选参数为开始搜索与结束搜索的位置索引。 语法 count() 方法语法: S.count(sub[,start0[,endlen(S)]]) 参数 sub -- 搜索的子字符串。 S -- 父字符串。 start -- 可选参数,…...
mac清理软件哪个好用免费 MacBook电脑清理软件推荐 怎么清理mac
随着使用时间的增长,mac电脑会积累一些不必要的垃圾文件,这些文件会占用宝贵的存储空间,影响电脑的运行速度和稳定性。因此,定期清理mac电脑的垃圾文件是非常有必要的。市场上有许多优秀的Mac清理软件,包括一些出色的国…...
学生党百元蓝牙耳机哪个性价比高?精选四款超强性价比耳机型号
现阶段,蓝牙耳机技术逐渐成熟,蓝牙耳机在我们的学习和娱乐中承担着很重要的角色,那么在面对众多品牌和型号中,学生党们在选择蓝牙耳机上纠结不已,到底学生党百元蓝牙耳机哪个性价比高?作为一个蓝牙耳机重度…...
Qt/C++开发监控GB28181系统/取流协议/同时支持udp/tcp被动/tcp主动
一、前言说明 在2011版本的gb28181协议中,拉取视频流只要求udp方式,从2016开始要求新增支持tcp被动和tcp主动两种方式,udp理论上会丢包的,所以实际使用过程可能会出现画面花屏的情况,而tcp肯定不丢包,起码…...
MFC内存泄露
1、泄露代码示例 void X::SetApplicationBtn() {CMFCRibbonApplicationButton* pBtn GetApplicationButton();// 获取 Ribbon Bar 指针// 创建自定义按钮CCustomRibbonAppButton* pCustomButton new CCustomRibbonAppButton();pCustomButton->SetImage(IDB_BITMAP_Jdp26)…...
Vue3 + Element Plus + TypeScript中el-transfer穿梭框组件使用详解及示例
使用详解 Element Plus 的 el-transfer 组件是一个强大的穿梭框组件,常用于在两个集合之间进行数据转移,如权限分配、数据选择等场景。下面我将详细介绍其用法并提供一个完整示例。 核心特性与用法 基本属性 v-model:绑定右侧列表的值&…...
Opencv中的addweighted函数
一.addweighted函数作用 addweighted()是OpenCV库中用于图像处理的函数,主要功能是将两个输入图像(尺寸和类型相同)按照指定的权重进行加权叠加(图像融合),并添加一个标量值&#x…...
Cloudflare 从 Nginx 到 Pingora:性能、效率与安全的全面升级
在互联网的快速发展中,高性能、高效率和高安全性的网络服务成为了各大互联网基础设施提供商的核心追求。Cloudflare 作为全球领先的互联网安全和基础设施公司,近期做出了一个重大技术决策:弃用长期使用的 Nginx,转而采用其内部开发…...
Android15默认授权浮窗权限
我们经常有那种需求,客户需要定制的apk集成在ROM中,并且默认授予其【显示在其他应用的上层】权限,也就是我们常说的浮窗权限,那么我们就可以通过以下方法在wms、ams等系统服务的systemReady()方法中调用即可实现预置应用默认授权浮…...
企业如何增强终端安全?
在数字化转型加速的今天,企业的业务运行越来越依赖于终端设备。从员工的笔记本电脑、智能手机,到工厂里的物联网设备、智能传感器,这些终端构成了企业与外部世界连接的 “神经末梢”。然而,随着远程办公的常态化和设备接入的爆炸式…...
淘宝扭蛋机小程序系统开发:打造互动性强的购物平台
淘宝扭蛋机小程序系统的开发,旨在打造一个互动性强的购物平台,让用户在购物的同时,能够享受到更多的乐趣和惊喜。 淘宝扭蛋机小程序系统拥有丰富的互动功能。用户可以通过虚拟摇杆操作扭蛋机,实现旋转、抽拉等动作,增…...
AD学习(3)
1 PCB封装元素组成及简单的PCB封装创建 封装的组成部分: (1)PCB焊盘:表层的铜 ,top层的铜 (2)管脚序号:用来关联原理图中的管脚的序号,原理图的序号需要和PCB封装一一…...
多元隐函数 偏导公式
我们来推导隐函数 z z ( x , y ) z z(x, y) zz(x,y) 的偏导公式,给定一个隐函数关系: F ( x , y , z ( x , y ) ) 0 F(x, y, z(x, y)) 0 F(x,y,z(x,y))0 🧠 目标: 求 ∂ z ∂ x \frac{\partial z}{\partial x} ∂x∂z、 …...
