Reactjs application can not reach my Spring Boot backend using https requests

Question

I have a ReactJS application running on https://localhost:8080 and i would like to POST data to my Spring Boot backend app running on https://localhost:8443 , but when i try to POST data..i get this error in my browser console:

TypeError: "NetworkError when attempting to fetch resource." Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://localhost:8443/api/ ... (Reason: CORS request did not succeed).

My Spring Boot application not using Spring Security. I enabled HTTPS by this tutorial. I running my ReactJS application with HTTPS=true npm start and i changed the react application port like "start": "PORT=8080 react-scripts start" inpackage.json

This is my application.properties:

server.ssl.key-store-password = password
server.ssl.key-store-type = PKCS12
server.ssl.key-alias = tomcat
server.ssl.enabled=true

and here is how t tried to call the REST API from React:

fetch('https://localhost:8443/api/..., {
            method: 'POST'
        }).then((data) => {
            if (data.ok) {
                this.setState({ 
                response: data })
            }
        })
        .catch(console.log);

Here is my @RestController:

@RestController
@RequestMapping("/api")
public class MessageReceiverResource {

    @CrossOrigin(origins = "https://localhost:8080")
    @PostMapping
    public Response receiveMessages(@RequestBody Request request){
           ...
        return response;
    }
}

This solution just worked fine until I enabled HTTPS.

Answer 1

解决方案是将这一行添加到 package.json: "proxy": "https://localhost:8443",