Express-API POST 在 Postman 中有效，但不适用于 AJAX答案

【问题标题】：Express-API POST works in Postman but not with AJAXExpress-API POST 在 Postman 中有效，但不适用于 AJAX
【发布时间】：2019-08-13 07:34:00
【问题描述】：

我想在 Javascript 中对我的 ExpressJS Rest API 进行 AJAX 调用。

但是，使用 Javascript，POST 调用不起作用。

在 Postman 中，具有相同标题的相同 JSON 数据有效。

这是js（ajax）中的错误：

cross-origion Request Blocked: The Same Origin Policy disallows reading the remote resource at http://192.168.10.106:8080/api/cart/. (Reason: CORS header 'Access-Control-Allow.Origin' missing)

这是 node.js 中的错误：

SyntaxError: Unexpected token c in JSON at position 0
    at JSON.parse (<anonymous>)

Cors 已启用。标头在 AJAX 中设置（Content-Type，...）

API-代码：

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

app.use(express.json());
app.use(cors());
app.options('*', cors());
app.all('/*', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.setHeader("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT");
  res.setHeader("Access-Control-Allow-Headers", "Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

app.post('/api/cart', async (req, res) => {
    res.send(true);
});

app.listen(8080, () => {
  console.log('Example app listening on port 8080!');
});

AJAX 代码：

$.ajax({
                  url:"http://192.168.10.106:8080/api/cart/",
                  type:"POST", //First change type to method here
                  headers: {
                    'X-Requested-With':  'XMLHttpRequest',
                    'Accept': '*/*',
                    'Cache-Control':'no-cache',
                  },
                  contentType: "application/json; charset=utf-8",
                  data:{
                    JSON.stringify(cart)
                  },
                  success:function(response) {
                  },
                  error:function(data, data1, data2){
                    console.log(data1);
                    alert("An Error occurred. Try again later");
                  }
              });

我希望使用这个 ajax 代码执行 post-api。

然而事实并非如此。有什么想法吗？

【问题讨论】：

所以您的请求在您发送请求的服务器中导致 “SyntaxError: Unexpected token c in JSON at position 0” 错误？这似乎是您需要解决的问题，对吧？
响应的 HTTP 状态码是什么？您可以使用浏览器开发工具中的网络窗格进行检查。是 4xx 还是 5xx 错误而不是 200 OK 成功响应？
是的，这就是问题所在。
@sideshowbarker 返回的响应码是“400”
试试data: JSON.stringify(cart)

标签： javascript node.js ajax express

【解决方案1】：

我认为您需要将 ajax 更改为：

$.ajax({
                  url:"http://192.168.10.106:8080/api/cart/",
                  type:"POST", //First change type to method here
                  headers: {
                    'X-Requested-With':  'XMLHttpRequest',
                    'Accept': '*/*',
                    'Cache-Control':'no-cache',
                  },
                  contentType: "application/json; charset=utf-8",
                  data: JSON.stringify(cart),
                  success:function(response) {
                  },
                  error:function(data, data1, data2){
                    console.log(data1);
                    alert("An Error occurred. Try again later");
                  }
              });

【讨论】：

【解决方案2】：

  $.ajax({
    url:"http://192.168.10.106:8080/api/cart/",
    type:"POST", //First change type to method here
    headers: {
      'X-Requested-With':  'XMLHttpRequest',
      'Accept': '*/*',
      'Cache-Control':'no-cache',
      "contentType": "application/json; charset=utf-8"
    },

    data:{
      "itemId": 1234
    },
    success:function(response) {
        console.log(response);
    },
    error:function(data, data1, data2){
      console.log(data1);
      alert("An Error occurred. Try again later");
    }
});

用上面的代码替换你的ajax代码

【讨论】：