How can I return a valid JSON response with React-Router and an Express backend?

Question

I have a setup similar to the one in this tutorial. How can I render JSON alone (no HTML) without having to specify the port number for the route specified in index.js? Within my own setup, I can view JSON by visiting https://socialmaya.com/u/real but can't get an actual JSON response unless I visit http://socialmaya.com:5000/actors/real, which is what's being called by React.

Here is my code which is an attempt to implement an ActivityPub API for a social network built using the MERN stack. My Nginx configuration can be found here.

I guess you want to render the data of that json. I'm I right? If that is what you want you need to do a petition to that route with axios, ajax, fetch or something like this and it will return the json data. — Carlos Saiz Orteu
– Carlos Saiz Orteu, Commented Apr 11, 2020 at 20:04
I need to render the JSON itself without any HTML whatsoever encapsulating it. You can see the difference in what I mean if you click to View Page Source for socialmaya.com/u/real and socialmaya.com:5000/actors/real. — Forrest Wilkins
– Forrest Wilkins, Commented Apr 11, 2020 at 20:14
So I need to render the JSON as plaintext essentially (without having to specify a port number for the backend) but it seems like this might be impossible if I'm using React-Router at all in my project. — Forrest Wilkins
– Forrest Wilkins, Commented Apr 11, 2020 at 20:17
I mean, the content of both webs are the same, only thing changing is the font. — Carlos Saiz Orteu
– Carlos Saiz Orteu, Commented Apr 11, 2020 at 20:21
I think that Mastodon or any other social network using ActivityPub needs to receive the response as valid or pure JSON. As far as I know, if the JSON is being rendered through a React component instead of being returned in a plaintext response, other servers or machines won't be able to read the data successfully. — Forrest Wilkins
– Forrest Wilkins, Commented Apr 11, 2020 at 20:26

Forrest Wilkins · Accepted Answer · 2020-04-13 14:18:55Z

0

Rewriting the URL before passing it upstream within Nginx solved my problem:

location / {
    rewrite ^/u/(.*)$ /actors/$1 last;
    proxy_pass http://localhost:5000;
}

answered Apr 13, 2020 at 14:18

Forrest Wilkins

5568 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Forrest Wilkins Over a year ago

Is there a better way of doing this that doesn't require adding an Nginx rewrite for every route I define with Express that I want to be able to access without specifying a port number, that returns valid JSON, and is able to be reached by the browser or something like curl?

Collectives™ on Stack Overflow

How can I return a valid JSON response with React-Router and an Express backend?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related