如何在服务器端渲染中使用 Mongodb答案

【问题标题】：How to use Mongodb in Server Side Rendering如何在服务器端渲染中使用 Mongodb
【发布时间】：2020-10-20 16:02:18
【问题描述】：

我正在尝试使用 React、React Router 和 webpack 在 Express 中建立一个基本的猫鼬连接

有 ssr 和 Mongodb 的例子吗？

服务器应该是什么样的？



const app = express();
app.use(express.static("./build"));
app.get("*", (req, res) => {
      const url = req.originalUrl || req.url;
      const context = {};
      const indexFile = path.resolve("./build/main.html");
      if (context.url) {
            req.header("Location", context.url);
            return res.send(302);
      }
      const css = new Set();
      const insertCss = (...styles) =>
            styles.forEach((style) => css.add(style._getCss()));
      const appContent = ReactDOMServer.renderToString(
            <StyleContext.Provider value={{ insertCss }}>
                  <StaticRouter
                        location={req.url}
                        context={context}
                  ></StaticRouter>
            </StyleContext.Provider>
      );
      fs.readFile(indexFile, "utf8", (err, data) => {
            if (err) {
                  console.log(err);
                  return res.status(500).send("ne rabotaet");
            }
            data = data.replace("__STYLES__", [...css].join(""));
            data = data.replace(
                  "<div id=app></div>",
                  `<div id=app>${appContent}</div>`
            );

            return res.send(data);
      });
});
app.listen(3000, () => {
      console.log("Listenning on port: ", 3000);
});

【问题讨论】：

您好！已添加到问题中的代码当前没有对猫鼬的任何引用？您能否用 sn-ps 更新您可能尝试建立 mongo 连接的问题。

标签： node.js reactjs mongodb

【解决方案1】：

请参考下面的服务器模板，该模板用于带有 Mongoose 连接的 Next Js 项目 (SSR)。 server.js

require('dotenv').config();
    
    const express = require('express');
    const server = express();
    const bodyParser = require('body-parser');
    const mongoose = require('mongoose');
    const next = require('next');
    
    const dev = process.env.NODE_ENV !== 'production';
    const app = next({dev});
    
    const routes = require('./routes');
    const routerHandler = routes.getRequestHandler(app);
    
    const {config} = require('../config');
    
    const transactionRouter = require('./api/transaction');
    
    app.prepare().then(() => {
        // Parse application/x-www-form-urlencoded
        server.use(bodyParser.urlencoded({extended: false}));
        // Parse application/json
        server.use(bodyParser.json());
    
        // Allows for cross origin domain request:
        server.use(function (req, res, next) {
            res.header('Access-Control-Allow-Origin', '*');
            res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
            next()
        });
        console.log("mongodb ", config.databaseUrl);
        // MongoDB
        mongoose.Promise = Promise;
        mongoose.connect(config.databaseUrl, {useNewUrlParser: true});
        const db = mongoose.connection;
        db.on('error', console.error.bind(console, 'connection error:'));
    
        // REST API routes
        server.use('/api/transactions', transactionRouter);
    
        // Next.js page routes
        server.get('*', routerHandler);
    
        // Start server
        server.listen(config.serverPort, () => console.log(`${config.appName} running on http://localhost:${config.serverPort}/`))
    });

【讨论】：