一、环境准备 

1、centos7系统 

2、mysql数据库

3、在centos7虚拟机上安装好nginx

二、部署内容准备

1、后端war包 或者可执行jar

因为我这里是spring boot项目。我就以可执行jar文件作为后端部署内容,如果是war包,则需要部署在web容器中,这个很简单,不多说。

首先右键点击自己要部署的项目,run as---->maven insatll 打包

  

  

找到打包好的jar,复制到centos上,

  

  

执行  java -jar   XXXX.jar,后台正常启动,

  

2、前端,VUE静态资源。

如果没有安装过node的先安装node  、npm

进入前端项目根目录,执行  nmp run build

构建完成后,可以看到前端项目根目录下多了一个dist文件夹,这就是要部署的前台文件,

复制dist文件夹到centos下,

  

3.修改nginx配置文件。

  

  

vi /usr/local/nginx/conf/nginx.conf

新建server 节点

server {
listen 8001;
server_name 192.168.0.178; location /lic/ {
alias /usr/local/renren/dist/;
index index.html index.htm;
} }

  检查配置文件是否正确

    ./nginx -t

重新加载nginx配置

./nginx -s reload

检查端口,并开放8001端口,

浏览器访问:

http://192.168.0.178:8001/lic/

一切正常。

这里有几个问题需要注意:

第一,前台项目的路径和nginx配置文件中配置的路径需要一直。这里用的root用户,如果用其他用户,可能访问静态资源会被禁止访问(403),需要“chmod 755 静态资源路径 ” 授权,授权的时候要逐级授权,

比如、     chmod 755   /usr/local/renren/dist

      chmod 755   /usr/local/renren

chmod 755   /usr/local/

chmod 755  /usr

chmod 644   /usr/local/renren/dist/*

第二,nginx配置文件中配置时,没有用root ,而是使用alias

  

centos7 部署vue项目(前后端分离、nginx)的更多相关文章

  1. docker-compose 部署 Vue+SpringBoot 前后端分离项目

    一.前言 本文将通过docker-compose来部署前端Vue项目到Nginx中,和运行后端SpringBoot项目 服务器基本环境: CentOS7.3 Dokcer MySQL 二.docker ...

  2. Vue的学习总结之---Vue项目 前后端分离模式解决开发环境的跨域问题

    原文:https://blog.csdn.net/localhost_1314/article/details/83623526 在前后端分离的web开发中,我们与后台联调时,会遇到跨域的问题. 比如 ...

  3. 基于Vue的前后端分离项目实践

    一.为什么需要前后端分离 1.1什么是前后端分离  前后端分离这个词刚在毕业(15年)那会就听说过,但是直到17年前都没有接触过前后端分离的项目.怎么理解前后端分离?直观的感觉就是前后端分开去做,即功 ...

  4. linux项目部署(非前后端分离crm)

    参考博客 参考博客2---部署过程 导论:看参考博客1 WSGI是Web服务器网关接口.它是一个规范,描述了Web服务器如何与Web应用程序通信,以及Web应用程序如何链接在一起以处理一个请求,(接收 ...

  5. gin+vue的前后端分离开源项目

    该项目是gin+vue的前后端分离项目,使用gorm访问MySQL,其中vue前端是使用vue-element-admin框架简单实现的: go后台使用jwt,对API接口进行权限控制.此外,Web页 ...

  6. 一套基于SpringBoot+Vue+Shiro 前后端分离 开发的代码生成器

    一.前言 最近花了一个月时间完成了一套基于Spring Boot+Vue+Shiro前后端分离的代码生成器,目前项目代码已基本完成 止步传统CRUD,进阶代码优化: 该项目可根据数据库字段动态生成 c ...

  7. vue+springboot前后端分离实现单点登录跨域问题处理

    最近在做一个后台管理系统,前端是用时下火热的vue.js,后台是基于springboot的.因为后台系统没有登录功能,但是公司要求统一登录,登录认证统一使用.net项目组的认证系统.那就意味着做单点登 ...

  8. Flask & Vue 构建前后端分离的应用

    Flask & Vue 构建前后端分离的应用 最近在使用 Flask 制作基于 HTML5 的桌面应用,前面写过<用 Python 构建 web 应用>,借助于完善的 Flask ...

  9. SpringBoot+Jpa+SpringSecurity+Redis+Vue的前后端分离开源系统

    项目简介: eladmin基于 Spring Boot 2.1.0 . Jpa. Spring Security.redis.Vue的前后端分离的后台管理系统,项目采用分模块开发方式, 权限控制采用 ...

  10. 《论vue在前后端分离项目中的实践之年终总结》

    我是2014年的时候开始了解知道的vue,当时vue还不太成熟,想用但是又怕自己hold不住,况且那时候vue还没有成熟的(路由.验证.ui组件)插件,社区也是不温不火的,再说也没有合适的机遇让我去项 ...

随机推荐

  1. js数组,字符转换;key_value获取

    js 数组转字符串js 字符串转数组arr.join(",");String.split(","); 对象的所有keys Object.keys(val)对象的 ...

  2. MySQL硬核干货:从磁盘读取数据页到缓冲池时,免费链表有什么用?

    1.数据库启动的时候,是如何初始化Buffer Pool的? 现在我们已经搞明白一件事儿了,那就是数据库的Buffer Pool到底长成个什么样,大家想必都是理解了 其实说白了,里面就是会包含很多个缓 ...

  3. vue表单选项框

    选项框选的内容在下面显示 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  4. SQL基础教程(第2版)第3章 聚合与排序:3-2 对表进行分组

    第3章 聚合与排序:3-2 对表进行分组 ● 使用GROUP BY子句可以像切蛋糕那样将表分割.通过使用聚合函数和GROUP BY子句,可以根据“商品种类”或者“登记日期”等将表分割后再进行汇总.● ...

  5. openlayers基础用例

    http://weilin.me/ol3-primer/ch03/03-01.html#http://weilin.me/ol3-primer/ //地址http://openlayers.org/ ...

  6. jQuery如何给DOM添加ID

    ID每个元素只能有一个,ID名同一页面也不能重复,addID方法是不需要的,和其他属性一样用attr方法就行了, $(singleTarget).attr('id','idName'); 更简单的 $ ...

  7. java依赖包问题排查

    使用算法 breeze.optimize.LBFGSB,出现如下问题: 看到github上一个issue的解决方法是使用最新版本的 org.scalanlp:breeze_2.11:1.0-RC2, ...

  8. 01 语言基础+高级:1-8 File类与IO流_day08【 File类、递归】

    day08[File类.递归] 主要内容 File类 递归 教学目标 能够说出File对象的创建方式 能够说出File类获取名称的方法名称 能够说出File类获取绝对路径的方法名称 能够说出File类 ...

  9. 记一次修复Windows

    打开了一堆网页和应用,然后桌面不见了.. 于是很着急..就按各种快捷键..Win+R挂了.. 本来以为要reboot(机房电脑) , 然后问老师发现会格式化 然后发现Ctrl+Alt+Delete还存 ...

  10. 注册服务和发现服务 Eureka

    来自蚂蚁课堂: 注册服务和发现服务 1.原理如图: 注册中心负载均衡: 实践 注册中心 集群: