如何在不使用任何模板引擎的情况下将某些上下文从节点服务器发送到html模板

时间:2018-11-04 13:32:04

标签: node.js express

server.js

app.get('/',(req,res) => {
  let context = {title:"api",message:"root"}
  res.sendFile(__dirname + '/views/index.html',context)
})

index.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    title{{title}}
    message{{message}}
  </body>
</html>

如何将标题和消息发送到在contex变量中分配的index.html。

我发现使用jade,ejs,pug等模板引擎来做这件事的方法很多。但是我希望使用纯HTML。

请看一下我的代码。...

1 个答案:

答案 0 :(得分:0)

不使用诸如jade,ejs,pug之类的模板引擎或诸如angular,react之类的客户端库。
您不能在html端内插{{title}}的含义。

另一种方法是使用javascript从服务器获取详细信息

html文件

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
      <div id="test">
      </div>
    <script type="text/javascript">
        let url="http://localhost:8001/test";
        fetch(url).then(response => response.json())
        .then( (result) => {
            console.log('success:', result)
            let div=document.getElementById('test');
            div.innerHTML=`title: ${result.title}<br/>message: ${result.message}`;
        })
        .catch(error => console.log('error:', error));
    </script>
  </body>
</html>

server.js

app.get('/test',(req,res)=>{
    //res.sendFile(__dirname +"/views/test.html",);
    res.json({title:"api",message:"root"});
})

app.get('/render',(req,res)=>{
    res.sendFile(__dirname +"/views/test.html");
})