Frontend-Backend Communication Issue: SSL Protocol Error

Backend
1

I’m having trouble getting my React frontend to talk to my Spring Boot backend. They’re both located on the same droplet with Nginx handling SSL, yet I keep encountering an SSL protocol error. I’ve experimented with various ports, DNS addresses, and switching between HTTP and HTTPS, but nothing works. I expected them to connect easily since they reside on the same machine, but I’m stuck.

Here’s my revised setup:

// Example backend CORS configuration
@Override
public void registerCors(OriginRegistry registry) {
    registry.allowPattern("/**")
            .forOrigins("https://www.mysite.com", "http://localhost:3000")
            .withMethods("GET", "POST", "PUT", "DELETE")
            .enableCredentials();
}

# Sample Docker configuration
version: '3.8'
services:
  application:
    build: .
    ports:
      - "80:80"
      - "443:443"
    volumes:
      - /path/to/ssl/certificate:/ssl/certificate:ro
      - /path/to/ssl/key:/ssl/key:ro
    restart: unless-stopped

# Sample Nginx server configuration
server {
    listen 443 ssl;
    server_name www.mysite.com;

    ssl_certificate /ssl/certificate;
    ssl_certificate_key /ssl/key;
    # Additional SSL settings here

    location / {
        root /var/www/html;
        try_files $uri $uri/ /index.html;
    }
}

// Frontend API configuration
const API_BASE_URL = "https://123.45.67.89:8080";
const ACCOUNT_ENDPOINT = `${API_BASE_URL}/account`;
const SCORE_ENDPOINT = `${API_BASE_URL}/score`;

Any suggestions on how to resolve this error?

2

hey, have you looked into using a reverse prox with ngnix to bridge the gap between ur frontend and backend? also, maybe switching your api url to localhost might help. what other steps have u taken so far?

3

It seems you’ve already implemented some good practices, but there might be a few areas to investigate further. Have you verified that your SSL certificates are properly configured and up-to-date? Sometimes, certificate issues can cause SSL protocol errors. Additionally, ensure that your Spring Boot application is actually listening on the correct port (8080 in your case) and that this port is open and accessible. You might want to double-check your firewall settings to confirm there’s no blockage. Lastly, consider using environment variables for your API base URL in the frontend, allowing for easier switching between development and production environments. This approach can help isolate configuration issues more effectively.

4

hey whisperingwind, have u tried using https instead of the ip in ur API_BASE_URL? like https://www.mysite.com/api or something. also, double-check ur backend is actually running on port 8080. sometimes its the simple stuff that trips us up. good luck!