宝塔面板原理?面板接线

如何使用宝塔面板部署Vue+Springboot前后端分离

前言

在深入探讨如何使用宝塔面板部署 Vue+Springboot前后端分离的过程中,我遇到了一些挑战,也从其他博主的分享中汲取了经验。若依管理系统是一个开源、免费的学习资源,提供了成熟的 Springboot框架。对于服务器部署前端的初学者来说,这是一个实用的起点。在尝试使用宝塔面板部署 Vue+Springboot前后端分离时,我遇到了一些问题,尤其是无法直接使用宝塔面板的前后端分离功能,原因可能与使用Apache服务器有关。

后端部署

在深入解决这个问题之前,我先要分享一个关键点:无法使用宝塔面板的前后端分离功能,因为宝塔面板提示前后端分离不支持Apache。为了解决这个问题,我尝试了不使用前后端分离的方法,这与直接使用命令行运行jar文件的原理类似,只是在宝塔面板中操作。

首先,确保在服务器上建立的数据库配置与后端配置文件(application-druid.yml)中的内容一致。打包项目时,通常有两种方式:jar和war,而若依框架默认打包的是jar文件。

为了进行正确的部署,遵循以下步骤:

确认数据库表和密码与后端配置文件相匹配。反复检查这些配置信息。

使用cd命令进入bin目录,运行clean.bat(如果之前没有打包过,可以跳过这一步,但建议执行)。

运行package.bat,等待打包完成。打包成功后,你将在target文件夹下找到.jar结尾的文件。

将生成的.jar文件上传到服务器中,然后使用cmd运行窗口执行该文件来启动服务。

确保后端端口开放,若依默认使用8080端口。可以使用公网IP+8080的方式访问。

选择路径后,将项目路径上传打包好的.jar文件,并确保端口设置正确。接下来,为后端选择一个域名并提交部署。

前端部署

部署前端之前,需要理解网站通过域名访问而非IP访问的原理。在实际部署中,我们需要建立网站并配置域名。由于当前环境仅支持二级域名,我使用了IP+端口进行访问。

在宝塔面板中添加站点,设置域名、根目录、数据库,最后提交以创建网站。为了使用二级域名,我在URL中加入了IP和端口号。

在网站目录下,通常会有一个运行目录,用于存放前端打包后的文件。若将dist文件夹放在网站目录下,运行目录应设置为"/dist";若将文件内容直接放置在网站目录下,则运行目录应设置为"/"。

在前端部署中,关键步骤包括调整前端环境配置、设置正确的publicPath,并确保前端页面能够正确访问后端服务。使用 Vue2后台管理系统模板时,调整src文件夹下的setting.js文件以匹配后端部署的环境配置。

确认vue.config.js文件中的publicPath是否正确,并在必要时修改。在缺少setting.js文件的情况下,直接在代码中插入相关配置。最后,执行npm run build:prod命令进行生产环境打包,并将dist文件上传到服务器中。

完成上述步骤后,通过IP地址+端口即可访问到前端页面。

宝塔nginx 配置地址不区分大小写

前言:在操作网站演示时,发现网址目录小写打不开,大写却能正常访问。朋友对此表示不解,网站为何区分大小写?需深入研究网站配置原理。

一、网站路径区分大小写吗?

网址结构一般包含协议、域名和路径。协议与域名部分不区分大小写,服务器自动识别。路径部分是否区分大小写则依赖于网站后台实现。Linux文件系统如ext3/4区分大小写,某些短链接服务为减少长度选择区分大小写。因此,路径是否区分大小写取决于网站设置与后台技术。

参考资料:网址如何区分大小写?知乎

网址链接是否区分大小写?知乎

二、宝塔Nginx设置路径区分大小写

以网址 xxx.top/home为例。

使用~*进行不区分大小写的正则匹配,^/Home为匹配以/Home开头路径的正则表达式。

保存修改后的Nginx配置文件,宝塔面板通常具有保存按钮。测试配置正确性,若提示语法无误。

重启Nginx服务以使新配置生效。

验证配置,访问与,确保两者能正常访问相同资源。

若已有处理/Home或/home路径的location块,需调整顺序。确保SSL证书正确配置,以便通过HTTPS访问网站。

宝塔如何重启单个站点

只能重启环境,单个重启站点是没有效果的!

登录宝塔 Linux面板>>点击左侧导航菜单“软件商店”>>在应用分类中点击【运行环境】>>在软件列表中找到 Nginx并点击右侧对应的“设置”。【如果其它环境同样的原理选择】

在“Nginx管理”窗口中的“服务”中点击【停止】按钮,在弹出的“停止 Nginx服务”对话框中点击【确定】按钮即可关闭 Nginx。

在“Nginx管理”窗口中的“服务”中点击【启动】按钮,在弹出的“Nginx服务”对话框中点击【确定】按钮即可启动 Nginx。

在“Nginx管理”窗口中的“服务”中点击【重启】按钮,在弹出的“重启 Nginx服务”对话框中点击【确定】按钮即可重启 Nginx。

阅读剩余
THE END