Windows版:Nginx部署React项目并访问Spring Boot后台数据
一, 打包react项目
1,在工作空间目录下create-react-app test-arrange 创建项目test-arrange
2,在新建的项目中写好请求与页面
3,打包, 在项目目录下 npm run build
打包完成之后, 在项目目录下出现build文件夹。
二, 下载安装Windows版Nginx
1,Nginx下载地址http://nginx.org/en/download.html
下载的是稳定版1.16.1
2,解压
3,将步骤一中打包后生成的build文件夹内文件复制到nginx -> html目录下[不一定是html目录,可以在nginx.conf中修改;location/里面的root]
4,修改nginx -> conf目录下配置文件nginx.conf
PS: 如果步骤一的2和步骤二的4中不加api访问后台接口的时候会报404
5,启动Nginx, 在nginx目录下 start nginx
6,访问, http://localhost:8081,因为是Windows版的nginx所以是localhost,如果nginx是在Linux服务器上,localhost改为相应ip地址
点击search,可以从后台取到数据
7,停止nginx, 在nginx目录下nginx -s quit
Windows版:Nginx部署React项目并访问Spring Boot后台数据的更多相关文章
- nginx部署h5项目
1. nginx部署h5项目 此为windows部署,liunx也类似的 1.1. 前言 部署h5项目还是很简单的,不过对小白来讲一开始可能也是一脸懵逼,这个简单教程针对的是从未部署过前后端分离前端项 ...
- nginx部署vue项目
nginx是一个高性能的HTTP和反向代理服务器.因此常用来做静态资源服务器和后端的反向代理服务器.本文主要记录使用nginx去部署使用vue搭建的前端项目,项目基于vue官方的脚手架vue-cli构 ...
- 小白从零开始阿里云部署react项目+node服务接口(三:部署到服务器)
服务器 准备工具 依次安装即可 nginx 安装nginx https://www.runoob.com/linux/nginx-install-setup.html 配置全局nginx命令 http ...
- 使用uWSGI+nginx部署Django项目
最近使用django写了一些项目,不过部署到服务器上碰到一些问题,还有静态文件什么的一堆问题,这里总结一下碰到的问题和解决方案,总体思路是按照官方文档走的. 原文地址:http://uwsgi-doc ...
- 服务器nginx部署PHP项目样式不出来要注意的小问题
服务器使用nginx部署PHP项目的时候如果样式没有 出来,那么很可能 location 块里出问题了. 比如 location / { root /home/wwwroot/default/php_ ...
- 通过Nginx部署flask项目
用Flask开发之后,很多人,喜欢用nohup python manage.py & 这样的形式,放到后台运行,其实这样只是个发开模式,很简陋,无法支持并发,进程监控等功能.所以采用nginx ...
- 小白从零开始阿里云部署react项目+node服务接口(二:node服务+web)
我们用极简的方式来创建服务,没有任何附加功能 1 新建一个server文件夹 2 使用npm init 或者yarn init 一路enter 3 yarn add express cors ...
- 小白从零开始阿里云部署react项目+node服务接口(一:阿里云服务器)
准备阿里云服务器,并安装系统 如果没用自己服务器可以购买一个 https://www.aliyun.com/minisite/goods?userCode=x7i5glgc 初级购买一个1核2G的主机 ...
- Windows下Nginx配置SSL实现Https访问(包含证书生成)
Vincent.李 Windows下Nginx配置SSL实现Https访问(包含证书生成) Windows下Nginx配置SSL实现Https访问(包含证书生成) 首先要说明为什么要实现https ...
随机推荐
- sendMessage 与 obtainMessage (sendToTarget)比较
我们平时在做到多线程问题的时候可能利用Handler去传递Message,其中,经常使用的就是 1.new Handler().obtainMessage().sendToTarget(); 2.ne ...
- Maven国内源设置 - OSChina国内源失效了,别更新了
Maven国内源设置 - OSChina国内源失效了,别更新了 原文:http://blog.csdn.net/chwshuang/article/details/52198932 最近在写一个Spr ...
- RedHat 6 安装 MySQL 5.5 流程记录及相关问题解决方案
目录 1. RedHat 中 使用 yum 方式安装 MySQL 2. 安装过程中遇到的问题 1. RedHat 中 使用 yum 方式安装 MySQL 1.1 删除系统自带的 MySQL 5.1 r ...
- ML- 核函数(Kernel) 的 SVM
Why 核函数 目的是为了解决线性不可分问题. 核心思想是升维. 当样本点在低维空间不能很好地分开的时候, 可以考虑将样本通过某种映射(就是左乘一个矩阵) 到高维空间中, 然后在高维空间就容易求解一个 ...
- Request和Response。
复习点:1.重定向问题 2.输出字符串到浏览器.3.文件下载需求:1. 页面显示超链接2. 点击超链接后弹出下载提示框3. 完成图片文件下载 Request和Response Request: 1. ...
- Python学习日记(三十九) Mysql数据库篇 七
Mysql函数 高级函数 1.BIN(N) 返回N的二进制编码 ); 执行结果: 2.BINARY(str) 将字符串str转换为二进制字符串 select BINARY('ASCII'); 执行结果 ...
- Oracle数据导出导入(PL/SQL工具)
做了那么多年的开发第一次写博客,一开始是没想过要写博客的,后来想写,却一直不敢写,一个是怕自己写的不好,误导人家,二来是不太自信.现在想起写博客是因为,真正的勇士敢于面临淋漓的鲜血,希望能提高自己,也 ...
- Prometheus学习笔记(3)什么是node_exporter???
目录 Node_exporter安装配置启动 Node_exporter安装配置启动 node_exporter安装在被监控端,安装方式也比较简单,直接下载解压安装即可,默认启动后监听9100端口. ...
- SQL注入流程图
http://127.0.0.1/sqli-labs-master/Less-2/index.php? id=1 1 输入单引号 ‘ 进行检验是否存在输入 http://12 ...
- webpack4.0报WARNING in configuration警告
在进行webpack打包工作时,先进行如下步骤 1). 安装webpack:推荐全局命令 cnpm install webpack -g 查看webpack版本 webpack -v 2) . 此时 ...