编程导航会员会员
登录/注册

用户中心项目 部署上线全流程和遇到的BUG汇总

我的项目已经上线了，下面有管理账号，跟着鱼皮写的项目没有其他功能。 比如说在注册的时候可以注册一下用户名，还有上传图片功能，还有选择性别什么的还没有完成-------还待完善........... 这个是写的前端的页面，后端的还没有开始弄[偷笑][偷笑][偷笑]

image.png

最新版的已经上传上去了 可以实现注册用户名还有选择性别的功能，上传图片的功能还没有实现 [偷笑][偷笑][偷笑] 下图所示

image.png

地址：http://43.139.212.135/ 管理员：asd123 密码：123123123

线上部署的时候用到的端口要给开放（服务器和宝塔面板的端口都要打开），后端端口8081 数据库端口3306 还有宝塔面板的端口要打开不然会进不去

1.本地部署注意点

（1）前端项目:按鱼皮的写就可以的，需要注意的是request.js这个文件的那个区分线上和线下环境写的地址

image.png

这边的话那个前面的http://localhost:8081 写的是你本地后端端口的地址，我这边后端端口是 8081，后面这个写的http://43.139.212.135 是你部署上线的地址，我这边用的是ip地址的形式，如果你买了域名就填写域名的地址 （2）后端项目：按鱼皮的写就可以的 （1）本地部署和线上部署这两个文件

image.png 第一个文件是写本地的配置文件，第二个是线上的配置文件，这两个配置文件名字别写错了

2.跨域问题

写的时候经常会遇到跨域问题就打开控制台可以看到下面的报错

image.png 这个就已经提示跨域问题 按下F12打开控制台， image.png image.png

登录状态出现了CORS错误 表示现在就是跨域问题，解决跨域问题有很多种，在这边我提供了一个方法来解决这个问题。 在后端代码中的controller层的UserController.java中添加注释就可以

undefined

注释代码如下： @CrossOrigin(origins = {"http://localhost:3000","http://43.139.212.135"},methods = {RequestMethod.POST,RequestMethod.GET}, allowCredentials = "true") 添加到用户接口这边

image.png

前面是本地前端访问的地址，后面是线上访问地址，线上部署的时候后面这个要写上去

3.线上部署步骤和注意点（我这里使用的是宝塔面板）

1.部署数据库：

(1)点击数据库进行创建数据库

image.png

（2）这边的访问权限可以自己调整，最好是指定ip 只能自己电脑 才能访问

image.png

（2）导入sql文件

image.png

点击导入，上传文件

image.png

上传文件之后还要进行导入才是真的导入成功了

image.png

（3）查看数据库是否导入成功 点击phpMyAdmin,如果没有下载就去软件商店下载

image.png

点击通过面板访问去查看

image.png

已经成功导入数据库

image.png

2.前端项目：

（1）打包前端项目进行上传 点击build进行打包

image.png

打包中

image.png

出现这个打包完成

image.png

项目已经打包在前端项目的dist文件夹里面了

image.png image.png 部署到宝塔上 image.png

点击添加站点

image.png

打开宝塔的文件，可以看到刚才生成的文件夹里面有文件，将这些都删除掉

image.png

删除掉之后

image.png

点击上传文件，将刚才的dist文件里面的内容都上传上去

image.png 上传成功 image.png （2）配置前端项目的配置文件 点击设置，进行配置 image.png

配置文件如下所示

image.png

添加上这段代码

▼
##
复制代码
    location @router {
        rewrite ^.*$ /index.html last;
    }

      location /api {
        proxy_pass http://127.0.0.1:8081;//这里填写的8081要改成你后端项目端口
        proxy_set_header Host $proxy_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_buffering off;
        proxy_set_header Connection " ";
      }
      
  location / {
      try_files $uri $uri/ @router;
      index index.html;
    }

保存

image.png

配置好现在就可以打开前端项目了

image.png

注意，你要是没有在前端的配置文件写下面的代码

image.png

当你点击登录的之后，这是你刷新一下页面会出现下面的报错，页面不见了，把上面的代码添加上去就可以了

image.png image.png

（3）配置Nginx文件 点击nginx进行配置

正常配置到这边Nginx不会在出现报错了，如果Nginx报错405就在Nginx配置文件上面加上 这段代码

▼
text
复制代码

upstream static_backend {
            server localhost:8081;
        }

        server {
            listen 80;
            # ...
            error_page 405 =200 @405;
            location @405 {
                root /srv/http;
                proxy_method GET;
                proxy_pass http://static_backend;
            }
        }
image.png

3.后端项目：

（1）打包后端项目进行上传 先把项目中的test文件夹整个都删除掉再打包，不然会报错最好先留个备份在本地上，到时候可以找回来

image.png

点击Maven的clean

image.png

再点击package

image.png

打包完成在target目录下面

image.png

在宝塔面板的文件下面新建目录user-center-backend

image.png

打开这个目录上传target下面的jar文件

undefined

（2）添加java项目

image.png

我这里使用的是最新的宝塔面板是不会自己生成这个代码的--server port=8081 这个代码要写上去，建议还是要检查一下，免得出错，这个也是经常容易出错的地方

到这里错了，原来是那个启动项目的命令少了一段代码

--spring.profiles.active=prod 没有这个会一直报错的

完整页面配置

image.png

点击确定

如果跳出这个就先将数据库给部署上去

image.png 出现端口 还有cpu说明已经配置成功了 image.png

4.项目总结

1.这里要感谢leikooo哥的帮助，帮我解决了好多问题，让我收获很多，感谢[敬礼][敬礼][敬礼] 2.给我的感受就是本地部署和线上部署是完全不一样的，大家有条件的话可以买一个轻量级服务器去进行部署，线上部署一整个流程下来我收获了好多，已经学会去部署项目了。 3.遇到问题不要慌，要自己好好看看那个控制台的报错，还要看后端报错日志是什么情况，根据报错来去找出问题，解决问题，可以去看csdn上面的部署错误怎么解决的，也可以看看编程导航里面小伙伴发的一些部署上线的解决方法，这里我推荐几个可以去看看 可以去看看鱼友5617的文章，https://www.codefather.cn/post/1812495464582537217#heading-0 还有leikooo哥的文章 https://www.codefather.cn/post/1833530459424612354 4.部署项目在服务器上容易出现BUG，要花很多时间去解决这些BUG，不要想着说这是在浪费时间，我弄了周末一下午到晚上也没有解决[流泪][流泪][流泪]，我就想着说算了还是不弄了，不弄线上了，后面也是想通了还是要弄线上的，虽然要花很多时间解决，还是非常有必要的，可以学到很多。 5.在解决问题的同时也是学会了挺多的，得多分析，多思考，自己找方法去解决，要是实在是自己已经花了很多时间还是解决不了，可以问问各位大佬[呲牙][呲牙][呲牙]。

用户中心项目
0个评论
全部评论
点击登录，快来和大家讨论吧～
表情
图片
暂无评论
爱吃鱼的猫
爱吃鱼的猫
等级
内容推荐
更多
用户中心项目，点击登录报这个错误，有大佬知道该怎么解决吗？
7
用户中心项目求问
4
最近学习了一些前端知识，所以开始跟着鱼皮的录播来做项目，结果第一步ant design pro的安装就碰到了问题，无法安装成功，想请教一下星球的各位大佬们怎么解决[流泪]
2
项目 问一下大家 可以跳过用户中心的项目直接做伙伴匹配的项目吗？因为不知道伙伴匹配的项目的登录有没有用到用户中心的数据还是说伙伴匹配项目是有注册功能的呢？[委屈][委屈][委屈]
7
用户中心项目-后端java服务遇到的问题汇总
3
作者分享
更多
暂无数据
下载 APP