您现在的位置是：首页 > PHP后端和VUE前端部署在一个域名上的一种方法

PHP后端和VUE前端部署在一个域名上的一种方法

默认 2020-04-17 17:57 共1641人围观 来源：原创
nginx   vue  
简介现在越来越多的项目采用前后端分离的方式开发，部署的时候可以选择部署到不同的域名或者不同的端口上去。有时候为了方便还可以选择部署在同一个域名上，这里介绍一种方法，除了这种也还有别的方法。

通过ngxin反向代理来实现前后端共用一个域名。注意下面location /api这段。意思是只要访问以/api开头的路径，就转发给后端8080端口的网站。这样网站前台域名是http://www.xxx.com 后台接口的baseUrl应该是http://www.xxx.com/api

1、vue前端配置一份nginx配置文件web.conf

内容大约如下：

server {
listen 80;
root /home/ly/www/vue-dist;
index index.html index.htm;
server_name www.xxx.com;
client_max_body_size 100m;

# 开启gzip压缩加快访问速度
gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
#gzip_http_version 1.0;
gzip_comp_level 3;
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_vary off;
gzip_disable "MSIE [1-6]\.";

location / {
    try_files $uri $uri/ /index.html;
}}

location /api {

    #使用nginx代理，直接解决了域名共享和跨域的问题
    proxy_pass http://127.0.0.1:8080/;
}

}

2.php后端部署在8080端口上

配置文件大约如下：

server {
listen 8080;
root /home/ly/www/php-back;
index index.html index.htm index.php;
client_max_body_size 100m;

# 开启gzip压缩加快访问速度
gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
#gzip_http_version 1.0;
gzip_comp_level 3;
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_vary off;
gzip_disable "MSIE [1-6]\.";

location / {
try_files $uri $uri/ /index.php?s=$uri&$args;
}

# 开启PHP支持
location ~ \.php {
include fastcgi_params;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
fastcgi_pass unix:/var/run/php/php7.0-fpm.sock;
fastcgi_index index.php;
fastcgi_split_path_info ^(.+\.php)(.*)$;
fastcgi_param PATH_INFO $fastcgi_path_info;
}
}

 

 

 

 

我的博客即将同步至腾讯云开发者社区，邀请大家一同入驻：https://cloud.tencent.com/developer/support-plan?invite_code=3cn0udci9ym88

相关文章

文章评论

栏目导航

点击排行

  • 禁用spring-security
    出于一些功能调试目的，需要临时关闭spring-security，本以为简单的配置security.enable=false即可，实际操作发现无法生效，经过查阅资料发现彻底禁用需要参考如下配置。
  • 一种纯css实现tab切换效果的方案
    很多场景下不希望用JS污染环境，或者无法直接使用JS，比如markdown中，可以使用css来直接实现tab切换，css实现tab切换有很多伤方法，这里提出一种网上不多见的方案。
  • SpringBoot3.0打包二进制可执行文件
    go语言等打包二进制发布的方式非常方便，oracle很早之前就开始研究一个叫做GraalVM的虚拟机，GraalVM不仅支持java,还支持js等其它语言，最重要的一点是，它可以将java打包成二进制执行，也就是说生成环境不需要再安装jdk，只需要双击二进制可执行文件即可运行，无论是便利性还是运行速度、包括内内存占用都得倒极大的优化。
  • SpringBoot启动报错Unable to find a suitable main class
    Unable to find a suitable main class, please add a 'mainClass' property
  • Vue3组合式API使用教程
    通过使用 Vue组合式API ，我们可以将界面中重复的部分连同其功能一起提取为可重用的代码段。
  • Ubuntu1804配置VNC支持
    Ubuntu配置VNC支持前提需要图形环境，接着以下按步骤操作。
  • 单体项目中内置spring-cloud-config并使用mysql存储配置
    随着微服务的流行，越来越多的项目开始使用配置中心来管理项目中复杂的配置，但是也有很多项目仍然在使用单体式架构，那么单体架构如何内置一个配置中心便于随时在后台修改配置呢。
  • Macos brew update 慢~~~
    Homebrew 通过 Git 来工作的, 默认的源是 Github. 因为众所周知的原因, update超级慢!
  • 发送TRC20-Token交易
    波场网络跟以太坊很像，特别是接口设计，token的发送目标首先是合约地址而不是接收token的钱包地址，其次参数里加上接收者钱包地址和数量。
  • 小谈PNG转SVG的方法 在线转换网站与illustrator
    本文主要探讨JPG/PNG转SVG矢量格式并支持FILL的方法，介绍在线转换网站和通过illustator转换的经验。

友情链接

官方微信