尝试访问 API 调用时出现 Javascript 404 错误

Question

我正在尝试更改数据库内的一些数据，但是一旦调用我的 api 请求，我就会收到错误:

Uncaught (in promise) SyntaxError: Unexpected end of JSON input
    at JSON.parse (<anonymous>)

以及404对应的网络错误。我不太确定为什么它无法识别我的 api 调用，这是初始的 fetch 调用:

import fetch from '../../../../core/fetch/fetch.server';
import history from '../../../../core/history';

export default function checkIn(orderId) {
  debugger;
  return async (dispatch, getState) => {
      // dispatch({ type: BOXOFFICE_CHECKING_IN });
      const response = await fetch(`/api/orders/${orderId}/checkIn`, {
          method: 'POST',
          headers: {
            Accept: 'application/json',
            'Content-Type': 'application/json',
          },
          body: JSON.stringify({
            checkedIn: true,
          }),
        }
      );

      if (response.status === 200) {
        // dispatch({ type: BOOKING_CHECKED_IN });
      } else {
        const errorResponse = await response.json();
        if (errorResponse.code === 'card_error') {
          // dispatch({ type: BOXOFFICE_CHECKED_IN_ERROR });
        }
      }
    } catch (err) {
      throw err;
    }
  };
}

还有我的 api 文件(删除了所有不相关的内容):

import { Router } from 'express';


import checkIn from '../handlers/api/orders/checkInCustomer';


export default (resources) => {
  const router = new Router();

  router.post('/orders/:orderId/checkIn', checkIn(resources));



  return router;
};

这最终是为了调用我的 js 文件来更改数据数据库条目:

import { defaultTo } from 'lodash';
import guuid from '../../../../../../core/guuid';
import authenticateAdmin from '../authenticateAdmin';
import order from '../../../../client/reducers/ui/modals/order';

export default ({ knex }) =>
  authenticateAdmin(knex)(async (req, res) => {
    try {
      console.log('checkinCustomer');
      const { orderId } = req.params;
      const { isCheckedIn } = req.body;

      console.log(orderId);
      console.log(isCheckedIn);

      await knex('orders').where('is_checked_in', '=', orderId).update({ is_checked_in: isCheckedIn }).where({ id: orderId });

      res.status(201).end();
    } catch (err) {
      console.error(err.stack || err);
    }
  });

任何人都可以发现我的代码中存在根本错误的地方吗？我可以向您保证文件路径都是正确的，并且所有函数都彼此可见，也许这是我解析数据的方式？

编辑

我认为包括我也收到 CORS 错误可能有用:

从源“我的站点名称”访问“http://localhost:3000/api/orders/c7216fc0-1197-4cb6-99d4-15760f00b6e7/checkIn”处的 XMLHttpRequest 已被 CORS 策略阻止:

进一步编辑

我已设法删除原始 JSON 错误，但是我仍然收到 404 网络错误以及原始 CORS 错误...除此之外，如果我更改最后一部分从 checkIn 获取到 cancel 这是一个完全正常工作的 API 调用，同样的错误仍然存​​在。

Answer 1

您不应使用 JSON.stringify() 将数据传递到您的正文。

当您使用 application/json 时，您应该在正文中传递 json 格式。