Question

我有这个用Node.js制作的API，这很简单，它只是一个帖子：

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及其框架的新手，当我在控制台上查看它时，它什么也没说。

如果可以，请提供一些提示。感谢...

修改

我忘了提到错误，它没有显示帖子。

Answer 1

您正在使用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响应，必须在express中使用res.jsonp。

Node，js和jQuery无法在localhost

1 个答案: