节点，JS和jQuery不工作在localhost

我有这样的API与Node.js的制作，这是简单的，它只是一个箱子后：节点，JS和jQuery不工作在localhost

var express = require('express'); 
var mongoose = require('mongoose'); 
var bodyParser = require('body-parser'); 
var app = express(); 
var Posts = require('./models/posts'); 

mongoose.connect('mongodb://localhost/api', function(err) { 
    if(err) { 
    console.log("Error with mongodb: " + err); 
    } 
}); 
app.use(bodyParser()); 

var port = process.env.PORT || 3000; 

var router = express.Router(); 

router.get('/', function(req, res){ 
    res.json({message: 'It\'s working'}); 
}); 

router.route('/posts') 
    .get(function(req, res) { 
    Posts.find(function(err, data) { 
     if(err) { 
     res.send(err); 
     } 
     res.json(data); 
    }); 
    }) 
    .post(function(req, res) { 
    var posts = new Posts(); 
    posts.title = req.body.title; 
    posts.description = req.body.description; 
    posts.content = req.body.content; 
    posts.save(function(err) { 
     if(err) { 
     res.send(err); 
     } 
     res.json({message: "Post saved!"}); 
    }); 
    }); 

router.route('/posts/:id') 
    .get(function(req, res){ 
    Posts.findById(req.param.id, function(err, data) { 
     if(err) { 
     res.send(err); 
     } 
     res.json(data); 
    }); 
    }) 
    .put(function(req, res) { 
    Posts.findById(req.params.id, function(err, data) { 
    if(err) { 
    res.send(err); 
    } 
    data.nome = req.body.nome; 
    data.description = req.body.description; 
    data.content = req.body.content; 
    data.date = Date.now; 
    data.save(function(err) { 
     if(err) { 
      res.send(err); 
     } 
     res.json({message: 'Post updated!'}); 
     }); 
    }); 
    }) 
    .delete(function(req, res) { 
    Posts.remove({_id: req.params.id}, function(err, data) { 
     if(err) { 
     res.send(err); 
     } 
     res.json({message: 'Post deleted!'}); 
    }); 
    }); 

app.use('/api', router); 
app.listen(port, function() { 
    console.log("Server running on: " + port); 
});

而且我对jQuery的

$.ajax({ 
    url: 'http://localhost:3000/api/posts/', 
    type: "GET", 
    dataType: 'jsonp', 
    success: function(returnit) { 
    $.each(returnit.posts, function() { 
     var post = this; 
     $('<p>').text(post.title).appendTo('.blog--area'); 
    }); 
    } 
});

验证码

有人可以向我解释发生了什么，为什么发生？我是JavaScript新手，它是框架，当我在控制台上查看时，它什么都没说。

如果可以的话，请给出一些提示。谢谢...

编辑

我忘了提及的错误，它没有显示的职位。

来源

2016-04-28 joaomarcuslf

你回来了什么错误？ – FiringSquadWitness

它不显示帖子 – joaomarcuslf

对于调试，尝试添加一些'console.logs'到你的代码。例如。在函数posts.find（function（err，data）{'添加类似'console.log（“data from db”，data）''）到你的回调函数之后。在成功函数中在客户端执行同样的操作：'console.log（“received data”，returnIt）'等等。至少用这种方法你可以找出问题的原因。 – Anastasia

您正在使用JSONP进行跨域调用。这需要您的Express部分（服务器）进行一些更改。更改res.json(data)到res.jsonp(data)

例子：

router.route('/posts') 
    .get(function(req, res) { 
    Posts.find(function(err, data) { 
     if(err) { 
     res.send(err); 
     } 
     res.jsonp(data); //changed 
    }); 
    })

说明： 当你对API服务器发出Ajax调用的数据类型是jsonp客户端寻找一个包裹在一个回调函数响应。

由于JSONP将JSON响应封装到JavaScript函数中，并将其作为脚本发送回客户端。脚本不受同源策略的约束，并且在加载到客户端时，该函数的行为就像它包含的JSON对象一样。

在你的情况你的客户正在寻找这样的事情：

callback_Name({"title": "Foo", "description": "HelloWorld", "content": "OK"})

但越来越：

{"title": "Foo", "description": "HelloWorld", "content": "OK"}

因此，对于JSONP响应中的一个必须使用资源.jsonp在express中。

来源

2016-04-28 01:44:13 Nivesh

节点，JS和jQuery不工作在localhost

回答

相关问题