☰

配置 NGINX：使用 nextjs 为 Wordpress Headless 配置 NGINX：

tag-icon • tag-icon nginx wordpress
配置 NGINX：使用 nextjs 为 Wordpress Headless 配置 NGINX：

我想创建一个 WordPress Headless（使用 /graphql uri 上的 wpgraphql API），其中前端将是 next.js。我希望前端（Next.js）和后端（WordPress.admin、内容和 API）都位于同一域。

为此，我希望所有针对/wp-admin/*和的请求/wp-content/*都/graphql定向到 WordPress。所有其他 uri 将通过反向代理重定向到 localhost:3000 中的 next.js 服务器。以下是 nginx 配置文件。

server {
  listen 80;
  listen [::]:80;
  root /var/www/wordpress;
  index index.php index.html index.htm;
  server_name localhost;

  client_max_body_size 100M;
  autoindex off;

  # WordPress 
  location / {
    try_files $uri $uri/ /index.php?$args;
  }

  location ~ \.php$ {
    include snippets/fastcgi-php.conf;
    fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    include fastcgi_params;
  }

  # Next.js
  location # ... {
    proxy_pass http://localhost:3000;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    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;
    proxy_set_header X-Forwarded-Host $host;
    proxy_set_header X-Forwarded-Port $server_port;
  }
}

任何帮助表示感谢，谢谢

答案1

nginx 使用指令指定的最长匹配前缀location。因此，以下设置应该可以满足您的要求。

您可以采取以下方法：

  location /wp-admin {
     try_files $uri $uri/ /index.php?$args;
  }
  
  location /wp-includes {
     try_files $uri $uri/ /index.php?$args;
  }
    
  location /wp-json {
     try_files $uri $uri/ /index.php?$args;
  }

  location /wp-content {
      try_files $uri $uri/ /index.php?$args;
  }

  location /graphql {
      try_files $uri $uri/ /index.php?$args;
  }

相关内容