Question

我正在尝试使用ejs访问从服务器传递到客户端的变量

我的服务器文件：

router.get('/', function (req, res, next) {
    res.render('chat', {user: req.user, message: null});
});

我的客户文件：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" const="text/html;charset=UTF-8"/>
    <link href="http://fonts.googleapis.com/css?family=Comfortaa" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.4/socket.io.js"></script>
    <title>Simple Chat App</title>
</head>

<body>
<header>
    <h1>Super Chat</h1>
</header>

<section>
    <div id="change_username">
        <input id="username" type="text"/>
        <button id="send_username" type="button">Change username</button>
    </div>
</section>

<section id="chatroom">
    <section id="feedback"></section>
</section>


<section id="input_zone">
    <input id="message" class="vertical-align" type="text"/>
    <button id="send_message" class="vertical-align" type="button">Send</button>
</section>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript">
    <% var user = <% user %> %>
    console.log(user);
</script>
<script src="chat.js"></script>
</body>
</html>

我得到一个错误：

Could not find matching close tag for "<%".

我该如何解决？

Answer 1

<% var user = <% user %> %>

您不能嵌套<% %>个块。您位于EJS模式之内还是之外。您无法进入Extra Deep EJS模式。

此外，您也不能只将变量输出到客户端JS。您需要从该变量生成JavaScript源代码。 JSON.stringify是从对象，数组和字符串生成对象，数组和字符串文字的好方法。

<script>
    const user = <%- JSON.stringify(user); %>
    console.log(user);
</script>

请注意，使用<%-进行输出时不会转义HTML。

Answer 2

它表示找不到ejs模板的结束标记。您不需要在脚本中使用周围的ejs模板符号。

<script type="text/javascript">
var user = '<%= user %>'
console.log(user);
</script>

尝试一下。祝好运。：）

Answer 3

问题出在这里，您只需要替换模板中用户的值即可。

 var user = "<%=user%>" // Please change this line

更新的代码

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" const="text/html;charset=UTF-8"/>
    <link href="http://fonts.googleapis.com/css?family=Comfortaa" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.4/socket.io.js"></script>
    <title>Simple Chat App</title>
</head>

<body>
<header>
    <h1>Super Chat</h1>
</header>

<section>
    <div id="change_username">
        <input id="username" type="text"/>
        <button id="send_username" type="button">Change username</button>
    </div>
</section>

<section id="chatroom">
    <section id="feedback"></section>
</section>


<section id="input_zone">
    <input id="message" class="vertical-align" type="text"/>
    <button id="send_message" class="vertical-align" type="button">Send</button>
</section>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript">
    var user = "<%= user %>" // problem is here 
    console.log(user);
</script>
<script src="chat.js"></script>
</body>
</html>

希望对您有所帮助。

找不到与“ <％”匹配的关闭标签

3 个答案: