通过内网穿透免费部署我们的springboot+vue项目 实现跟服务器一样的效果

前文讲到通过内网穿透能够实现远程访问个人电脑的静态资源。本文将讲解通过内网穿透实现远程访问本地的项目,实现跟部署到服务器一样的效果:前文链接:通过内网穿透实现远程访问个人电脑资源详细过程(免费)(NatApp + Tomcat)-CSDN博客

如果遇到tomcat启动闪退问题可以查看博主的:Tomcat 启动闪退问题-CSDN博客

目录

前言

1. 后端SpringBoot项目

1.1 将springboot项目打成war包

 1.2 部署到本地的tomcat

2.1 打包Vue项目并完成内网穿透


前言

        既然能够通过内网穿透访问到本地的静态资源,那么就能够通过内网穿透访问到本地的运行的项目。

 友情提示:最好看一下之前的文章:通过内网穿透实现远程访问个人电脑资源详细过程(免费)(NatApp + Tomcat)-CSDN博客

1. 后端SpringBoot项目

1.1 将springboot项目打成war包

        在打包之前要对我们的pom.xml文件进行修改,首先要设置打包格式,设置成war,因为默认是打成jar包

<packaging>war</packaging>

        之后要移除springboot自带的tomcat容器,因为后续是使用到外部的tomcat容器(注意:我们移除之后springboot项目就不能够正常启动了,所以我们必须要注视掉才能正常启动,打包的时候在取消注释)

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
<!--            移除自带的tomcat-->
            <exclusions>
                <exclusion>
                    <groupId>org.springframework.boot</groupId>
                    <artifactId>spring-boot-starter-tomcat</artifactId>
                </exclusion>
            </exclusions>
        </dependency>

        因为我们移除了tomcat容器会少一个servlet-api的一个依赖,所以我们必须引入以下

<!--        移除tomcat容器会缺少servlet依赖-->
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <scope>provided</scope>
        </dependency>

        接下来还需要对我们的主要启动类进行修改

@SpringBootApplication
public class Application extends SpringBootServletInitializer {

    @Override
    protected SpringApplicationBuilder configure(SpringApplicationBuilder application) {
        return application.sources(Application.class);
    }

    public static void main(String[] args) {
        SpringApplication.run(Application.class,args);
    }
}

        

        接下来就来到了打包环节,点击右侧的maven选项,选择lifecycle,点击clean(清除target),完成之后在点击install(确认依赖成功下载),最后点击package(打包)

 

 1.2 部署到本地的tomcat

        找到我们的war包,将其复制到tomcat的webapps目录下

        可以对war进行一个重命名,可以命名短一点,我这里重命名为light,然后将其解压。解压之后light目录结构如下:

        解压之后就可以删除war包了。

        我们接下来进行测试,查看通过tomcat能否正常启动我们的springboot项目。

        打开tomcat的bin目录,在该目录输入cmd打开控制台输入startup命令启动tomcat。

        正常启动!!!在浏览器输入localhost:tomcat端口号,我tomcat的端口号是3000(默认为8080),如果想要访问到我们的springboot项目,就需要带上我们刚刚解压的路径名称,比如我这里的light项目的访问路径为:localhost:3000/light 

 需要注意的是:tomcat的服务器的端口会覆盖springboot项目的端口,所以springboot项目的端口号是没有作用的,我们访问项目是通过他在tomcat的文件夹名称来访问的,包括你设置的项目名称都是没用的,一切以tomcat的文件名称为准

        我springboot项目有如下的controller

@RestController
@RequestMapping("/test")
public class TestController {

    @GetMapping("/getstr")
    public String test(){
        return "hello world";
    }
}

        所以我们通过访问该路径来测试是否部署成功,是否能够访问到:输入以下路径:

localhost:3000/light/test/getstr

        成功访问到!!!

2.1 通过内网穿透远程访问到后端项目

        启动NatApp,(具体内容参考我上一篇博客:通过内网穿透实现远程访问个人电脑资源详细过程(免费)(NatApp + Tomcat)-CSDN博客)

        

         在浏览器中输入:网址+/light/test/getstr, 能够访问到!!!就算是其他电脑/手机设备都能够访问到,这就实现了将springboot部署到服务器一样的效果

2.1 打包Vue项目并完成内网穿透

        在打包Vue项目的全过程中千万不要将natapp给停止了,因为使用的是免费隧道,每次重新打开我们natapp提供的网址就会变换,一变化就需要修改Vue项目的请求路径

        在打包Vue项目之前,需要修改前端向后段发送ajax/axios请求的路径,因为我们后端的地址已经变成了 http://bs9p3v.natappfree.cc/light 而不再是127.0.0.1:8088/app 这种本地访问路径了

        

        然后前端还需要设置一个东西,就是开启其他ip地址访问项目的配置

disableHostCheck:true

        在vue项目的根路径下执行npm run build命令对vue项目进行打包,会在根目录下生成一个dist文件夹,就是我们打包后的文件(dist文件夹就跟我们war解压之后是一样的效果,都是编译之后的内容)

        在tomcat的webapps的文件夹中新建一个front文件夹用来存放dist文件夹中的内容

        将dist文件夹中的所有内容直接复制到webapps下的front文件夹

        然后重启我们本地的tomcat(千万不要把natapp停止了):直接关掉tomcat的命令窗口,重新进入tomcat的bin目录下,打开cmd控制台输入startup命令运行tomcat即可

        成功启动tomcat之后,就来测试能否访问到我们的vue项目,以及vue项目能否向后端发送请求,在浏览器输入: http://bs9p3v.natappfree.cc/front。

        因为是免费的隧道,所以可能比较慢。

        成功访问到。并且也能够正常的向后端发送请求!!

       至此我们就通过内网穿透实现了将项目部署到服务器一样的效果了(用完之后记得将natapp关闭了

鸟欲高飞先振翅,人求上进先读书。——名言出处:李苦禅

        

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

物联网设计竞赛_2_Ubuntu联网配置

采用nat配置 随便定义一个VMnet虚拟网络接口&#xff0c;定义成nat模式 如果主机用的校园网&#xff0c;那么虚拟机发送消息将通过nat转换&#xff0c;转换成用户校园网ip进行发送&#xff0c;发送到校园网路由器再经过nat转换成公网ip访问互联网 点击NAT设置和DHCP设置记录好…

桥梁监控可视化大屏:现代桥梁管理的必备呀。

桥梁监控上可视化有几个重要的原因&#xff1a; 01.实时监控&#xff1a; 可视化的监控系统可以实时显示桥梁的各项监测数据&#xff0c;包括结构变形、振动、温度等&#xff0c;使监控人员能够实时了解桥梁的状态&#xff0c;及时发现异常情况并采取相应的措施。 02.数据分析…

XYCTF - web

目录 warm up ezMake ezhttp ezmd5 牢牢记住&#xff0c;逝者为大 ezPOP 我是一个复读机 ezSerialize 第一关 第二关 第三关 第一种方法&#xff1a; 第二种方法&#xff1a; ez?Make 方法一&#xff1a;利用反弹shell 方法二&#xff1a;通过进制编码绕过 ε…

ChatGPT Reply功能五大使用场景详细解析!

大家好&#xff0c;我是木易&#xff0c;一个持续关注AI领域的互联网技术产品经理&#xff0c;国内Top2本科&#xff0c;美国Top10 CS研究生&#xff0c;MBA。我坚信AI是普通人变强的“外挂”&#xff0c;所以创建了“AI信息Gap”这个公众号&#xff0c;专注于分享AI全维度知识…

课堂练习——路由策略

需求&#xff1a;将1.1.1.0/24网段重发布到网络中&#xff0c;不允许出现次优路径&#xff0c;实现全网可达。 在R1上重发布1.1.1.0/24网段&#xff0c;但是需要过滤192.168.12.0/24和192.168.13.0/24在R2和R3上执行双向重发布 因为R1引入的域外路由信息的优先级为150&#xff…

Linux文件管理指令-001

一、文件目录 1ls ls 查看文件和目录 - a 显示指定目录下所有子目录与文件&#xff0c;包括隐藏文件 - t 显示时按修改时间(很近优先)而不是按名字排序。若文件修改时间相同&#xff0c;则 按字典顺序 - R 递归式地显示指定目录的各个子目录中的文件 - r 按字母逆序或很早…

Leetcode—946. 验证栈序列【中等】

2024每日刷题&#xff08;133&#xff09; Leetcode—946. 验证栈序列 实现代码 class Solution { public:bool validateStackSequences(vector<int>& pushed, vector<int>& popped) {int left 0;for(int i 0; i < popped.size(); i) {while(left &…

璩静事件,后生可畏

时下网络上沸沸扬扬的璩静事件&#xff0c;笔者认为这应当是事先策划好的&#xff0c;为她自己的新公司扩大声势的一种炒作方式。聪明而胆大。年轻人&#xff0c;尤其是年轻女性&#xff0c;让人深感“后生可畏”。 来百度APP畅享高清图片 【附件】 《百度副总裁璩静言论引争…

Windows 查找端口号关闭端口号关闭进程的操作流程

Windows 查找端口号关闭端口号关闭进程 8000为端口号 1.查看端口占用程序的ID号 netstat -aon|findstr "8000"比如结果是5684 2.查看ID对应的程序进程 tasklist|findstr "6884"3.关闭进程 taskkill -PID 6884 -F成功: 已终止 PID 为 5684 的进程。

深入理解C++中的Vector容器:用容器构建高效程序

文章目录 vector介绍vector常用的成员函数有关vector定义的函数vector的迭代器使用vector关于空间操作的成员函数vector的增删查改 总结 vector介绍 在C语言的库中包含有公共数据结构的实现&#xff0c;C的这个部分内容就是众所周知的STL&#xff08;标准模版库&#xff09;&a…

【递归、回溯和剪枝】全排列 子集

0.回溯算法介绍 什么是回溯算法 回溯算法是⼀种经典的递归算法&#xff0c;通常⽤于解决组合问题、排列问题和搜索问题等。 回溯算法的基本思想&#xff1a;从⼀个初始状态开始&#xff0c;按照⼀定的规则向前搜索&#xff0c;当搜索到某个状态⽆法前进时&#xff0c;回退到前…

可视化大屏:城市治理方向,三维地图那是相当震撼呀。

随着城市化进程的加快&#xff0c;城市治理变得越来越复杂&#xff0c;需要大量的数据和信息来支持决策和管理。在这个背景下&#xff0c;可视化大屏作为一种新兴的信息展示工具&#xff0c;正逐渐在城市治理中发挥着重要作用。 首先&#xff0c;可视化大屏能够将庞大的数据和信…

Linux常用软件安装(JDK、MySQL、Tomcat、Redis)

目录 一、上传与下载工具Filezilla1. filezilla官网 二、JDK安装1. 在opt中创建JDK目录2.上传JDK压缩文件到新建目录中3.卸载系统自代jdk4.安装JDK5.JDK环境变量配置6. 验证是否安装成功 三、安装MySQL1.创建mysql文件夹2.下载mysql安装压缩包3.上传到文件夹里面4. 卸载系统自带…

【数据结构(邓俊辉)学习笔记】二叉树01——二叉树表示与实现

文章目录 0.概述1.树1.1 应用1.2 有根树1.3 有序树1.4 路径环路1.5 深度 层。1.6 树的表示 2. 二叉树的概述3 二叉树实现3.1 二叉树节点3.2 二叉树节点操作接口3.3 二叉树的实现 0.概述 介绍下二叉树的表示与实现。 1.树 1.1 应用 后缀表达式。 相对于线性结构O&#xff08…

完美解决Windows10下-更换JDK环境变量后,在cmd下执行仍java -version然出现原来版本的JDK的问题

一、错误场景预演 本人欲将 JDK 1.8 通过安装包的方式升级为 JDK 22。 本地旧版本&#xff1a;1.8.0_221预升级版本&#xff1a;22.0.1 1.1、查看本地旧版本 在配置环境变量之前&#xff0c;首先我们要明确&#xff0c;本地存在旧版本&#xff0c;如果本地没有 Java&#x…

【本地部署及云化部署】

文章目录 本地部署及云化部署介绍 文章目录 文章目录一、本地部署模式二、云化部署模式总结 一、本地部署模式 需建设专业化机房&#xff0c;系统应用、前端软件全部安装到本地服务器上。需要专业的IT、网络安全、DBA、电气化工程师进行维护。近些年勒索病毒安全事件频发&am…

命令重装Linux系统,无需登录控制面板

命令重装Linux系统&#xff0c;无需登录控制面板 部分无法登录控制面板使用这个脚本 自动安装安装脚本 wget https://lyvba.com/auto.sh bash auto.sh -d 12 -v 64 -a -p $passwd \--mirror https://mirrors.ustc.edu.cn/debian/安装命令参考 # 自动安装 Debian 10 buster …

《基于GNU-Radio和USRP的雷达通信系统的实现》文献阅读

文章目录 前言一、摘要二、引言三、联合系统实施1、基本原理2、实验方案 四、软件设置1、发射机2、接收机 五、实验结果1、实验设置2、波形3、室内外对比4、不同参数的结果 六、结论七、参考文献八、论文自取九、阅读收获 前言 本文记录《基于GNU-Radio和USRP的雷达通信系统的实…

Linux下的常用基本指令

基本指令 前言一、ls 指令语法功能常用选项举例注意要点关于拼接关于 -a关于文件ls与/的联用ls与根目录ls与任意文件夹ls与常用选项与路径 ls -d与ls -ldls与ll 二、pwd命令语法功能常用选项注意要点window与Linux文件路径的区别家目录 三、cd 指令语法功能举例注意要点cd路径.…

论文AI率:检测原理是什么?该如何降低论文AI率?

我是娜姐 迪娜学姐 &#xff0c;一个SCI医学期刊编辑&#xff0c;探索用AI工具提效论文写作和发表。 上一篇介绍了10个检测AI率的在线工具。本篇来说说AI率到底是如何检测出来的&#xff1f;该如何有效降低论文的AI率&#xff1f; 和AI大模型一样&#xff0c;AI检测的核心也是…