AWS EC2部署Rails开发版应用遇Nginx 403 Forbidden错误求助

Got it, let's figure out why you're hitting that 403 Forbidden from Nginx. The error log says it's trying to access the directory index of /home/ubuntu/<app-name>/client/ but can't—here are the most common fixes to try, ordered by likelihood:

1. Check if Your Frontend Has a Built Index File #

First up—chances are your client-side app (like React, Vue, etc.) hasn't been built yet, so there's no index.html in that client/ directory. SSH into your EC2 instance and run:

ls -la /home/ubuntu/<app-name>/client/

If you don't see index.html, you need to build your frontend:

• Navigate to the client directory: cd /home/ubuntu/<app-name>/client
• Install dependencies (if needed): npm install
• Run the build command (varies by framework, e.g., React uses npm run build)
• Then update your Nginx config to point to the build output directory (usually client/build/ or client/dist/) instead of the raw source directory.

2. Explicitly Set the Index File in Nginx #

If you do have an index.html in the client directory, Nginx might not be recognizing it as the default index. Open your Nginx site config (typically in /etc/nginx/sites-available/your-app.conf or /etc/nginx/conf.d/default.conf) and add/modify the index directive in your server block:

server {
    listen 80;
    server_name _; # Replace with your domain if you have one

    root /home/ubuntu/<app-name>/client; # Or the build directory if you built it
    index index.html index.htm; # Make sure your default file is listed here

    # Rest of your config...
}

Test the config to avoid syntax errors:

sudo nginx -t

If it passes, restart Nginx to apply changes:

sudo systemctl restart nginx

3. Verify File Permissions for Nginx #

Nginx runs as the www-data user by default—if it doesn't have read access to your client directory or files, it'll throw a 403. Fix permissions with these commands:

# Give ownership to www-data
sudo chown -R www-data:www-data /home/ubuntu/<app-name>/client/
# Set readable/executable permissions
sudo chmod -R 755 /home/ubuntu/<app-name>/client/

Restart Nginx after making permission changes.

4. (Optional) Allow Directory Indexing (Not Recommended for Frontends) #

If you actually want Nginx to show a list of files in the directory (unlikely for a production frontend app), you can enable autoindex in your location block:

location / {
    autoindex on;
}

But for most single-page apps, this isn't needed—stick to using index.html as your entry point.

5. Configure Nginx to Handle Rails API + Frontend Together #

If your app is a Rails API paired with a static frontend, make sure Nginx routes API requests to Rails and serves static files for everything else. Here's a sample config to handle this:

server {
    listen 80;
    server_name _;

    # Serve frontend static files from the build directory
    root /home/ubuntu/<app-name>/client/build;
    index index.html;

    # Forward API requests to Rails (assuming Puma runs on port 3000)
    location /api {
        proxy_pass http://localhost:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }

    # Fix SPA routing: redirect all non-file requests to index.html
    location / {
        try_files $uri $uri/ /index.html;
    }
}

After trying these steps, test your public IPv4 address again—this should resolve the 403 error.

内容的提问来源于stack exchange，提问作者anonn023432