Ajax使用node.js找不到json
[英]Ajax can't find json with node.js
問題描述
因此我建立了一個小游戲（帶有p5.js庫），並希望實現一個從JSON文件加載的頁首橫幅，用作一種存儲用戶名/得分的數據庫，所有這些都使用Node.js服務器，快速安裝使事情變得更容易。 因此，這是html（帶有ajax代碼）：
<html>
<head>
<title>KassBric - Mouetto</title>
<meta charset="UTF-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/p5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/addons/p5.dom.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/addons/p5.sound.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="sketch.js"></script>
<script language="javascript" type="text/javascript" src="Paddle.js"></script>
<script language="javascript" type="text/javascript" src="Ball.js"></script>
<script language="javascript" type="text/javascript" src="Brick.js"></script>
<script language="javascript" type="text/javascript" src="Grid.js"></script>
<script language="javascript" type="text/javascript" src="Attractor.js"></script>
<script language="javascript" type="text/javascript" src="methods.js"></script>
<script language="javascript" type="text/javascript" src="Bonus.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript">
$.ajax({
url: '/scores.json',
dataType: 'json',
success: function(data) {
var keys = Object.keys(data);
for(var i = 0; i < keys.length; i++) {
var username = keys[i];
var score = data[username];
var row = $('<tr><td>' + username + '</td><td>' + score + '</td></tr>');
$('#Leaderboard').append(row);
}
},
error: function(jqXHR, textStatus, errorThrown){
alert('Error: ' + textStatus + ' - ' + errorThrown);
}
});
</script>
</head>
<body>
<div>
<p id="LeaderboardHolder" style = "background-color : rgb(51, 51, 51); color: rgb(150, 150, 150); padding: 15px;">
<table id="Leaderboard">
<tr>
<th>Username</th>
<th>Best Score</th>
</tr>
</table>
</p>
</div>
</body>
</html>
這是我的server.js：
console.log("server is starting");
var express = require('express');
var fs = require('fs');
var app = express();
var server = app.listen(3000, listen);
function listen() {
console.log("Listening...");
};
app.use(express.static('public'));
var data = fs.readFileSync('scores.json');
var scores = JSON.parse(data);
console.log(scores);
app.get('/leaderboard', showLeaderboard);
function showLeaderboard(request, response){
response.send(scores);
};
app.get('/leaderboard/add/:username/:score?', addPlayer);
function addPlayer(request, response){
var data = request.params;
var username = data.username;
var score = Number(data.score);
var type = typeof score;
if(!score || type !== 'number'){
var reply = "Score is required, and must be a number.";
}else{
scores[username] = score;
var data = JSON.stringify(scores, null, 2);
fs.writeFile('scores.json', data, finished);
function finished(err){
console.log("Updated the database.");
var reply = {
request: "Submitted",
username: username,
score: score
};
};
};
response.send(reply);
};
app.get('/leaderboard/:username', showPlayer);
function showPlayer(request, response){
var word = request.params.username;
if(scores[word]){
var reply = {
username: word,
score: scores[word]
};
}else{
var reply = {
msg: "Username not found"
};
};
response.send(reply);
};
和我的目錄看起來像：
-Project:
-node_modules
-public:
-index.html (code above)
-all my game files & folders
-packages.json
-scores.json
-server.js
因此，通過與Node / Express一起運行，我得到一個錯誤：
“獲取http：// localhost：3000 / scores.json 404（未找到）”
通過進行更多測試，我嘗試在項目目錄（位於公共文件夾中）中運行“基本” python SimpleHTTPServer，並且沒有錯誤，ajax獲取數據並將其解析到html表中。 我找不到為什么這適用於python的服務器而不是我的節點一...
1 個解決方案
解決方案1
0 已采納 2017-07-16 16:19:50
您的Ajax網址/scores.json但是在server.js沒有到/scores.json的路由
在這種情況下，我的解決方案是：
$.ajax({
url: '/handler',
dataType: 'json',
success: function(data) {
var keys = Object.keys(data);
for(var i = 0; i < keys.length; i++) {
var username = keys[i];
var score = data[username];
var row = $('<tr><td>' + username + '</td><td>' + score + '</td></tr>');
$('#Leaderboard').append(row);
}
},
error: function(jqXHR, textStatus, errorThrown){
alert('Error: ' + textStatus + ' - ' + errorThrown);
}
});
並在server.js中：
app.get('/handler', function(req, res) {
var filePath = path.join(__dirname, '/scores.json');
var file = fs.readFileSync(filePath, 'utf8');
var result = JSON.parse(file);
res.send(result);
}
對不起我的英語不好。
為什么Node.js找不到我的文件
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.