Sendinblue create contact 'TypeError: Failed to fetch' error (using React)

Question

我正在尝试在我的 React JS 应用程序中实现 Sendinblue API。我有一个文本输入，用户要将他们的电子邮件输入其中，然后是一个将他们的电子邮件添加到 Sendinblue 列表的按钮。我正在使用位于 Node.js 中 here 的“创建联系人”参考，因为我正在为我的 React 应用程序使用 JavaScript 代码。有时，此代码有效，因为电子邮件已成功添加到 SendinBlue 列表，但大多数时候电子邮件未添加，我收到以下错误：

TypeError: Failed to fetch

我的完整代码如下所示，其中电子邮件是从文本字段输入的：

var request = require("request");

var options = {
  method: 'POST',
  url: 'https://api.sendinblue.com/v3/contacts',
  headers: {
    accept: 'application/json',
    'content-type': 'application/json',
    'api-key': 'My SendinBlue Application API Key'
  },
  body: {updateEnabled: false, email: 'newEmail@exampleWebsite.com'},
  json: true
};

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});

当我在 Sendinblue API 文档上对此进行测试时，它每次都会成功地将电子邮件添加到我的联系人列表中。我每次都用一封新电子邮件对其进行测试，以确保它不会因为重复的电子邮件而引发错误。我还修改了 true 和 false 之间 updateEnabled 的值，但它似乎无助于解决此问题。

我认为错误可能源于第一行的 var request = require("request"); 命令，因为我不确定 require 是 React 方法还是 Node.js 方法。

如果有人对我如何解决此问题有任何想法，将不胜感激。谢谢。

Answer 1

你说得对，require 用于 Node.js，Sendinblue 参考资料中的示例也提到了它。尝试使用 axios 代替。您只需使用 npm install axios 像 React 项目中的任何其他 npm 模块一样安装它并尝试使用以下脚本：

const response = await axios.post(
  'https://api.sendinblue.com/v3/contacts',
  { updateEnabled: false, email: 'newEmail@exampleWebsite.com'},
  { headers: { 'Content-Type': 'application/json', 'api-key': 'My SendinBlue Application API Key' } }
)
console.log(response.data)

如果有帮助请告诉我！谢谢

Sendinblue create contact 'TypeError: Failed to fetch' error (using React)

Sendinblue create contact 'TypeError: Failed to fetch' error (using React)

javascript

typeerror

reactjs

sendinblue