dcat admin + dingo + nginx 开发前台

前言

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 应用的正确处理和相互协作。