如何建设一个网站站公司的网络拓扑图

前言

Dcat Admin 是一个功能强大的后端框架，主要用于开发管理后台。然而，大多数网站不仅需要一个管理后台，还需要一个用户界面，即“前台”，以及它们自己的用户系统。

为了实现这一目标，我们需要对 Dcat Admin 进行一些改造，使其能够处理前台用户信息。

第一步：整合 Dcat Admin 与前台

详细的步骤和方法可以在我的另一篇文章中找到：Dcat Admin框架开发前台。

第二步：集成 Dingo 以快速搭建 API

在构建现代网站时，快速有效地搭建 API 是至关重要的。Laravel 8.* 集成 Dingo 可以帮助我们达到这个目标。更多关于如何在 Laravel 8.* 中集成 Dingo 的细节，可以参考我的文章：laravel8.*集成dingo。
我目前dcat admin使用的版本基于laravel8.*

第三步：配置 Nginx

为了确保我们的前后端应用正确运行，合适的 Nginx 配置是必不可少的。下面是一个示例配置：

server {listen 80;server_name game.fendouweiqian.top;index index.html index.htm default.html default.htm default.php;# 默认情况下，服务 Vue 应用root /home/wwwroot/game.fendouweiqian.top/html;# admin是代理管理后台，api是代理的前台接口location ~ ^/(api|admin) {proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header REMOTE-HOST $remote_addr;proxy_set_header X-Forwarded-For  $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto  $scheme;proxy_pass http://localhost:81;}# 注意这里，重新定位dcat admin的资源目录location ~ ^/vendor/dcat-admin {root /home/wwwroot/game.fendouweiqian.top/public;}# Vue 应用入口location / {try_files $uri $uri/ /index.html;}location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|js|css)$ {expires 30d;}location ~ /.well-known {allow all;}location ~ /\.{deny all;}access_log /home/wwwlogs/game.access.log combined;error_log /home/wwwlogs/game.error.log warn;
}server {listen 81;# 注意这里，不加上会影响链接的跳转，导致跳转地址变成：http://localhost:81的本地真实访问地址absolute_redirect off;server_name localhost;index index.php default.html default.htm default.php;charset utf-8;root /home/wwwroot/game.fendouweiqian.top/public;include rewrite/laravel.conf;include enable-php.conf;
}

这个配置确保了前端 Vue 应用和后端 Laravel 应用的正确处理和相互协作。