发布方法的问题(使用提取和表达) [英] A problem with a post method (using fetch and express)
问题描述
我是一个初学者，所以我希望我的问题不是那么愚蠢.我想做的是将客户端javascript的经度和纬度传递到服务器端的node.js中.我正在使用fetch和express.js.
I'm a very beginner so I hope my question is not that stupid. What I want to do is to pass a longitude and a latitude from a client-side javascript into a node.js on a server-side. I'm using a fetch and express.js.
在我的html代码下面:
Below my html code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
</head>
<body>
latitude: <span id="latitude"></span>°<br />
longitude: <span id="longitude"></span>°<br />
</p>
<button id="geolocate">geolocate</button>
<script src="main.js"></script>
</body>
</html>
这是我main.js中的一个小示例:
Here's a little sample from my main.js:
document.getElementById('geolocate').addEventListener('click', event => {
if ('geolocation' in navigator) {
console.log('geolocation available');
navigator.geolocation.getCurrentPosition(position => {
var X = position.coords.latitude;
var Y = position.coords.longitude;
console.log(X, Y);
document.getElementById('latitude').textContent = X;
document.getElementById('longitude').textContent = Y;
const data = {X, Y}
const options = {
method: 'POST',
body: JSON.stringify(data),
headers: {
'content-type': 'application/json'
}
}
fetch('/api', options);
});
} else {
console.log('geolocation not available');
}
});
在这里您可以看到我的node.js代码:
And here you can see my node.js code:
const express = require('express');
const app = express();
app.listen(3000, () => console.log('listening at 3000'));
app.post('/api', (req, res) => {
console.log(req);
});
当我运行它时，我收到404错误.我不知道我在做什么错.我将不胜感激.
When I run it I receive an 404 error. I have no idea what I'm doing wrong here. I'll be grateful for any advice.
此应用正在我的VPS上运行.我也有一个带SSL别名的域.要运行node.js，我将nodemon用作进程.这是日志:
This app is working on my VPS. I also have a domain with SSL aliases. To run node.js I use nodemon as a process. Here are the logs:
user_name_with_sudo 11451 0.5 3.6 663672 38152 pts/0 Sl+ 11:05 0:00 node /bin/nodemon index.js $
如您所见，这是一个过程.
As you can see it's a process.
httpd service status - Oct 20 17:14:21 www.{my domain}.pl systemd[1]: Started The Apache HTTP Server.
您可以看到我正在使用centOS7
As you can see I'm working on centOS7
推荐答案
尝试为获取添加完整路径.您正在监听本地主机上端口3000上的服务器
Try to add full path for the fetch. You are listening server at localhost on the port 3000
main.js:
document.getElementById('geolocate').addEventListener('click', event => {
if ('geolocation' in navigator) {
console.log('geolocation available');
navigator.geolocation.getCurrentPosition(position => {
var X = position.coords.latitude;
var Y = position.coords.longitude;
console.log(X, Y);
document.getElementById('latitude').textContent = X;
document.getElementById('longitude').textContent = Y;
const data = {X, Y}
const options = {
method: 'POST',
body: JSON.stringify(data),
headers: {
'content-type': 'application/json'
}
}
fetch('http://localhost:3000/api', options)
.then(response => response.json())
.then(data => {
// if everting is ok should log the object message: "Long lang sent to express" from server
console.log(data)
});
});
...
服务器端就像dat
const express = require('express');
const app = express();
app.listen(3000, () => console.log('listening at 3000'));
app.post('/api', (req, res) => {
try {
const {X, Y} = req.body
console.log(X, Y)
res.status(200).json({ message: "Long lang sent to express" })
} catch (e) {
res.status(500).json({ message: 'Something go wrong, try again' })
}
});
如果不是常量，则尝试使用小写变量(例如:不使用X，Y ..，而是使用x，y):)带有编程的GL
Trying to use lowercase variables(example: not use X, Y.. but use x, y) if it not a constants :) Gl with programming
这篇关于发布方法的问题(使用提取和表达)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
