我目前正在尝试将 json 数据发布到 json 文件。为了做到这一点,我设置了一个 NodeJS 和 Express 服务器,但有些东西总是搞砸。我不断收到这样的反馈:
jquery-3.2.1.js:9566 POST http://localhost:3000/Alpha/json/details.json 404 (Not Found)
我阅读了其他几个问题,指出问题可能出在我的服务器端脚本中,并且我没有正确指定 json 文件。
JS 客户端发布脚本:
function sendFormData(){
var formData = JSON.stringify($("#myForm").serializeArray());
$.ajax({
type: "POST",
url:"../json/details.json",
data: formData,
success: function(){
alert("something!");
}
});
}
我的 HTML 表单:
<form action="XXXXXXXX"id="myForm"><label for="id">ID</label>
<input type="text" id="id" name="id" placeholder="Item ID number" ng-model="newDetails.id">
<label for="system">System</label>
<input type="text" id="system" name="lastname" placeholder="Type of System" ng-model="newDetails.system">
<label for="date">Date</label>
<input type="text" id="date" name="lastname" placeholder="dd-mm-yyyy" ng-model="newDetails.date">
<label for="priority">Priority</label>
<select id="priority" name="priority" ng-model="newDetails.priority">
<option value="high">High</option>
<option value="medium">Medium</option>
<option value="low">Low</option>
</select>
<label for="description">Description</label>
<textarea class="form-control" rows="3" id="desc" name="description" ng-model="newDetails.description"></textarea>
<label for="priority">Status</label>
<select id="status" name="status" ng-model="newDetails.status">
<option value="OPEN">OPEN</option>
<option value="ON HOLD">ON HOLD</option
<option value="CLOSED">CLOSED</option>
</select>
<input type="button" value="Submit" class="btn" data-dismiss="modal" style="background-color:#FFBE00; color:#002244;" onClick="sendFormData()">
</form>
NodeJS 脚本:
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var path = require('path');
app.use(bodyParser.json());
app.use('../json', express.static(path.join(__dirname, 'json')));
app.use('/', express.static(__dirname + '/'));
app.post('/formdata', function(req, res) {
console.log( req.body.id + req.body.system + req.body.date + req.body.priority + req.body.description + req.body.status);
res.send("ok");
});
app.use(bodyParser.json());
// Get information submitted
app.post('/', function(req, res) {
console.log("Information received !");
console.log(req.body);
res.send("Ok!");
});
app.listen(3000);
我的 Node 脚本工作正常吗?为什么找不到 json 文件?
root/Alpha/json/details.json - 是 json 文件路径
我的 Node 脚本位于根目录
最佳答案
我发现您对这里的很多事情感到困惑。我认为您应该先退后一步,了解绝对 URL 和相对 URL,然后才能了解如何修复代码。下面是有关如何解决此问题的建议,但如果您盲目应用这些建议,那对您没有任何好处。您需要了解为什么需要执行以下操作,否则稍后您将面临更多问题。了解 URL、路径和 HTTP:
- https://en.wikipedia.org/wiki/URL
- https://en.wikipedia.org/wiki/Uniform_Resource_Identifier
- https://en.wikipedia.org/wiki/File_system
- https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol
至少阅读有关绝对和相对 URL 的构建方式、HTTP 请求中的路径发送内容、如何遍历文件系统以及什么 /
、..< 的基本信息
和 .
的意思是。
现在,解决方案。
这没有任何意义:
app.use('../json', express.static(path.join(__dirname, 'json')));
因为您无法提供比根路径高一级的 URL。
当您在页面上时,例如从客户端访问 ../x/y.json
http://www.example.com/a/b/c/index.html
那么客户端请求的实际上是http://www.example.com/a/b/x/y.json
和 this 是您需要在后端提供服务的内容。您实际提供的文件是另一回事,但这是您需要提供服务的路线。
我认为你需要重新考虑:
.
、..
和/
在相对 URL 中的含义- 您想要提供的实际 URL - 可以是任何内容,但您的客户端和服务器必须同意
有意义的是:
app.use('/json', express.static(path.join(__dirname, 'json')));
但如果您无论如何提供 __dirname
并且它已经包含 json
目录,那将是多余的:
app.use('/', express.static(__dirname + '/'));
顺便说一下,上面的内容可能只是:
app.use('/', express.static(__dirname));
但不建议(也不需要)为您的后端文件提供服务。您应该将所有静态内容放在一个目录中,例如称为 static
或 public
或 html
或其他名称,并通过以下方式提供此目录:
app.use('/', express.static(path.join(__dirname, 'static')));
并将您的 json
目录放入该目录的内部。
有关如何正确提供静态内容的更多信息和示例,请参阅以下答案:
关于javascript - 将请求发送到 NodeJS 后端,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43683664/