如何使用 React-Router 和 Express 后端返回有效的 JSON 响应？答案

【问题标题】：How can I return a valid JSON response with React-Router and an Express backend?如何使用 React-Router 和 Express 后端返回有效的 JSON 响应？
【发布时间】：2020-07-24 09:14:46
【问题描述】：

我的设置类似于tutorial 中的设置。如何单独呈现 JSON（无 HTML）而无需为index.js 中指定的路由指定端口号？在我自己的设置中，我可以通过访问 https://socialmaya.com/u/real 查看 JSON，但除非我访问 http://socialmaya.com:5000/actors/real，否则无法获得实际的 JSON 响应，这就是 React 所调用的。

这是我的code，它试图为使用 MERN 堆栈构建的社交网络实现 ActivityPub API。我的Nginx配置可以在here找到。

【问题讨论】：

我猜你想渲染那个 json 的数据。我说的对吗？如果这是您想要的，您需要使用 axios、ajax、fetch 或类似的东西向该路由提出请求，它将返回 json 数据。
我需要在没有任何 HTML 封装的情况下呈现 JSON 本身。如果您点击查看 socialmaya.com/u/real 和 socialmaya.com:5000/actors/real 的页面源代码，您会看到我的意思的不同。
所以我需要将 JSON 本质上呈现为纯文本（无需为后端指定端口号）但如果我在我的项目。
我的意思是，两个网站的内容是一样的，唯一不同的是字体。
我认为 Mastodon 或任何其他使用 ActivityPub 的社交网络需要接收作为有效或纯 JSON 的响应。据我所知，如果 JSON 是通过 React 组件呈现而不是以明文响应返回，其他服务器或机器将无法成功读取数据。

标签： node.js json reactjs express react-router

【解决方案1】：

在 Nginx 中向上游传递之前重写 URL 解决了我的问题：

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

【讨论】：

有没有更好的方法来做到这一点，不需要为我用 Express 定义的每个路由添加 Nginx 重写，我希望能够在不指定端口号的情况下访问，返回有效的 JSON ，并且可以通过浏览器或类似 curl 的方式访问？