ngrok实现内网穿透,vue项目invalid host header报错

news2024/12/30 0:56:59

目的:使自己的本地的vue项目可以在外网上访问。
本地访问:http://localhost:8080/
外网访问:通过ngrok生成一个链接,这个链接在其他网络环境下都可以访问。

windows下安装
1.注册并下载ngrok,注册的时候需要验证码,有时候登不上去,用到了外网。(我用的是猎豹加速器,可以每天登录签到,有一个小时的使用时长)在这里插入图片描述

2.解压并运行exe文件

在这里插入图片描述

3.登录到ngrok中获取专属密钥
在这里插入图片描述

4.执行上面的命令,会自动创建一个配置文件ngrok.yml。
5.输入下面的命令,即将本地端口8080映射到外网中,如果需要映射其他端口,只需将8080改成相对应的端口即可。

ngrok http 8080


在这里插入图片描述

6.输入上面的网址就可以运行项目了。
参考的ngrok文章

问题:访问vue项目,页面问题
内网穿透访问Vue项目的时候,页面出现Invalid Host header
常规做法:
//在 vue.config.js文件中添加
module.exports = {
devServer: {
disableHostCheck: true
}
}

在这里插入图片描述

运行项目时报错,显示没有disableHostCheck这个属性

解决方法:
这个属性应该是被弃用了,需要换一种写法。方案链接。
将 disableHostCheck:true
替换为
historyApiFallback: true,
allowedHosts: “all”,

重新配置vue.config.js

devServer: {
historyApiFallback: true,
allowedHosts: “all”,
}

最后重新启动项目 npm run serve
打开链接,显示出项目
 

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

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

相关文章

动手学习卷积神经网络(CNN)(一)---卷积运算

卷积神经网络可以直接从原始数据中学习其特征表示并完成最终任务,可以说卷积网络是“端”到“端”的思想,在整个学习流程中并进行认为的子问题划分,而是交给深度学习模型直接学得从原始输入到期望输出得映射。 卷积神经网络是包含卷积层&…

一个BLIP2加两个ChatGPT就能造一个机器人?KAUST提出具身智能框架LLM-Brain

最近,来自阿卜杜拉国王科技大学(KAUST)的研究团队开发了一种基于现有LLMs的机器人交互框架LLM-Brain,LLM-Brain可以直接将LLM作为机器人的大脑,并以此来构建一个以自我为中心的记忆和控制框架。 论文链接: …

【笔试强训选择题】Day18.习题(错题)解析

作者简介:大家好,我是未央; 博客首页:未央.303 系列专栏:笔试强训选择题 每日一句:人的一生,可以有所作为的时机只有一次,那就是现在!!! 文章目录…

红队工具合集

一个 Red Team 攻击的生命周期,整个生命周期包括: 信息收集、攻击尝试获得权限、持久性控制、权限提升、网络信息收集、横向移动、数据分析(在这个基础上再做持久化控制)、在所有攻击结束之后清理并退出战场。 相资 信息搜集 http…

自信裸辞:一晃 ,失业都3个月了.....

最近,找了很多软测行业的朋友聊天、吃饭 ,了解了一些很意外的现状 。 我一直觉得他们技术非常不错,也走的测开/管理的路径;二三月份裸辞的,然后一直在找工作,现在还没找到工作 。 经过我的分析&#xff0…

OpenVINO 2022.3实战三:POT API实现图像分类模型 INT8 量化

OpenVINO 2022.3实战三:POT API实现图像分类模型 INT8 量化 1 准备需要量化的模型 这里使用我其他项目里面,使用 hymenoptera 数据集训练好的 MobileNetV2 模型,加载pytorch模型,并转换为onnx。 import os from pathlib import…

鸿蒙Hi3861学习十八-DevEco Device Tool环境搭建

一、简介 在之前的文章中,我们是通过在windows下烧录,在ubuntu下编译的方式进行开发。今天我们同样是采用windowsubuntu混合环境进行开发。为什么要采用这种方式呢?因为就目前而言,大部分的开发板还不支持在Windows环境下进行编译…

典型的高可用设计(二):MySQL

一、高可用模式 MySQL数据库提供了数据库建的复制能力,做到了多个数据库同时拥有同一个数据副本,保证了数据的安全性,一台数据库服务器出现问题,其他数据库可以做到数据不丢失。MySQL的服务高可用设计也是以数据库复制能力为基础&…

云计算专业怎么样,大学应届生学的话难不难?

云计算专业学起来挺难的,一般人建议不要轻易尝试!!! 虽然IT行业一直以来发展前景、技术更新、新领域的开发或者新概念的提出等各方面都还不错,云计算也是当下非常火的一个就业方向,很多人也非常想进入云计…

IT系统方案大纲模版,以智慧工地系统为例

# 咖米智慧工地解决方案 ## 第1章 智慧工地系统概述 ### 1.1应用背景 ### 1.2需求分析 ### 1.3总体目标 ## 第2章 系统总体设计 ### 2.1设计理念 ### 2.2设计依据 ### 2.3设计架构 ### 2.4系统描述 ### 2.5系统特点 ## 第3章 详细设计 ### 3.1工地远程监控子系统 #### 3.1.1需求…

一分钟了解乐观锁、悲观锁、共享锁、排它锁、行锁、表锁以及使用场景

大家好,我是冰点,今天给大家带来,关于MySQL中的锁的使用。 我首先提个问题,大家知道什么是 乐观锁、悲观锁、共享锁,、排它锁、行锁、表锁,以及每种锁的使用场景吗? !! 背景:最近在各…

Unity 使用 VSCode 作为默认编辑器,解决没有代码提示,智能补全功能

文章目录 删除现有编辑器配置选择 VSCode 作为代码编辑器代码补全和智能提示 删除现有编辑器配置 首先打开你的项目文件夹,需要把这几个文件删掉,稍后重新生成~ 选择 VSCode 作为代码编辑器 打开 Edit - Preference: 选择 External Script…

【bsauce读论文】2023-SP-内核Use-After-Cleanup漏洞挖掘与利用

本文参考G.O.S.S.I.P 阅读推荐 2023-01-06 UACatcher做一些补充。 1. UAC漏洞介绍 UAC漏洞介绍:Use-After-Cleanup (UAC)漏洞类似UAF,本文主要检测Linux内核中UAC漏洞。UAC基本原理参见图Fig-1。首先,UAC漏洞和系统中…

众多行业适用的这款Lighthouse Apex Z便携粒子计数器有什么优势

Lighthouse Apex Z粒子计数器围绕易用性和可靠性进行构建。是建立在Lighthouse洁净室行业 40 多年的基于问题的学习基础上的解决方案。 采样设置 ApexZ易于使用的样品设置,可以匹配当前的sop,减少丢失位置或采样错误参数的风险。 用户管理 为了提高效…

ES6:var 、const、let的使用和区别

前言 本文主要介绍了ES6中var、const、let的使用和区别 基本介绍 let let声明变量 const const :声明常量const声明的常量可以修改,但不能重新赋值 如:以下代码是正确的: //引用数据类型 const info {name:Candy }; info.nameJune;而下面的代码是…

GPT-4国内有免费平替吗?

免费/平替永远是最贵的 就如同我们生活中买口红一样,总想找到平替,但永远比不上看中的那只! 但在寻找平替过程中 花出去的时间、金钱成本都是翻倍的。 那么GPT-4呢? GPT-4优于GPT-3.5闪光点,想必大家都十分清楚 不…

基于springboot自动排课系统

末尾获取源码 开发语言:Java Java开发工具:JDK1.8 后端框架:SpringBoot 前端:Vue 数据库:MySQL5.7和Navicat管理工具结合 服务器:Tomcat8.5 开发软件:IDEA / Eclipse 是否Maven项目:…

云计算安全

前言 什么是云计算? 云计算就是一种新兴的计算资源利用方式,云计算的服务商通过对硬件资源的虚拟化,将基础IT资源变成了可以自由调度的资源池,从而实现IT资源的按需分配,向客户提供按使用付费的云计算服务。用户可以…

帽子设计作品——蒸汽朋克的乌托邦,机械配件的幻想世界!

蒸汽朋克是由蒸汽steam和朋克punk两个词组成, 蒸汽代表着以蒸汽机作为动力的大型机械,而朋克则代表一种反抗、叛逆的精神。 蒸汽朋克的作品通常以蒸汽时代为背景,通过如新能源、新机械、新材料、新交通工具等新技术,使画面充满想…

基于OpenCV和PyQt5的跳远成果展示程序

基于OpenCV和PyQt5的跳远成果展示程序 近年来,体育运动越来越受到人们的关注,其中跳远是一项备受瞩目的运动项目。为了更好地展示运动员的跳远成果,本文将介绍一种基于OpenCV和PyQt5的跳远成果展示程序实现方法。 本文的跳远成果展示程序主…