Search code examples
nginxurl-routingstrapi

How do I configure Strapi and NGINX routing for a subdomain?

I am looking for assistance with configuring subdomains and routing for a server hosting my Strapi app. The server has two subdomains, admin.website.com and api.website.com. Currently, the app is running on port 1338 at http://localhost:1338.

I need to configure the API to be accessible through api.website.com and the admin page to be accessible through admin.website.com. Essentially, I want to map the local URLs to their respective subdomains:

Local URL Subdomain URL
http://localhost:1338/api/blog-article http://api.website.com/blog-article
http://localhost:1338/admin http://admin.website.com
http://localhost:1338/admin/content-manager/collectionType/api::blog-article.blog-article http://admin.website.com/content-manager/collectionType/api::blog-article.blog-article
http://localhost:1338/admin/auth/login http://admin.website.com/auth/login

I have started implementing the configuration using NGINX. For the API, the configuration was straightforward. I created a configuration file for api.website.com and used proxy_pass to redirect requests to http://localhost:1338. After restarting NGINX, the API was successfully available at http://api.website.com/blog-article.

However, I encountered difficulties configuring the admin page. I tried adjusting the url parameter in the project's configuration files (config/admin.js and config/server.js), but it did not yield the desired result.

One of the attempts I made was setting the url parameter to / in config/admin.js, hoping to bypass the welcome page and directly display the admin page. Unfortunately, I received an error indicating that a pathname is required.

As a temporary solution, I made the following updates to the configurations:

In config/admin.js, I removed the url parameter. In the NGINX configuration file for admin.website.com, I added rewrite rules to remove the /admin path. With these changes, I can access the admin page at http://admin.website.com. However, the links within the admin pages still contain the /admin path, which is the default value set in config/admin.js.

// config/admin.js

module.exports = ({ env }) => ({
  auth: {
    secret: env('ADMIN_JWT_SECRET'),
  },
  apiToken: {
    salt: env('API_TOKEN_SALT'),
  }
});

# /etc/nginx/sites-available/admin.website.com.conf

server {

  listen 80;
  server_name admin.website.com;

  location / {

    proxy_pass http://localhost:1338;
    rewrite /(.+) /$1 break;
    rewrite / /admin break;

    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
  }
}

As a result, the URLs appear as follows:

...and so on.

I would appreciate guidance on how to properly configure the routing to fix the admin page paths.

Solution

  • it’s not that easy sadly, the admin url is postfix of server url. You prolly have to do a redirection middleware:

    https://docs.strapi.io/dev-docs/deployment/nginx-proxy#redirecting-landing-page-to-admin-panel

    But you gonna need to add whole a lot of routes.

    Also you have to take in consideration that /api should be:

    https://api.your-domain.com/api because strapi would use https://api.your-domain.com for plugin routes (you can check witch routes are used by yarn strapi routes:list).

    So technically it would be easier to redirect /api, /uploads and keep strapi under admin.your-domain.com