使用来自 JSON 响应的 Express 和 EJS 模板动态创建路由

Question

我有许多产品，并且想为每个产品动态创建一个路由，因此当我将产品添加到 CMS 时，我正在调用 API 以获取 JSON，它会自动创建页面而不是手动编码。

JSON 树

表达：

var scopedEntries;

//get contentful entries
client.getEntries() //get entries
.then(function (entries){
  scopedEntries = entries; //assigning globally to later pass into routes
  console.log(entries.items[0].fields.companyName); //log data
}); // end of promise

router.get('/test:id', function (req, res) {
  //console.log(scopedEntries);
  res.render('test' + req.params.id, {
    entries: scopedEntries
    });
  });

模板示例：

<html>
  <head>
    <title>TEST APP</title>
  </head>
  <body>
    <h1><%= entries.items[0].fields.companyName %></h1>
    <h2><%= entries.items[1].fields.productName %></h2>
    <p>Description: <%= entries.items[1].fields.productDescription %></p>
    <p>Size: <%= entries.items[1].fields.sizetypecolor %></p>
    <p>Price: <%= entries.items[1].fields.price %></p>
    <p>SKU: <%= entries.items[1].fields.productDescription %></p>
    <img src="<%= entries.includes.Asset[0].fields.file.url %>" alt="" />
  </body>
</html>

所以理想情况下，JSON 响应中的每个项目都有一个页面，并且它是在快速路由中使用 EJS 动态创建的。 我将如何正确地做到这一点。

此外，JSON 不是最终的 JSON。该模式还没有完全播种，所以我需要调整它以适应我的树。

Answer 1

您可能不想为每种产品创建新路线。 可能您想创建一个处理所有产品的单一路由，然后在路由中指定一个参数（路由的一部分或查询参数），以告诉单个路由处理程序应显示哪个产品。

具体如何执行取决于您网站的整体URL设计。 但是，您可能有一个/product/view/:productName的路由。 或/product/view/:productID并具有一个路由处理程序来处理您所有的产品。 如果有人输入了不存在的productName或productID ，那么您只需做一个漂亮的404页面。

您用于此路由的一个路由处理程序将从URL中获取productName或productID（取决于要设计的产品名称），然后在数据库中查找有关该产品的所有相关信息。 然后，它将所有这些数据放入数据结构（可能是具有很多属性的对象），然后将该数据结构传递给res.render(templateName, data) 。 然后，模板引擎会将数据放入模板指定的生成的HTML页面中。

如果某些产品显示不同类型的信息，则您的模板必须是所有需要显示的内容的超集，并且您对模板进行编码，以根据传递给res.render() 。

Answer 2

使用路由参数。 航线路径：/flights/:from-:to Request URL: http://localhost:3000/flights/LAX-SFO req.params: { "from": "LAX", "to": "SFO" }