简体   繁体   中英

How can I pass information from one function to another

I am working with a weather App using node and Ejs. Originally, after inputting the city, the information would display on the same page but I am trying to make it show on a new page called result. I have gotten to the point that the new page will load without any errors in console.log but none of the API information is appearing. It is just the HTML I have in the results file.

JS:

const express = require("express");
const https = require('https');
const ejs = require("ejs");
const bodyParser = require("body-parser");
const date = require(__dirname + "/result.js");

const app = express();

var city = {};
let weatherData = [];

app.use(bodyParser.urlencoded({
  extended: true
}));

app.set('view engine', 'ejs');
app.use(express.static("public"));

app.get("/", function(req, res) {

  res.sendFile(__dirname + "/index.html");
});

app.get("/index", function(req, res) {
  res.render("index");
});

app.post("/", function(req, res) {

  const query = req.body.cityName;
  const apiKey = "d56f0e3ec353b519c8e1fcfff89a4326";
  const units = "metric";
  const url = "https://api.openweathermap.org/data/2.5/weather?q=" + query + "&appid=" + apiKey + "&units=" + units;

  https.get(url, function(response) {
    console.log(response.statusCode);

    response.on("data", function(data) {
      const weatherData = JSON.parse(data)
      const temp = weatherData.main.temp
      const feels_like = weatherData.main.feels_like
      const description = weatherData.weather[0].description
      const icon = weatherData.weather[0].icon
      const clouds = weatherData.clouds.all
      const imageURL = "http://openweathermap.org/img/wn/" + icon + "@2x.png"
      const cloudsImageURL = "http://openweathermap.org/img/wn/03n@2x.png"

      console.log(weatherData);

    });

  });

  var city = query;
  res.redirect("/result");

})

const content1 = "11Scelerisque eleifend donec pretium vulputate sapien. Rhoncus urna neque viverra justo nec ultrices. Arcu dui vivamus arcu felis bibendum. Consectetur adipiscing elit duis tristique. Risus viverra adipiscing at in tellus integer feugiat. Sapien nec sagittis aliquam malesuada bibendum arcu vitae. Consequat interdum varius sit amet mattis. Iaculis nunc"

app.get("/result", function(req, res) {
  res.render('result', {
    content: content1,
    description: weatherData.description,
    city: weatherData.city,
    temp: weatherData.temp,
    feelsLike: weatherData.feels_like

  });

});

app.listen(3300, function() {
  console.log("Server is running on port 3300.");
});

EJS (Result page)

<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Weather App</title>
    
    <link href="/css/style.css" rel="stylesheet" type="text/css" />
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;900&display=swap" rel="stylesheet">
  </head>
  <body>
  
    <div id="wrapper" class="result-pg">
        
        <h1>The weather is currently <span class="description"><%= description %></span></h4>
        <img class="weather-img" src="">
        <h1>The temperature in <span class="city"><%= city %></span> is <span class="temp"><%= temp %></span> degrees. It feels more like <span class="feels-like"><%= feelsLike %></span></h1>
        
        <p><%= content %></p>
          
    </div>

  </body>
</html>

Any help would be appreciated.

You're setting a local variable weatherData to the response from the API. You need to put it in the global variable that's used in the /result function. So changed

const weatherData = JSON.parse(data)

to

weatherData = JSON.parse(data)

I'm not sure why you set all the other variables like temp and feels_like , since you never use them.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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