React front end is not communicating with spring boot REST API. Axios network err in console-CodePudding

Ive been trying to learn to integrate a reactJS frontend with a springboot backend. Ive build a demo CRUD app with a reactJS frontend, and spring boot java backend, following a tutorial. Im very new to react and javascript in general, having more experience with the java side of things, and im having a lot of trouble integrating the two halves together. The react app is inside the file structure of the springboot app. I have my springboot project running on port 8080 and the react app on 8081. I have both sides 'working', but when i try to start the servlet, and then start the react app, both start working but i get no communication between the two when i try to open the page on localhost:8081 and manipulate the UI. Please help a lowly js n00b figure this out, ive been working on it for about a week getting nothing new accomplished. When i start localhost:8081 i see my front page, but if i click anything, it doesnt work, and i see in console an error like this.

localhost:8080/api/tutorials:1 Failed to load resource: net::ERR_SSL_PROTOCOL_ERROR

with an axios error that looks like

AxiosError
code: "ERR_NETWORK"
config: {transitional: {…}, transformRequest: Array(1), transformResponse: Array(1), timeout: 0, adapter: ƒ, …}
message: "Network Error"
name: "AxiosError"
request: XMLHttpRequest {data: undefined, onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, …}
response: XMLHttpRequest {data: undefined, onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, …}
[[Prototype]]: Error

this is the tutorial i followed if its helpful.

https://www.bezkoder.com/react-spring-boot-crud/#Create_038_Setup_Spring_Boot_project

this is the github repo where i have all the code.. https://github.com/SeanRogan/CrudAppDemo/

frontend source code: https://github.com/SeanRogan/CrudAppDemo/tree/master/frontend/src

backend source code: https://github.com/SeanRogan/CrudAppDemo/tree/master/src/main/java/com/seanrogandev/crudapp/demo

pom.xml: https://github.com/SeanRogan/CrudAppDemo/blob/master/pom.xml

application.properties: https://github.com/SeanRogan/CrudAppDemo/blob/master/src/main/resources/application.properties

manifest.json: https://github.com/SeanRogan/CrudAppDemo/blob/master/frontend/public/manifest.json

package.json: https://github.com/SeanRogan/CrudAppDemo/blob/master/frontend/package.json

if theres any other relevant info i left out please let me know. thanks in advance.

CodePudding user response：

You are using HTTP on the backend side but react app tries to access with HTTPS. Check the http-common.js file.

    baseURL: "https://localhost:8080/api",

Changing to HTTP should work.