403 Forbidden: When accessing index.php/wp-json (React, Wordpress, NGINX)

Question

I am using NGINX. I have two applications running on my box. React (localhost:3000) and Wordpress (localhost:8080). The react application is accessible via / while the wordpress is accessible only via /wp-admin. I am trying to allow the applications to connect. So the react app can send requests to WP.

My wordpress installation has plugins that are trying to access/send requests to links that have https://myserver.com/index.php/wp-json/ in front of them. I am getting 403 forbidden errors on the requests.

This is what my current nginx config looks like.

server {
    server_name myserver.com www.myserver.com;
    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot

    ssl_certificate /etc/letsencrypt/live/server.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/server.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

    # Handle main site and React app
    location / {
        proxy_pass http://localhost:3000; # Assuming React runs on port 3000
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    # Handle WordPress API and admin requests specifically
    location ~ ^/(wp-json|wp-admin|wp-login.php) {
        proxy_pass http://localhost:8080; # Assuming WordPress runs on localhost:8080
        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;
    }

    # Process PHP files
    location ~ \.php$ {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/var/run/php/php8.1-fpm.sock;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        include fastcgi_params;
    }

    # Handle requests to /index.php that are not part of the API or admin
    location ~ ^/index.php {
        include snippets/fastcgi-php.conf;
        fastcgi_pass unix:/var/run/php/php8.1-fpm.sock;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        include fastcgi_params;
    }
}
server {
    listen 80 default_server;
    listen [::]:80 default_server;
    server_name myserver.com www.myserver.com;

    if ($host = www.myserver.com) {
        return 301 https://$host$request_uri;
        } # managed by Certbot

        if ($host = myserver.com) {
            return 301 https://$host$request_uri;
            } # managed by Certbot

            return 404; # managed by Certbot
        }
        ⁠

Any help would be greatly appreciated reagarding this issue.

Ive tried everything at this point. Mind that im not an expert with NGINX configs.