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

Posted

技术标签:

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

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

有 s-s-r 和 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 连接的问题。 【参考方案1】:

请参考下面的服务器模板,该模板用于带有 Mongoose 连接的 Next Js 项目 (s-s-r)。 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/`))
    );

【讨论】:

以上是关于如何在服务器端渲染中使用 Mongodb的主要内容,如果未能解决你的问题,请参考以下文章

Centos宝塔上面如何部署Nuxt服务端渲染项目

Centos宝塔上面如何部署Nuxt服务端渲染项目

哪种方法更快,表示:服务器端渲染与客户端渲染

如何使用 api 在服务器端呈现反应?

如何在 React/redux 中进行服务器端渲染?

如何在反应服务器端渲染中正确处理 window=undefined 错误