Javascript 跨域问题阻止我调用ajax从express文件检索数据

我需要从node/exprss文件（app.js）中检索和显示数据，并将其显示在我的index.html上。我在frontend.js文件中向localhost:3000/turtles发出了一个ajax请求，但这就是我遇到跨域问题的地方

APP.JS文件

var express = require('express');
var app = express();

app.get('/turtles', function(req, res){

    var turtles = {
      message: "success",
      data: [
        {
          name: "Raphael",
          favFood: "Pizza"
        },
        {
          name: "Leonardo",
          favFood: "Pizza"
        },
        {
          name: "Donatello",
          favFood: "Pizza"
        },
        {
          name: "Michelangelo",
          favFood: "Pizza"
        }
      ]
    };

    res.send(turtles.data[0].name);
});

app.listen(10000, function(){
    console.log("Port is on 10000!");
});

FRONTEND.JS

  $(document).ready(function(){

    var names = [];
    var turtles = [];

    var myQueryUrl = "http://localhost:10000/turtles";

    $.ajax({url: myQueryUrl, method: 'GET'}).done(function(response){

            names = response.data;
            turtles.push(response.data);

            console.log(names)
            console.log(turtles)

            $('.DTurtles').append($('<p>' + name + '</p>'));


    }); 

});

我的所有文件都在同一个目录中。有人能解释一下上面的语法吗。为什么是router.get而不是app.get，并详细解释这一部分

res.sendFile(path.join(__dirname, '../', '../', 'client', 'index.html'));

我还读到，我应该通过如下操作来允许CORS

app.all('/', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
 });

app.get('/', function(req, res, next) {
  // Handle the get for this route
});

app.post('/', function(req, res, next) {
 // Handle the post for this route
});

但我不知道这是怎么回事。app.all函数中的下一个参数来自何处，res.header是什么？这两种解决方案中的任何一种都能解决我的跨域问题吗

更新：我在get handler函数中添加了以下代码，该函数假定通过ajax调用返回我请求的数据：

app.get('/turtles', function(req, res, next){
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    var turtles = {
      message: "success",
      data: [
        {
          name: "Raphael",
          favFood: "Pizza"
        },
        {
          name: "Leonardo",
          favFood: "Pizza"
        },
        {
          name: "Donatello",
          favFood: "Pizza"
        },
        {
          name: "Michelangelo",
          favFood: "Pizza"
        }
      ]
    };

    res.send(turtles.data);
});

---

我不再收到跨域问题的错误消息；然而，在我的frontend.js中，当我console.log turtles和names时，它会显示为未定义，这意味着我无法返回数据。如何获取数据？

将APP.JS从

res.send（…）

修改为

res.json（…）

您只发送turtles.data，它是一个数组

res.send（turtles.data）

，访问

响应。前端的数据将返回
未定义的
，因为它没有
数据。执行
res.send（turtles）
将整个数据发送回，包括消息和数据。然后在前端，
response.data
应该记录数据是的，非常感谢。如果可以的话，我会支持你的意见，但现在还不能。为什么我要把整个东西送回去？这就是ajax调用JSON对象的工作方式吗？服务器端发回整个JSON对象，然后在ajax调用所在的前端代码中，我们指定我们希望从发回的整个JSON对象（如turtles中的数据数组）中获得什么数据。数据？技术上，您需要如何在前端使用数据取决于您。在您的情况下，我认为以JSON格式发送整个数据是有意义的，因为您可以使用
“message”
来指示响应是“success”还是“error”。而
“数据”
将被处理，在你的例子中，可能会列出海龟的名字和它的食物。正如@solarhell所提到的和评论，你应该使用
res.json
。你是什么意思？我应该使用res.json而不是res.send吗？目前我将海龟对象作为一个普通的javascript对象，但我知道如果我在海龟的所有属性/键周围加上引号，它将是JSON对象，对吗？那么res.json是否只是自动将整个turtles对象作为json对象发送？
res.json（）
将发送适当的头，让ajax调用知道如何将返回数据解析为json。
app.get('/turtles', function(req, res, next){
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    var turtles = {
      message: "success",
      data: [
        {
          name: "Raphael",
          favFood: "Pizza"
        },
        {
          name: "Leonardo",
          favFood: "Pizza"
        },
        {
          name: "Donatello",
          favFood: "Pizza"
        },
        {
          name: "Michelangelo",
          favFood: "Pizza"
        }
      ]
    };

    res.send(turtles.data);
});