node.js - 如何在 MERN 堆栈应用程序中提供 JSON 文件
问题描述
我目前正在构建一个 MERN 堆栈应用程序,用作游戏的管理中心/后端。我的前端开发人员需要能够将他的一端连接到数据库中的我的端点。
我的问题是如何在我的应用程序中设置一个路由来提供从我的 MongoDB 到网页的 json 文件?我不想将 json 文件呈现到表或类似的东西,只需要它是原始 json。非常感谢任何建议!
这是我的意思的一个小例子:
这是我的服务器端 server.js:
const express = require('express');
const connectDB = require('./config/db');
const path = require('path');
const app = express();
//Connect Database
connectDB();
//Initialize Middleware - Allows for us to use 'req.body'
app.use(express.json({ extended: false }));
//Define Routes
app.use('/api/users', require('./routes/users'));
app.use('/api/auth', require('./routes/auth'));
app.use('/api/userplayers', require('./routes/userPlayers'));
//Serve React in Production
if(process.env.NODE_ENV === 'production') {
//Set static folder
app.use(express.static('client/build'));
}
app.get('*', (req, res) => {
res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
});
const PORT = process.env.PORT || 4000;
app.listen(PORT, () => console.log(`Server started on port ${PORT}`));
这是我的客户端app.js:
import React, { Fragment } from "react";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import Navbar from "./components/layout/Navbar/Navbar";
import Home from "./components/pages/Home";
import Players from "./components/pages/Players.js";
import Login from "./components/auth/Login";
import General from './components/pages/General';
import ContactState from "./context/contact/ContactState";
import AuthState from "./context/auth/AuthState";
import AlertState from "./context/alert/AlertState";
import setAuthToken from './utils/setAuthToken';
import Test from "./components/pages/Test";
if (localStorage.token) {
setAuthToken(localStorage.token);
}
const App = () => {
return (
<AuthState>
<ContactState>
<AlertState>
<Router>
<Fragment>
<Navbar />
<div className="container">
<Switch>
<Route exact path="/" component={Login} />
<Route exact path="/home" component={Home} />
<Route exact path="/players" component={Players} />
<Route exact path="/general" component={General} />
<Route exact path="/test" component={Test} />
</Switch>
</div>
</Fragment>
</Router>
</AlertState>
</ContactState>
</AuthState>
);
};
export default App;
解决方案
推荐阅读
- java - JOLT - 根据 if 条件在 JSONArray 中添加字段
- tfs - TFS 数据透视表?
- python - If, Else 在检查函数是否为真时不起作用
- python - 在 DF 中使用部分字符串
- javascript - 在 react-native 中创建了一个项目,但是当给 npx react-native run-android 一些错误时不断弹出
- visual-studio - 将 x86 项目转换为 x64 时如何解决错误 LNK1112?
- registry - 我可以在 Inno Setup 中一次注册多个 *.tlb 文件吗?
- excel - 文本框为数字时的自动过滤功能
- git - 如何在 GitLab 上指定要合并到的分支?
- ruby - Bourbon 安装错误:“错误的解释器:没有这样的文件或目录”