After successfully deploying my project on CentOS 7, I set up port forwarding to access it through port 8080. This means that in order to use the site, you had to navigate to it using the IP followed by :8080. Below is the NGINX configuration I utilized for both the front-end and backend reverse proxy:
NGINX Configuration for the Site
server {
listen 80;
listen [::]:80;
server_name myapp.com etc.com;
#my api
location / {
// Proxy settings
}
#my app
location /myapp {
// More proxy settings
}
}
Error encountered:
FetchError: request to http://ipaddress:8080/auth/checkauth failed, reason: connect ETIMEDOUT ipaddress:8080
at ClientRequest.<anonymous> (/root/web/myapp/node_modules/next/dist/compiled/node-fetch/index.js:1:64142)
// Error details
_middleware.ts file content:
// Middleware code snippet
The application functions properly in a production environment, including the Axios API integration. While I can successfully login to my app using an Axios request, my middleware which includes a fetch API and getServerSideProps with a fetch API is encountering a "connect ETIMEDOUT" error.
Attempts made to resolve the issue:
- Utilizing proxy agent
- Switching from fetch API to Axios with adapter
- Experimenting with URL configurations
- Enabling CORS on my API
I was able to call my API endpoint using curl within the server and Postman on my local machine. Interestingly, another NextJS app deployed on a Linux server following a similar process—albeit without port forwarding—does not encounter any issues with fetch API in middleware and getServerSideProps. This leads me to believe that the port forwarding could be causing the problem.
The version of NextJS used is v12.1.6