近年来，前后端分离已经成为中大型软件项目开发的最佳实践。在技术层面，前后端分离指在同一个Web系统中，前端服务器和后端服务器采用不同的技术栈，利用标准的WebAPI完成协同工作。这种前后端分离的"混合开发"模式下，前后端通常会部署到不同的服务器上，即便部署在同一台机器，因为宿主程序（如后端用Tomcat，前端用nginx）不同，端口号也很难统一。这意味着位于A域（如https://foo:80/w
转载
2024-08-17 15:17:32
236阅读
几个月前，公司架构优化，首先就是前后端分离。所谓前后端分离，就是在传统的前后端代码都在一个项目里的基础上，将前后端代码抽离，把前端代码从后端项目了分离出来，前后端开发人员各自在自己的项目里开发。为什么要前后端分离？随着项目越做越大，功能模块越来越多，代码量越来越多，前后端代码都糅杂在一个项目里，前后端开发人员几十个，代码提交次数多而杂，项目变得很臃肿，代码维护人员的工作变得难做，此时亟待解决此问题
转载
2024-03-20 13:41:50
167阅读
前后端分离的项目发布在同一台服务器上，服务器只有一个公网ip，也就只有一个80端口，而假设前端项目已经运行在80端口上了，而项目中又要用到微信授权等就必须要后端运行在80端口上才行，这个时候就可以用nginx进行反向代理配置了。首先配置前端项目，进入到nginx安装目录的conf文件夹：vim nginx.conf
在http模块下添加以下配置：
#mobile
server {
转载
2024-04-07 13:57:44
225阅读
Linux Nginx部署前后端分离的Java Web项目(Vue+Springboot)系统(CentOS 8)环境准备工作：- Java JDK的安装和配置(Java 8) - Nginx的安装与配置 - MySQL的安装与配置、项目数据库的建立测试找的一个项目demo地址：https://gitee.com/xqnode/springboot-vue-demo一、项目分析部署到Linux服务
转载
2024-03-22 17:01:05
296阅读
一、动静分离结构在本文中，我们将静态资源放在 A 主机的一个目录上，将动态程序放在 B 主机上，同时在 A 上安装 Nginx 并且在 B 上安装 Tomcat。配置 Nginx，当请求的是 html、jpg 等静态资源时，就访问 A 主机上的静态资源目录；当用户提出动态资源的请求时，则将请求转发到后端的 B 服务器上，交由 Tomcat 处理，再由 Nginx 将结果返回给请求端。提到这，可能有
转载
2024-03-29 08:58:46
93阅读
文章目录一、为什么要实现动静分离二、动静分离的基本过程三、环境说明四、部署过程4.1、nginx 服务器部署4.2、Tomcat 服务器部署4.3、动静分离配置4.4、配置验证 一、为什么要实现动静分离动静分离是将网站的静态资源（HTML，JavaScript，CSS,img等文件）与后台应用分开部署，提高用户访问静态代码的速度，降低对后台应用的访问nginx 处理静态资源的能力超强。 主要是n
转载
2024-03-27 11:22:01
714阅读
2.1 前后台分离部署(一) 组网图 (二) 简要说明：如标题所示，至于为什么要前后台分离部署，个人理解的原因有三(一) 便于
转载
2024-03-07 14:14:16
323阅读
使用nginx实现前后端分离开发调试有一些老项目在前后端没有完全分离部署的情况下，前端人员调试是很不方便的，有的时候本地后端相关配置不正确，会导致无法正常调试，浪费大量时间。 今天就来一起学习一下怎么使用Nginx代理来进行前后端分离开发。一、Nginx是什么Nginx是由俄罗斯人研发的（毛子威武），并且2004年发布了第一个版本，主要用来做服务器集群。 通俗的讲就是控制客户端请求到底发送至哪台服
转载
2024-05-06 15:12:52
586阅读
研发项目中,Nginx反向代理，可以解决跨域无权和Session丢失的问题，十分方便。下面我们以前后端分离为案例，展开Nginx的使用教程。
一. 配置和启动Nginx 下载地址
Nginx下载传送门：
Nginx Stable Version Download
注意事项：下载之后，记得解压到全英文路径，避免中文路径导致Nginx启动失败。
修改配置
打开n
转载
2024-03-20 14:26:48
386阅读
背景：使用vue创建的前端页面； 后端使用Netcore webapi 首先后端core项目设置端口，例如10002 然后前端项目在nginx中设置前端监听10001，接下来设置正常的前端位置，之后设置 location /api 拦截api请求，设置proxy_pass的api地址，重启nginx ...
转载
2021-11-01 17:08:00
739阅读
2评论
前后端不分离项目中怎么使用vue.js和bootstrap1.导入vue.js到html中远程链接配置<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>vue2的网址https://v2.cn.vuejs.org/v2/guide使用bootcdn下载vue.jshttps://www.bootcdn.cn/
路由此处的路由指的是页面跳转的规则，通过不同的路径，来请求不同的资源，请求不同的页面是路由的其中一种功能。可以简单理解为url跳转后端路由和前端路由的url的访问意义有所不同，所有的url都会访问到服务器上对应的资源。页面请求的url全部要通过后端服务的过滤器进行过滤和处理在之前学的web技术中，学习过Java Servlet，前端的页面资源和后端服务是放在了同一个项目文件中的，前端显示的页面都是
转载
2024-04-03 19:17:25
103阅读
1.什么是动静分离“动”与“静”在弄清动静分离之前，我们要先明白什么是动，什么是静。在Web开发中，通常来说，动态资源其实就是指那些后台资源，而静态资源就是指Html、img、js、css等文件。动静分离就是将动态资源和静态资源分开，将静态资源部署在Nginx上，当一个请求来的时候，如果是静态资源的请求，就直接到nginx配置的静态资源目录下面获取资源，如果是动态资源的请求，nginx利用反向代理
转载
2024-03-27 10:32:16
167阅读
一、背景书接上文，浅谈前后端分离与实践(一) 我们用mock服务器搭建起来了自己的前端数据模拟服务，前后端开发过程中只需定义好接口规范，便可以相互进行各自的开发任务。联调的时候，按照之前定义的开发规范进行数据联调便可以了。前后端的职能更加清晰： 后端前端提供数据接收数据，返回数据处理业务逻辑处理渲染逻辑Server-side MVC架构Client-side M
转载
2024-08-21 09:25:09
42阅读
一：Nginx实现负载均衡原理Nginx实现负载均衡是通过反向代理实现 如图所示：Nginx服务器作为前端，Tomcat服务器作为后端，web页面请求由Nginx服务来进行转发。但是不是把所有的web请求转发，而是将静态页面请求Nginx服务器自己来处理，动态页面请求，转发给后端的Tomcat服务器来处理据我们所知，Tomcat是属于轻量级的应用服务器，可接受访问
转载
2024-04-01 21:21:56
2164阅读
1 说明现在的Java Web项目好多都使用前后端分离的开发部署方式，这样的好处有很多，比如：可以实现真正的前后端解耦，可以减少后端服务器的并发/负载压力，方便实现多端应用（网页端、移动端共用一个后台服务）、增加代码的维护性&易读性。一般我们会采用Nginx来部署前端代码，使用Tomcat来部署后台服务。最近在Windows系统中使用Nginx部署前端代码时调用后台服务时出现了跨域的报错，
转载
2024-03-25 12:40:28
120阅读
文章目录一、Nginx+Tomcat负载均衡的组合原因1.1 Nginx实现负载均衡的原理1.2 Nginx实现负载均衡的主要配置项1.3 Nginx+Tomcat负载均衡的组合的优点1.4 Nginx+Tomcat负载均衡的实验设计二、动静分离部署2.1 部署TOMCAT后端服务器2.2部署nginx服务器2.3安装nginx动态服务器 一、Nginx+Tomcat负载均衡的组合原因1.1 Ng
转载
2024-04-07 12:43:46
211阅读
在实现nginx部署前后端分离项目之前，首先需要了解什么是前后端分离项目。前后端分离是指将前端和后端进行分离开发，通过API进行数据交互，前端负责展示页面，后端负责处理业务逻辑和数据处理。在部署时，前端和后端项目部署在不同的服务器，并通过nginx进行反向代理和负载均衡，提高项目的性能和可维护性。
下面是实现nginx部署前后端分离项目的流程：
| 步骤 | 操作说明 |
| ------ |
原创
2024-04-26 11:10:23
507阅读
1、pom.xml文件添加：<!--单点登录-->
<dependency>
<groupId>org.pac4j</groupId>
<artifactId>pac4j-cas</artifactId>
<version>3.0.2</version>
</depend
转载
2024-09-30 13:07:28
32阅读
编译前端项目 修改 .env 环境变量 Vite 环境变量加载机制：.env.[mode].local > .env.local > .env.[mode] > .env cd yudao-ui-admin-vue3 npm install # npm构建，package.json 中配置了这个 n
