繁体   English   中英

通过从 json 文件中提取路由路径,在 express 中动态更改路由

[英]Change route dynamically in express by extracting route path from json file

我正在尝试以 express 动态更改我的路线,其中确切的链接存储在 json 文件中。 我的json存储在 article.js 中,看起来像这样:

  title: 'title1',
  link: 'title2',
  creator: 'user1',
  createdAt: '17/10/2021',
  description: 'Test description',
  publish: 'True',
  text: 'This is a sample text'
},
{
  title: 'title2',
  link: 'title2',
  creator: 'user3',
  createdAt: '17/10/2021',
  description: 'Test description',
  publish: 'True'
},
{
  title: 'title3',
  link: 'title3',
  creator: 'user2',
  createdAt: '17/10/2021',
  description: 'Test description',
  publish: 'True'
}]

exports.articles = articles;

在我的get-route期间,我动态地渲染到 blog_articles 页面,将超链接更改为动态路由\theme\title1\theme\title2等。 我的快速路线定义如下:

const router = express.Router()

const Articles = require('../articles/articles');

router.get("/", async (req, res) => {
    const articles = await Object.values(Articles.articles).filter(all => all.publish ==='True');
    res.render("theme", {articles: articles});
});


router.get("/:link", async (req, res) => {
    var link = req.params.articles.link
    const articles = await Object.values(Articles.articles).filter(all => all.publish ==='True');
    res.render("blog_articles", {articles: articles.link});


    res.send(articles.link);
    res.send(req.params.id);
    //const articles = await Object.values(Articles.articles).filter(all => all.publish 
});

编辑:这是theme.ejs

<!DOCTYPE html>
<html lang="en">
    <body>
        <div class="container px-4 px-lg-5">
            <div class="row gx-4 gx-lg-5 justify-content-center">
                <div class="col-md-10 col-lg-8 col-xl-7">
                    <!-- Post preview-->
                    <div class="post-preview">
                        <object data="README.md" type="text/html"></object>
                        <a href="/index">
                            <% articles.forEach(article => { %>
                                <h2 class="post-title" style="margin-bottom: -1.41rem"><a href="futureai/<%=article.link %>", id="Android"><%= article.title %></a></h2>
                            </a>
                            <br class="post-gap-title-description" style="margin-bottom: 0.25rem">
                            <h4 class="post-description" style="font-weight: 300"><%= article.description %></h4>
                            <p class="post-meta">
                            Posted by
                            <a href="#!">
                                <%= article.creator %>
                            </a>
                             on
                             <a href="#"><%= article.createdAt %></a>
                            </p>
                            <hr class="my-4" />
                            <% }) %>
                    </div>
                    <!-- Divider-->
                    <hr class="my-4" />
                    <!-- Post preview-->
                    <!-- Divider-->
                    <hr class="my-4" />
                    <!-- Pager-->
                    <div class="d-flex justify-content-end mb-4"><a class="btn btn-primary text-uppercase" href="#!">Older Posts →</a></div>
                </div>
            </div>
        </div>

        
    </body>
</html>

使用find获取您需要的文章:

router.get("/:link", async (req, res) => {
    var link = req.params.link
    const article = Object.values(Articles.articles)
      .filter(all => all.publish ==='True')
      .find(article => article.link === link)
    res.render("blog_articles", {articles: article.link});

    // You have already sent a response, following code is useless
    // res.send(articles.link);
    // res.send(req.params.id);
});

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM