我正在使用快速制作一个简单的天气应用程序，并将我从API获取的天气信息传递给html文件，我在那里使用ejs来显示它们。
这是用于创建服务器的文件：
const express = require("express");
const bodyParser = require("body-parser");
const request = require("request");
const app = express();
const apiKey = "*******************";
app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: true }));
app.set("view engine", "ejs");
app.get("/", function (req, res) {
res.render("index", { weather: null, error: null });
});
app.post("/", function (req, res) {
res.render("index");
console.log(req.body.city);
let city = req.body.city;
let url = `http://api.openweathermap.org/data/2.5/weather?q=${city}&units=imperial&appid=${apiKey}`;
request(url, function (err, response, body) {
if (err) {
res.render('index', { weather: null, error: 'Error, please try again' });
} else {
let weather = JSON.parse(body);
if (weather.main == undefined) {
res.render('index', { weather: null, error: 'Error, please try again' });
} else {
let weatherText = `It's ${weather.main.temp} degrees in ${weather.name}!`;
res.render('index', { weather: weatherText, error: null });
}
}
});
});
app.listen(8080, function () {
console.log("Example app listening on port 8080 !");
});
这是我的带有ejs的html文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="/css/style.css" />
</head>
<body>
<h1>Know Your Weather ! </h1>
<div class="container">
<fieldset>
<form action="/" method="POST">
<input name="city" type="text" class="ghost-input" placeholder="Enter a City" required>
<input type="submit" class="ghost-button" value="Get Weather">
</form>
<% if(weather !== null){ %> <p><%= weather %></p><% } %>
<% if(error !== null){ %> <p><%= error %></p><% } %>
</fieldset>
</div>
</body>
</html>
但是当我在网站上输入时，我收到以下错误：
> ReferenceError: /home/anirudh/Desktop/weather-app/views/index.ejs:20
> 18| <input type="submit" class="ghost-button" value="Get Weather">
> 19| </form>
> >> 20| <% if(weather !== null){ %> <p><%= weather %></p><% } %>
> 21| <% if(error !== null){ %> <p><%= error %></p><% } %>
> 22| </fieldset>
> 23| </div>
>
> weather is not defined
> at eval (eval at compile (/home/anirudh/Desktop/weather-app/node_modules/ejs/lib/ejs.js:618:12),
> <anonymous>:11:8)
> at returnedFn (/home/anirudh/Desktop/weather-app/node_modules/ejs/lib/ejs.js:653:17)
> at tryHandleCache (/home/anirudh/Desktop/weather-app/node_modules/ejs/lib/ejs.js:251:36)
> at View.exports.renderFile [as engine] (/home/anirudh/Desktop/weather-app/node_modules/ejs/lib/ejs.js:482:10)
> at View.render (/home/anirudh/Desktop/weather-app/node_modules/express/lib/view.js:135:8)
> at tryRender (/home/anirudh/Desktop/weather-app/node_modules/express/lib/application.js:640:10)
> at Function.render (/home/anirudh/Desktop/weather-app/node_modules/express/lib/application.js:592:3)
> at ServerResponse.render (/home/anirudh/Desktop/weather-app/node_modules/express/lib/response.js:1008:7)
> at /home/anirudh/Desktop/weather-app/server.js:17:9
> at Layer.handle [as handle_request] (/home/anirudh/Desktop/weather-app/node_modules/express/lib/router/layer.js:95:5)
我对ejs做错了什么？
问题出在你定义的post路线上：
app.post("/", function (req, res) {
res.render("index");
// ...
对res.render的这个调用不提供任何本地人，因此，没有定义weather。我没有尝试过，但这立刻引起了我的注意，我很确定这是你遇到的错误的根源 - 特别是因为你说它只在你提交数据时才会发生。
我认为这是以前版本或某些调试的意外遗留，因为您在下面正确呈现了几行。如果您只是删除对res.render的调用，我想这些事情应该按预期工作。