springboot+VUE+部署(12。Nginx和前端配置遇到的问题)

在本机可以,但发布到云端不行。

前端的配置要改:

检查生产环境配置文件( .env.production):

复制代码
# just a flag
ENV = 'production'

# base api
VUE_APP_BASE_API = 'http://15.64.249.212/api'

原先的配置是:VUE_APP_BASE_API = 'http://localhost:9999'

然后是Nginx的配置文件有问题,下面是正确的配置:

复制代码
##
# You should look at the following URL's in order to grasp a solid understanding
# of Nginx configuration files in order to fully unleash the power of Nginx.
# https://www.nginx.com/resources/wiki/start/
# https://www.nginx.com/resources/wiki/start/topics/tutorials/config_pitfalls/
# https://wiki.debian.org/Nginx/DirectoryStructure
#
# In most cases, administrators will remove this file from sites-enabled/ and
# leave it as reference inside of sites-available where it will continue to be
# updated by the nginx packaging team.
#
# This file will automatically load configuration files provided by other
# applications, such as Drupal or Wordpress. These applications will be made
# available underneath a path with that package name, such as /drupal8.
#
# Please see /usr/share/doc/nginx-doc/examples/ for more detailed examples.
##

# Default server configuration
#
# server {
# 	listen 80 default_server;
# 	listen [::]:80 default_server;
# 
# 	# SSL configuration
# 	#
# 	# listen 443 ssl default_server;
# 	# listen [::]:443 ssl default_server;
# 	#
# 	# Note: You should disable gzip for SSL traffic.
# 	# See: https://bugs.debian.org/773332
# 	#
# 	# Read up on ssl_ciphers to ensure a secure configuration.
# 	# See: https://bugs.debian.org/765782
# 	#
# 	# Self signed certs generated by the ssl-cert package
# 	# Don't use them in a production server!
# 	#
# 	# include snippets/snakeoil.conf;
# 
# 	root /var/www/html;
# 
# 	# Add index.php to the list if you are using PHP
# 	index index.html index.htm index.nginx-debian.html;
# 
# 	server_name _;
# 
# 	location / {
# 		# First attempt to serve request as file, then
# 		# as directory, then fall back to displaying a 404.
# 		try_files $uri $uri/ =404;
# 	}
# 
# 	# pass PHP scripts to FastCGI server
# 	#
# 	#location ~ \.php$ {
# 	#	include snippets/fastcgi-php.conf;
# 	#
# 	#	# With php-fpm (or other unix sockets):
# 	#	fastcgi_pass unix:/run/php/php7.4-fpm.sock;
# 	#	# With php-cgi (or other tcp sockets):
# 	#	fastcgi_pass 127.0.0.1:9000;
# 	#}
# 
# 	# deny access to .htaccess files, if Apache's document root
# 	# concurs with nginx's one
# 	#
# 	#location ~ /\.ht {
# 	#	deny all;
# 	#}
# }


# Virtual Host configuration for example.com
#
# You can move that to a different file under sites-available/ and symlink that
# to sites-enabled/ to enable it.
#
server {
	listen 80;
	listen [::]:80;

	server_name 154.64.249.212;


	location / {
		root /var/www/html/dist;
		index index.html;
		try_files $uri $uri/ =404;
	}
	
	 location /api/ {
         	proxy_pass http://127.0.0.1:9999/; # 后端地址(服务器本机可写 127.0.0.1)
       	 	proxy_set_header Host $host;
         	proxy_set_header X-Real-IP $remote_addr;
         	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    	 }
}

添加了下面的配置:

location /api/ {
proxy_pass http://127.0.0.1:9999/; # 后端地址(服务器本机可写 127.0.0.1)
proxy_set_header Host host; proxy_set_header X-Real-IP remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

做了上面的更改后,前端重新编译,并上传云端。Nginx服务重启。再测试就正确了。

相关推荐
Jmyd01234 小时前
Web端3D营销展厅技术实现路径:从素材上云到线索回流的数据链路
前端·3d·性能优化·三维数字化
砚凝霜4 小时前
【软考信息安全】第二十二章 Web服务器安全分析与增强——Apache与IIS
服务器·前端·安全
IT研究室5 小时前
最新计算机毕业设计选题推荐-基于spring boot的葡萄酒文化宣传网站-网站-文档指导-Java-springboot
java·spring boot·课程设计
u0111026756 小时前
JPG、PNG、WebP 怎么选?按透明度、体积和使用场景做判断
前端·javascript·vue.js·图像处理·ai作画
jerrywus6 小时前
让 AI 写完代码后交一份报告:我改造了 answer-me-with-html
前端·claude·cursor
派小心.7 小时前
小程序分享链路中来源参数的传递校验
大数据·前端·数据库·人工智能·小程序·数据分析
凤山老林7 小时前
Spring Boot 集成 Sa-Token 实现高可用权限认证:登录鉴权、动态路由权限与接口防重放实战
spring boot·后端·sa-token·bootstrap
hhb_6187 小时前
一键生成数据看板,ECharts实战演示
前端·javascript·echarts
Java后端的Ai之路7 小时前
08_React组件API
前端·react.js·前端框架
小马不起床7 小时前
零基础玩转 FastAPI_09:前端基础工程构建
前端·状态模式·fastapi