zoukankan      html  css  js  c++  java
  • Windows server部署项目(前后端分离)

    环境搭建

    后端:

    安装 jdk,maven,配置环境变量
    安装 nginx,并配置代理模式
    安装Git

    前端:

    安装node, cnpm, 配置node及cnpm环境变量

    安装JDK 下载传送门

    在这里插入图片描述

    1. 选择 jdk版本 2. 同意协议 3. 选择32位或64位版本。

    安装:按提示进行安装,安装过程省略。最好创建一个专门的文件夹,例如我的
    在这里插入图片描述
    添加环境变量
    我的电脑 -> 属性 -> 高级系统设置 -> 环境变量 ->
    在这里插入图片描述在这里插入图片描述新建JAVA_HOME
    在这里插入图片描述添加JAVA_HOME到Path中

    在这里插入图片描述
    测试:
    在这里插入图片描述####

    安装Maven (略)参考

    安装MySQL (略)参考

    安装Nginx

    参考的两篇文章
    Windows2012中安装Nginx并创建为Windows服务
    Windows下Nginx的启动、停止等命令
    nginx.conf配置前后端分离(最底部的server)

    events {
        worker_connections  1024;
    }
    
    http {
        include       mime.types;
        default_type  application/octet-stream;
    
        keepalive_timeout  65;
    
        server {
            listen       80;
            server_name  localhost;
    		
            location / {
                root   html;
                index  index.html index.htm;
            }
            
            error_page   500 502 503 504  /50x.html;
            location = /50x.html {
                root   html;
            }
        }	
        # 新增
        server {
            # 监听9999端口,指向root所指的文件。
            listen 9999;
            location / {
                # 前端Vue生成的dist文件地址
                root D:workspaceWebStorm17SUBWAYsubway2dist;
    	    index index.html index.htm;
            }
             # 前端访问的Api是http://127.0.0.1:18080/subway/...
            location /subway {
                proxy_pass http://127.0.0.1:18080/;
            }
        }
    }
    
    

    将Nginx设置为Windows服务

    1. 需要借助"Windows Service Wrapper"小工具,项目地址: https://github.com/kohsuke/winsw
      下载地址: http://repo.jenkins-ci.org/releases/com/sun/winsw/winsw/1.18/winsw-1.18-bin.exe
      下载该工具后,将其放在 Nginx安装目录下,并重命名为nginx-service.exe,创建配置文件nginx-service.xml(名字要和工具名一样),
    2. nginx-service.xml
    <service>
      <id>nginx</id>
      <name>Nginx Service</name>
      <description>High Performance Nginx Service</description>
      <logpath>D:xampp
    ginxlogs</logpath>
      <log mode="roll-by-size">
        <sizeThreshold>10240</sizeThreshold>
        <keepFiles>8</keepFiles>
      </log>
      <executable>D:developJava
    ginx
    ginx-1.12.2
    ginx.exe</executable>
      <startarguments>-p D:developJava
    ginx
    ginx-1.12.2</startarguments>
      <stopexecutable>D:developJava
    ginx
    ginx-1.12.2
    ginx.exe</stopexecutable>
      <stoparguments>-p D:developJava
    ginx
    ginx-1.12.2 -s stop</stoparguments>
    </service>
    
    1. nginx-service.exe.config
    <configuration>
      <startup>
        <supportedRuntime version="v2.0.50727" />
        <supportedRuntime version="v4.0" />
      </startup>
      <runtime>
        <generatePublisherEvidence enabled="false"/> 
      </runtime>
    </configuration>
    
    1. 在cmd中运行如下命令安装windows服务
    D:developJava
    ginx
    ginx-1.12.2conf>  D:developJava
    ginx
    ginx-1.12.2
    ginx-service.exe install
    

    启动nginx

    D:developJava
    ginx
    ginx-1.12.2conf>  start nginx
    

    重启

    D:developJava
    ginx
    ginx-1.12.2conf>  nginx.exe -s reload
    

    验证:打开浏览器输入

    http://127.0.0.1
    

    默认nginx端口是80,如果启动失败,请修改nginx.conf中的监听端口为其他1000-65535之间的数

    在这里插入图片描述

    安装 Node 下载传送门

    按照安装步骤安装即可!
    检查node和npm是否安装成功

    C:UsersAdministrator> node -v
    v7.6.0
    
    C:UsersAdministrator>npm -v
    4.1.2
    

    在这里插入图片描述

    安装cnpm

    参考博客https://blog.csdn.net/u011342720/article/details/81267908

    启动Vue项目

    >  cnpm install
    ...
    > npm run dev
    ... 
    

    访问9999端口

    有梦为马,游历天涯!
  • 相关阅读:
    NHibernate中的Clear和Flush方法
    什么是POCO类
    node-vuecli 脚手架安装
    layui表单引入ueditor遇坑记
    PHP的九个超全局变量
    PHP的八个魔术常量
    PHP的七个数组指针函数
    TP6.0多应用模式隐藏路由中的应用名
    TP6.0中的密码验证逻辑、验证器的使用
    Vue 侦听器 watch
  • 原文地址:https://www.cnblogs.com/qijianguo/p/10686367.html
Copyright © 2011-2022 走看看