javascript - 创建 Assets 时内容丰富的内容管理 API 错误 422

标签 javascript reactjs contentful contentful-management contentful-api

我正在尝试使用 Contentful Content Management API 创建和发布图像作为 Assets ,但到目前为止没有成功,我已经能够成功创建和发布条目,但我无法弄清楚为什么 Assets 不起作用。这是我创建 Assets 的代码。最终目标是使其适用于一系列图像/附件,但我试图在处理多个图像/附件之前使其只处理一个图像/附件。

  makeAsset = async (item) => {
    try {
      var MClient = createClient({
        accessToken: process.env.REACT_APP_CONTENTFUL_MANAGEMENT_ACCESS_TOKEN,
      });
      let space = await MClient.getSpace(
        process.env.REACT_APP_CONTENTFUL_API_SPACE
      );
      let environment = await space.getEnvironment(
        process.env.REACT_APP_CONTENTFUL_ENVIRONMENT
      );

      const asset = await environment.createAsset({
        fields: {
          title: {
            "en-US": item.imgNames[0],
          },
          file: {
            "en-US": {
              fileName: item.images[0].name,
              contentType: item.images[0].type,
              uploadFrom: item.imgUrls[0],
            },
          },
        },
      });

      const processedAsset = await asset.processForAllLocales();
      processedAsset.publish();

控制台中的错误是这样的:

ValidationFailed: {
  "status": 422,
  "statusText": "",
  "message": "Validation error",
  "details": {
    "errors": [
      {
        "name": "type",
        "value": "data:image/png;base64,iVBORw0KGg(The rest of the image URL from above)
        "type": "Object",
            "details": "The type of \"value\" is incorrect, expected type: Object",
            "path": [
            "fields",
            "file",
            "en-US",
            "uploadFrom"
            ]
         }
       ]
     },
"request": {
    "url": "assets",
    "headers": {
      "Accept": "application/json, text/plain, */*",
      "Content-Type": "application/vnd.contentful.management.v1+json",
      "X-Contentful-User-Agent": "sdk contentful-management.js/5.26.1; platform browser; os Windows;",
      "Authorization": "Bearer ...7ijJE"
    },
    "method": "post",
    "payloadData": "{\"fields\":{\"title\":{\"en-US\":\"scuba_mask\"},\"file\":{\"en-US\":{\"fileName\":\"scuba_mask.png\",\"contentType\":\"image/png\",\"uploadFrom\":\"data:image/png;base64,iVBORw0KG(The rest of image URL)

我一直在尝试搜索其他示例,因为文档不完整,并且没有一个示例适合我。我尝试过的一种解决方案是使用 fs.createReadStream() 函数,但该函数已从 React 中删除。

最佳答案

@stefan judis,我使用了示例中的代码,其中一个函数在较新的版本中已被弃用,所以我想我应该冒险更换一些东西,然后它就起作用了。为了供其他遇到此问题的人将来引用,这里是解决我的问题的解决方案:

makeAsset = async (item) => {
try {
  //Contentful API Call
  var MClient = createClient({
    //Fetch access token from environment variables
    accessToken: process.env.REACT_APP_CONTENTFUL_MANAGEMENT_ACCESS_TOKEN,
  });
  //API call that requests the specified space
  let space = await MClient.getSpace(
    process.env.REACT_APP_CONTENTFUL_API_SPACE
  );
  let environment = await space.getEnvironment(
    process.env.REACT_APP_CONTENTFUL_ENVIRONMENT
  );

  const file = item.images[0];
  const contentType = file.type;
  const fileName = file.name;
  let asset = await environment.createAssetFromFiles({
    fields: {
      title: {
        "en-US": fileName,
      },
      file: {
        "en-US": {
          contentType,
          fileName,
          file,
        },
      },
    },
  });
  asset = await asset.processForAllLocales();
  asset.publish();
} catch(error) {
  console.log(error);
}
}

关于javascript - 创建 Assets 时内容丰富的内容管理 API 错误 422,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61854787/

相关文章:

javascript - 如何拦截 JS 事件触发的表单提交(在普通 JS 中)?

reactjs - 为 Next.js 的应用程序目录中的所有页面添加逻辑的全局文件是什么?

reactjs - 输入 NextJs 链接/路由

java - 使用 Contentful Space 时属性值必须是常量错误

javascript - GraphQL 查询错误它说未知类型 "ContentfulSizes"

azure - Contentful + Azure 静态 Web 应用触发部署

JavaScript 3 分钟计时器,完成后重复并在每个周期结束时显示消息

javascript - Angular 2+ Promise 单元测试

javascript - 只要我确保将所有 & 替换为 & 然后将所有 < 替换为 <,XSS 如何工作?

reactjs - 带有动态 h1、h2、h3 等标签的 React 组件