# 使用 Nginx 代理 Vue 项目并部署到 Docker
在现代 web 开发中，Vue.js 是一个非常流行的前端框架，而 Nginx 则是一个广泛使用的高性能 HTTP 和反向代理服务器。将 Vue.js 应用使用 Nginx 进行代理，并通过 Docker 容器进行部署，可以大大简化开发和生产环境的配置。本文将带您了解如何实现这一过程。
## 系统架构图
我们可以使用 Merma
原创
2024-10-12 05:05:00
68阅读
# 实现Vue Nginx部署代理转发
## 概述
在开发过程中，我们经常会遇到前端项目使用Vue框架开发，后端API接口需要通过Nginx代理转发的情况。本文将带领你完成Vue项目在Nginx中的部署和代理转发配置。
### 步骤
以下是完成该任务的流程和步骤，我们将通过具体的代码示例来说明每一步需要做什么。
| 步骤 | 操作 |
| --- | --- |
| 1 | 构建Vue项目
原创
2024-05-08 09:52:47
921阅读
nginx是一个高性能的HTTP和反向代理服务器。因此常用来做静态资源服务器和后端的反向代理服务器。本文主要记录使用nginx去部署使用vue搭建的前端项目，项目基于vue官方的脚手架vue-cli构建。 打包vue项目 通过上面命令后打包好的静态资源将输出到dist目录中。如图所示 如图所示 修改
原创
2021-07-27 16:34:38
1294阅读
当用vue开发好前端需要打包时，一般都需要配置下代理方便访问后台接口，避免出现找不到链接或者跨域问题。记录下配置，假如vue中配置的跟url是/mock-server ,实际接口地址是127.0.0.1:8886则nginx.conf文件中，增加如下配置：location /mock-server { proxy_pass http://127.0.0.1:8886; #api请求地址的
原创
2021-08-30 17:25:37
2553阅读
首先个人理解的反向代理就像一台服务器A，前端请求到这个服务器A，然后这个服务器A会转发到另一个服务器，就像我们有时候需要apache服务器放web，tomcat部署java项目，或者某个文件服务器放文件图片，这样我们以一个nginx服务器为中介，如果接收是请求web项目的域名就转发到apache服务器，如果是java项目的域名就转发tmcat服务器，接收到路径含有file，images字段就转发到
转载
2024-05-11 10:49:41
1258阅读
两台nginx服务器nginx A: 192.168.1.48nginx B: 192.168.1.56一. 测试方法在nginx A中配置不同的规则，然后请求nginx A： http://192.168.1.48/foo/api观察nginx B收到的请求，具体操作是查看：‘http://’._SERVER[‘PHP_SELF’].’?’.$_SERVER[‘QUERY_STRING’];二.
转载
2024-05-20 14:20:55
188阅读
1. nginx概述nginx是一款轻量级的、自由的、开源的、高性能的HTTP服务器和反向代理服务器；同时也是一个IMAP/POP3/SMTP代理服务器；nginx可以作为一个HTTP服务器进行网站的发布处理，另外nginx可以作为反向代理进行负载均衡的实现。其特点就是占用内存少，并发能力强。轻量级：1. 从代码角度看：实现代码时，代码设计耦合性较低2. 占用内存：占用内存特别的少2.
转载
2024-06-05 13:11:34
70阅读
在K8S中部署Vue项目并配置反向代理，需要先理解什么是反向代理以及如何使用Nginx来实现反向代理。反向代理是指代理服务器接收客户端的请求，然后将请求转发给真实的服务器，最后将服务器的响应返回给客户端，客户端认为是直接与代理服务器通信。Nginx是一个高性能的Web服务器和反向代理软件，可以帮助我们实现反向代理配置。
接下来，我将逐步介绍如何在K8S中部署Vue项目并配置Nginx反向代理。
原创
2024-05-24 10:43:14
626阅读
一.什么是代理在Android的设计开发中有一种代理模式。具体思想使用一个类去代理一个具有具体业务功能的类，在其他对象想要实现这种业务时，只需要访问代理类即可，同时代理类还可以实现一些自己的方法来进行装饰。 就比如海外代购，客户想要购买海外的某样东西，固然可以自己出国去买，一般人都会觉得麻烦，语言不通，人生地不熟的。可能这一次自己去买了，但每次都要去自己买吗。这时候就可以找到海外代购的机构了，代购
Hi， 今天我们将会学习如何使用 Weave 和 Docker 搭建 Nginx 的反向代理/负载均衡服务器。Weave 可以创建一个虚拟网络将 Docker 容器彼此连接在一起，支持跨主机部署及自动发现。它可以让我们更加专注于应用的开发，而不是基础架构。Weave 提供了一个如此棒的环境，仿佛它的所有容器都属于同个网络，不需要端口/映射/连接等的配置。容器中的应用提供的服务在 weave 网络中
转载
2024-08-15 10:09:55
122阅读
Nginx反向代理1：反向代理是什么反向代理，其实客户端对代理是无感知的，因为客户端不需要任何配置就可以访问，我们只需要将请求发送到反向代理服务器，由反向代理服务器去选择目标服务器获取数据后，在返回给客户端，此时反向代理服务器和目标服务器对外就是一个服务器，暴露的是代理服务器地址，隐藏了真实服务器IP地址。2：反向代理的实现首先准备两个tomcat，修改tomcat的首页方便辨别打开nginx目录
转载
2024-04-04 18:57:47
203阅读
前言众所周知,Nginx是现如今最热门的反向代理服务器了,并且通Apache一样都是属于web服务器。Apache的主要优点是稳定和支持跨平台,但是受限于Apache诞生的年代较早,互联网环境远没有现如今的复杂,所以Apache设计之初是重量级的并且不支持高并发。
正所谓时势造英雄，于是支持高并发的Nginx就诞生了，Nginx是基于事件驱动架构,所以可以支持百万级的TCP连接，Nginx是一款自
转载
2024-03-04 17:03:20
37阅读
Nginx配置Https+反向代理一、Nginx配置Https1.1 Nginx的ssl模块安装进入到你的nginx安装目录下面，注意是安装目录，不是解压的目录 ，进入到目录的sbin目录下，输入#注意这里是大写，小写只是显示版本号
./nginx -V如果出现 （configure arguments: --prefix=********* --with-http_ssl_module），则已安
转载
2024-04-01 13:18:17
108阅读
Nginx概述Nginx是俄罗斯的程序设计师Igor Sysoev为俄罗斯访问量第二的Rambler.ru站点开发的开源服务器软件，Nginx完全使用C语言编写，可以作为一台高性能的web服务器、反向代理服务器和邮件代理服务器使用。在高连接并发的场合，Nginx是Apache商业服务器不错的替代品。Nginx的优点很多，总结起来就是：高并发下响应请求更快、低耦合设计带来的高可扩展性、高可靠性、低内
转载
2024-04-05 15:41:09
102阅读
NGINX构架实验 （nfs、nginx反代、nginx upstream、nginx fastcgi ）
172.16.31.124 nginx 反向代理图片到11.100.46.9
反向代理静态页面到static upstream组11.100.46.4 （nginx）11.100.46.7（apache）健康检查
反向代理.php到动态fastcgi server 11.100.
目录1. nginx实现反向代理功能1.1 nginx代理功能概述1.2 NGINX实现HTTP反向代理1.2.1 HTTP反向代理基本功能1.2.1.1 反向代理配置参数1.2.1.2 apache部署1.2.1.3 nginx反向代理配置1.2.1.4 后端服务器显示客户端真实IP1.2.1.5 nginx反代实现虚拟主机1.2.1.6 nginx反代实现隐藏后端服务器响应头部1.2.2 NG
转载
2024-03-06 17:15:20
245阅读
（1）proxy_pass语法：proxy_pass URL;配置块：location、if此配置项将当前请求反向代理到URL参数指定的服务器上，URL可以是主机名或IP地址加端口的形式，例如：proxy_pass http://localhost:8000/uri/;也可以是UNIX句柄：proxy_pass http://unix:/path/to/backend.socket:/uri/;还
转载
2024-03-07 13:03:47
72阅读
在前一讲中介绍了反向代理，我们知道：反向代理（Reverse Proxy）方式是指以代理服务器来接受 internet 上的连接请求，然后将请求转发给内部网络上的服务器，并将从服务器上得到的结果返回给 internet 上请求连接的客户端，此时代理服务器对外就表现为一个反向代理服务器。这一讲就来做几个案例。案例1：使用 nginx 反向代理 www.mytomcat.
转载
2024-02-24 11:20:26
706阅读
Nginx 502 Bad Gateway的含义是请求的PHP-CGI已经执行，但是由于某种原因（一般是读取资源的问题）没有执行完毕而导致PHP-CGI进程终止。 Nginx 504 Gateway Time-out的含义是所请求的网关没有请求到，简单来说就是没有请求到可以执行的PHP-CGI。解决这两个问题其实是需要综合思考的，一般来说Nginx 502 Bad Gateway和php-fpm.
转载
2024-03-18 09:40:37
32阅读
一、ngx_http_proxy_module模块 ngx_http_proxy_module模块可根据用户请求的uri传递至后端服务器，实现反向代理命令：1.proxy_pass设置一个代理服务器的地址，协议，和一个可选的URI的位置应该映射。作为一个协议，“HTTP”或“https”可以指定。地址可以被指定为一个域名或IP地址，和一个可选的端口语法
转载
2024-03-27 21:23:39
600阅读
