解决vue 2.6通过花生壳ddsn(内网穿透)实时开发报错Invalid Host header和websocket

请先核对自己的vue版本,我的是2.6.14,其他版本未测试

起因

这两天在维护一个基于高德显示多个目标(门店)位置的项目,由于高德要求定位必须使用https服务,遂在本地无法获取到定位坐标信息,于是就想着通过内网穿透的方式临时搭一个测试站进行实时更新开发,于是就有了今天遇到的问题,那就是在本地运行vue前端没有任何问题,但是一旦将本地dev跑起来的项目通过ddns开放出去线上访问就报错了,错误信息如下

1.报错Invalid Host header

首先本地编译没有遇到任何问题,本地也能通过127.0.0.1:8080访问,但是线上就报错Invalid Host header,于是各种折腾当我解决这个问题后又遇到下面一个问题(对了解决这个问题必须谷歌访问,采用火狐访问会遇到如下1.1的问题)
在这里插入图片描述

1.1 火狐遇到The operation is insecure.

在这里插入图片描述

遇到这个问题网络上也找不到解决方案,就换了谷歌浏览器,发现报错如下 2号报错信息

2.报错

在这里插入图片描述

统一解决方案如下:

在vue.config.js中调整devServer的内容,添加allowedHosts: “all”,忽略host验证,和 webSocketServer: false , 关闭热重载即可解决,解决这个问题的时候搜索了很多资料,网络上都是各种复制粘贴说什么hot:false的有,说什么inline:false的有,这个在我这边直接跑dev都报错,后来在github上看到一个大佬的解答说webpack4要写成 allowedHosts: “all”,什么的,后来遇到websocket报错想的是直接禁用这个就可以了,但是问题是他是怎么来的,配置里面该怎么写网络上没有找到一丝丝关于这个的答案,搜索到的大多都是说websocket在js里面是怎么用的,后来看到dev报错里面有一个webSocketServer选项,给了我启发,问题得以解决,这里分享出来供大家参考

	devServer: {allowedHosts: "all",webSocketServer: false ,proxy: {xxxxx},}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/640951.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

JVM实战篇:GC调优

目录 一.GC调优的核心指标 1.1吞吐量(Throughput) 1.2延迟(Latency) 1.3内存使用量 二.GC调优的方法 2.1监控工具 Jstat工具 VisualVm插件 Prometheus Grafana 2.2诊断原因 GC日志 GC Viewer GCeasy 2.3常见的GC模…

手把手教你开发第一个HarmonyOS (鸿蒙)移动应用

⼀、移动应⽤开发的介绍 移动应⽤开发: AndroidIOSHarmonyOS (鸿蒙) ⼆、HarmonyOS介绍 文档概览-HarmonyOS应用开发官网 2.1 系统的定义 2.1.1 系统的定位 HarmonyOS有三⼤特征: 搭载该操作系统的设备在系统层⾯融为⼀体、形成超级终…

opencv#27模板匹配

图像模板匹配原理 例如给定一张图片,如上图大矩阵所示,然后给定一张模板图像,如上图小矩阵。 我们在大图像中去搜索与小图像中相同的部分或者是最为相似的内容。比如我们在图像中以灰色区域给出一个与模板图像尺寸大小一致的区域,…

CRM的定义、功能,以及国内外CRM系统排名

什么是客户关系管理? CRM是(客户关系管理)的缩写,是一个管理与客户关系的系统。CRM的主要功能是管理基本客户信息和购买历史的客户管理、分析潜在客户和新客户的客户分析、对询问的自动回复的响应以及通过电子邮件通讯和研讨会吸引客户。它是加强和维护与客户和潜…

opencv#30 线性滤波

均值滤波原理 均值滤波步骤 Step1:求和。 Step2:计算平均值。 所谓均值滤波,就是求平均值的意思。我们假设在一个3*3的范围内有一个图像,其中这个图像每一个像素可能含有噪声,也可能不含噪声,我们是不知道的,因此通…

持续集成工具Jenkins的使用之配置篇(二)

上一篇 :持续集成工具Jenkins的安装配置之安装篇(一)-CSDN博客 接上文 三.Jenkins配置 Jenkins配置主要是针对创建构建任务前做的一些基本配置,这些配置有些是必须的,有些是可以帮我们提高效率的,总之都是Jenkins管理员都要会的…

从物联网看智慧文旅的未来:技术与实践的完美结合,重塑旅游体验的新篇章

一、物联网技术:智慧文旅的基石 随着科技的飞速发展,物联网技术已经深入到我们生活的方方面面,尤其在智慧文旅领域,物联网技术更是起到了不可或缺的作用。它如同智慧文旅的基石,为旅游行业带来了前所未有的创新和变革…

VRRP6协议--负载均衡配置

VRRP6负载均衡 VRRP6负载均衡指的是创建多个备份组,多个备份组同时承担数据转发的任务,对于每一个备份组,都有自己的Master和若干Backup设备。 VRRP6负载分担与VRRP6主备备份的基本原理和报文协商过程都是相同的。同样对于每一个VRRP6备份组,都包含一个Master设备和若干Ba…

统计中集中趋势的衡量标准

一、说明 统计中的中心趋势是用于表示大量数值数据的中间值或中心值的数值。这些获得的数值在统计学中称为中心值或平均值。 任何统计数据或序列的中心值或平均值是代表整个数据或其相关频率分布的变量的值。这样的值具有重要意义,因为它描绘了整个数据的性质或特征…

针对特定领域较小的语言模型是否与较大的模型同样有效?

经过2023年的发展,大语言模型展示出了非常大的潜力,训练越来越大的模型成为有效性评估的一个关键指标,论文《A Comparative Analysis of Fine-Tuned LLMs and Few-Shot Learning of LLMs for Financial Sentiment Analysis》中,作…

阿里云 SAE 2.0 正式商用:极简易用、百毫秒弹性效率,降本 40%

作者:黛忻 本文主要介绍阿里云 Serverless 应用引擎(以下简称 SAE )如何帮助企业跨越技术鸿沟,从传统应用架构无感升级到 Serverless 架构,以更高效、更经济的方式进行转型,快速进入云原生快车道&#xff0…

【Android】TypedArray的使用

介绍 看电池电量组件BatteryMeterView的时候看到的。 Array是个数组,所有TypedArray也是个容器,基本是用于自定义View里面的(至少我目前见过的全部都在自定义View里面)。 使用 1.自定义View public class RoundSeekbarView e…

【深度学习】BasicSR训练过程记录,如何使用BasicSR训练GAN

文章目录 两种灵活的使用场景项目结构概览简化的使用方式 项目结构解读1. 代码的入口和训练的准备工作2. data和model的创建2.1 dataloader创建2.2 model的创建 3. 训练过程 动态实例化的历史演进1. If-else判断2. 动态实例化3. REGISTER注册机制 REGISTER注册机制的实现1. DAT…

嵌入式基础知识-测试基础概念

本篇来介绍嵌入式项目开发中,软件测试的相关基础知识。 1 测试基础知识 测试是指:在规定的条件下对程序进行操作,以发现错误,对软件质量进行评估 测试的对象包括程序、数据和文档 对于测试,并不是只有测试人员才需…

读AI3.0笔记04_视觉识别

1. 两次飞跃 1.1. ConvNets是当今计算机视觉领域深度学习革命的驱动力 1.1.1. 20世纪80年代便由法国计算机科学家杨立昆提出,而他则是受到了福岛邦彦提出的神经认知机(Neocognitron)的启发 1.2. ImageNet竞赛被看作计算机视觉和人工智能进…

Docker 配置 Gitea + Drone 搭建 CI/CD 平台

Docker 配置 Gitea Drone 搭建 CI/CD 平台 配置 Gitea 服务器来管理项目版本 本文的IP地址是为了方便理解随便打的,不要乱点 首先使用 docker 搭建 Gitea 服务器,用于管理代码版本,数据库选择mysql Gitea 服务器的 docker-compose.yml 配…

Kubernetes(K8S)拉取本地镜像部署Pod 实现类似函数/微服务功能(可设置参数并实时调用)

以两数相加求和为例,在kubernetes集群拉取本地的镜像,实现如下效果: 1.实现两数相加求和 2.可以通过curl实时调用,参数以GET方式提供,并得到结果。(类似调用函数) 一、实现思路 需要准备如下的…

分布式websocket IM聊天系统相关问题问答【第九期】

前言 上期视频讲解了自己关于聊天系统的设计的时候出现了一些不一样的声音。不了解情况的可以看上上期视频。这期主要是讨论。IM聊天系统设计方案多。我的先说明一下自己的技术背景互相之间才能更好的理解。 本期对应视频 目前已经写的文章有。并且有对应视频版本。 git项目地…

FPGA中跨时钟域传数据——(1)单bit脉冲

FPGA中跨时钟域传数据——(1)单bit脉冲 亚稳态模型由快时钟传到慢时钟由慢时钟传到快时钟 亚稳态模型 必须在建立时间和保持时间内,数据不变化,否则会产生亚稳态。 由快时钟传到慢时钟 在快时钟里面进行数据展宽(…

牛客周赛 Round 20 解题报告 | 珂学家 | 状压DP/矩阵幂优化 + 前缀和的前缀和

前言 整体评价 这场比赛很特别,是牛客周赛的第20场,后两题难度直线飙升了。 前四题相对简单,E题是道状压题,历来状压题都难,F题压轴难题了,感觉学到了不少。 A. 赝品 先求的最大值 然后统计非最大值的个…