通过 Github 页面打开具有 Open Weather API 的项目时出现错误 405
我的app.js
const express = require ("express");
const res = require("express/lib/response");
const https = require ("https");
const bodyParser = require ("body-parser");
const app = express();
app.use(bodyParser.urlencoded({extended:true}));
app.get("/",function(request, response){
response.sendFile(__dirname+"/index.html");
})
app.post("/", function(req, res){
console.log(req.body.cityName);
// console.log("POST request received.");
const query=req.body.cityName;
const apiKey="796ea31271937af05a23079696c29758";
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(res.statusCode);
response.on("data", function(data){
//console.log(data);
const weatherData= JSON.parse(data);
// console.log(weatherData);
// const object = {
// name: "Ann",
// favouriteFood: "Butter Chicken"
// }
// console.log(JSON.stringify(object));
const temp = weatherData.main.temp;
console.log("Temperature : "+temp);
const feelsLike = weatherData.main.feels_like;
console.log("Feels like : "+feelsLike);
const weatherDescription = weatherData.weather[0].description;
console.log("Weather Description : "+weatherDescription);
const icon= weatherData.weather[0].icon;
imageURL = "http://openweathermap.org/img/wn/"+icon+"@2x.png"
// Method 1
//response.send("<h2>The temperature in Montreal, Quebec is "+temp+" degrees Celcius.</h2><br><h2>The weather is currently "+weatherDescription+"</h2><br><h2>The feels like temperature is "+feelsLike+" degrees Celcius. </h2>")
// Method 2
res.set("Content-Type", "text/html");
res.write("<h2>The temperature in "+query+" is "+temp+" degrees Celcius.</h2>")
res.write("<p>The weather is currently "+weatherDescription+"</p>")
res.write("<h4>The feels like temperature is "+feelsLike+" degrees Celcius. </h4>")
res.write("<img src="+imageURL+">");
res.send();
});
});
})
app.listen(3000, function(){
console.log("Server is running on port 3000.");
})
我的index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Weather Project</title>
</head>
<body>
<form action="/" method="post">
<label for="city-input">City Name: </label>
<input id="city-input" type="text" name="cityName" />
<button type="submit">Go</button>
</form>
</body>
</html>
当我在本地服务器上测试这个app.js时，它显示了预期的响应，即我在POST中发送的城市的温度要求。但是，当我使用 Github 页面链接运行该项目时，它显示了 index.html，但是当我以 POST 请求发送城市时，我在下一页上收到 405 错误。我是新人，所以我不确定出了什么问题，但我最初的想法是这与 API 密钥有关？就像钥匙 ID 一样？ 请帮忙。
My app.js
const express = require ("express");
const res = require("express/lib/response");
const https = require ("https");
const bodyParser = require ("body-parser");
const app = express();
app.use(bodyParser.urlencoded({extended:true}));
app.get("/",function(request, response){
response.sendFile(__dirname+"/index.html");
})
app.post("/", function(req, res){
console.log(req.body.cityName);
// console.log("POST request received.");
const query=req.body.cityName;
const apiKey="796ea31271937af05a23079696c29758";
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(res.statusCode);
response.on("data", function(data){
//console.log(data);
const weatherData= JSON.parse(data);
// console.log(weatherData);
// const object = {
// name: "Ann",
// favouriteFood: "Butter Chicken"
// }
// console.log(JSON.stringify(object));
const temp = weatherData.main.temp;
console.log("Temperature : "+temp);
const feelsLike = weatherData.main.feels_like;
console.log("Feels like : "+feelsLike);
const weatherDescription = weatherData.weather[0].description;
console.log("Weather Description : "+weatherDescription);
const icon= weatherData.weather[0].icon;
imageURL = "http://openweathermap.org/img/wn/"+icon+"@2x.png"
// Method 1
//response.send("<h2>The temperature in Montreal, Quebec is "+temp+" degrees Celcius.</h2><br><h2>The weather is currently "+weatherDescription+"</h2><br><h2>The feels like temperature is "+feelsLike+" degrees Celcius. </h2>")
// Method 2
res.set("Content-Type", "text/html");
res.write("<h2>The temperature in "+query+" is "+temp+" degrees Celcius.</h2>")
res.write("<p>The weather is currently "+weatherDescription+"</p>")
res.write("<h4>The feels like temperature is "+feelsLike+" degrees Celcius. </h4>")
res.write("<img src="+imageURL+">");
res.send();
});
});
})
app.listen(3000, function(){
console.log("Server is running on port 3000.");
})
My index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Weather Project</title>
</head>
<body>
<form action="/" method="post">
<label for="city-input">City Name: </label>
<input id="city-input" type="text" name="cityName" />
<button type="submit">Go</button>
</form>
</body>
</html>
When I test this app.js on my local server it shows the expected response, i.e. the temperature of the city that I send in POST request. But when I run the project using my Github pages link it shows the index.html but when I send the city as POST request,I get a 405 error on the next page. I am new so I am not sure what is wrong but my initial thought was that it is something related to the API key? as in the key ID?
Please help.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
github repo 似乎不支持 post 请求。您是否尝试过使用不同的托管平台（例如 firebase）？
It seems like github repo doesn't support the post requests. Did you try using the different hosting platform like firebase?