Quantcast
Channel: Active questions tagged https - Stack Overflow
Viewing all articles
Browse latest Browse all 1491

When I set up HTTPS, do I also need to change React's API endpoint address?

$
0
0

I've created a project with Express, React, and Nginx and am deploying it as an Azure VM.

Below is some code that uses Express' APIs in React (IPv4 addresses have been masked).

const response = await axios.get(`http://XX.XX.XXX.XXX/api/blog/posts/${postId}`,{withCredentials: true,});

I got a domain and wrote the Nginx files as shown below.

/etc/nginx/sites-available/default

server {listen 80 default_server;listen [::]:80 default_server;root /var/www/html;index index.html index.htm index.nginx-debian.html;server_name XX.XX.XXX.XXX;location / {proxy_pass http://localhost:3001;proxy_http_version 1.1;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection 'upgrade';proxy_set_header Host $host;proxy_cache_bypass $http_upgrade;proxy_connect_timeout 90;proxy_send_timeout 90;proxy_read_timeout 300;}}

/etc/nginx/sites-available/domain

server {listen 80;server_name example.com(my domain);root /var/www/html;index index.html index.htm index.nginx-debian.html;location / {proxy_pass http://localhost:3001;proxy_http_version 1.1;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection 'upgrade';proxy_set_header Host $host;proxy_cache_bypass $http_upgrade;}}

HTTPS will be set up by getting a certificate through certbot.

Once I have HTTPS set up, do I need to modify all the endpoints to https://[mydomain] when calling the backend's API from React?

In fact, I'm having a problem right now: if I access a webpage with an IPv4 address and do something that requires an API call, it works fine, but if I access the webpage with a domain address and do the same thing, it doesn't work properly. I think this is probably related to my problem (because the endpoints I'm using in React are written in IPv4).

I tried modifying the endpoint in React, but there were too many things to modify, so I wanted to see if there was another way to do it first.


Viewing all articles
Browse latest Browse all 1491

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>