Strapi api 响应中未包含的组件

Question

我今天决定使用 Strapi 作为我的作品集的无头 CMS，但我遇到了一些问题，我似乎无法在线找到解决方案。也许我只是太笨了，无法真正找到真正的问题。

我已经为我的项目设置了一个模式，该模式将存储在 Strapi 中（一切都在网络中完成），但我的自定义组件存在一些问题，也就是说，它们不是 Strapi 的一部分API 当我通过 Postman 运行回复时。（不仅是空键，而且根本不包含在响应中）。所有其他不是组件的字段都按预期填写。

起初我认为这可能与权限有关，但一切都已启用所以不可能，我也尝试查看代码中的 API，但记录答案也没有包含组件。

这是模式中一些字段的图像，但更重要的是未包含在响应中的组件。

所以我的问题是，我是否需要在项目中创建某种解析器或任何东西才能包含这些字段，或者为什么不包含它们？

Answer 1

我遇到了同样的问题，并且能够通过将 populate=* 添加到 API 端点的末尾来解决它。

例如：

http://localhost:1337/api/test?populate=*

更多信息在这里：https://forum.strapi.io/t/cannot-see-media-field-in-my-endpoint-for-my-content-type/13082/2

编辑：只有一级关系使用 populate=* 填充。使用 LHS 括号语法（即 [populate]=*）更深地填充：

例如：

http://localhost:1337/api/test?populate[TestExamples][populate]=*

如果您转到关系人口，请在此处获取更多信息：https://docs.strapi.io/developer-docs/latest/developer-resources/database-apis-reference/rest-api.html#fields-selection

Answer 2

只是添加到已接受的答案中，如果您正在使用大量嵌套 collection 或嵌套组件（例如，在单一类型中使用大量自定义组件），那么它可能是值得的编写自定义控制器。

我需要呈现一个主页，其中有一个 'Header' 组件，而页眉有两个可重复的嵌套 'Button' 组件。此外，我想渲染 collection of 'Clients' 这是一个 one-to-many 关系。

由于这个数据结构不会经常改变，我刚刚编写了一个自定义控制器，所以我不必在 front-end.

中担心这个

假设您创建了一个主页单一类型来呈现您的主页，控制器将在以下目录中可用：/src/api/homepage/controllers/homepage.js

在下面的示例中，我想渲染具有嵌套 header_image 和 buttons 的 Header 组件以及具有嵌套 clients 的 Clients 组件collection.

const { createCoreController } = require('@strapi/strapi').factories;

module.exports = createCoreController('api::homepage.homepage', ({ strapi }) => ({
    async find(ctx) {
        const populateList = [
            'Header.header_image',
            'Header.buttons',
            'Clients.clients'
        ]
        // Push any additional query params to the array
        populateList.push(ctx.query.populate)
        ctx.query.populate = populateList.join(',')

        const content = await super.find(ctx)
        return content
    }
}));

Strapi V3 和 V4 之间似乎存在显着差异，我发现有关填充嵌套组件的文档对于 V4 来说非常差。我想这将在接下来的几周内更新，因为 Strapi V4 刚刚发布。

如果有更好的方法来填充深层嵌套的组件或关系，我很想听听，但我希望以上内容同时也能帮助到一些人。

Answer 3

我对 Strapi 比较陌生，尤其是 V4。我去年只开发了一个版本为 3.6.8 的应用程序。除非您还没有发现问题，否则我相信我已在端点调用中解决了该问题。我还必须说我还没有部署它。只是在开发环境中。

The data architecture

端点调用：

http://localhost:1337/api/profiles/?filters[user]=1&populate[0]=permissions&populate1=permissions.forms.form&populate2=permissions.quiz&populate[3]=permissions.unity&populate[4]=permissions.forms.form.Questions Blockquote

The Endpoint Call

Answer 4

Gatsbyjs 解决方案！！！：我使用的是单一类型，我在该单一类型中有一个组件，例如 header 设置，用户可以在其中填写诸如phone 号码位置等等......我也在我的 front-end 和这里使用 Gatsbyjs strapi.js Screenshot is a solution for that too.gatsby-config.js Screenshot 以防万一有人遇到同样的问题

Answer 5

对于使用 Angular 的人来说，创建正确的嵌套 QueryParams 以与 HttpClient 一起使用可能会很烦人，所以我创建了这个 DeepQuery class（此处为gist，以防出现问题）：

class DeepQuery {
  constructor(public query: any) {

  }

  private isObj(obj: any): boolean {
    return (
      typeof obj === 'object' &&
      obj !== null
    )
  }

  private toQPK(crumbs: string[]): string {
    if (crumbs.length == 0) {
      throw new Error(`Parameter without key`)
    }
    return crumbs[0] + crumbs.slice(1).map(s => `[${s}]`).join("");
  }

  private parse(obj: any, crumbs: string[] = [], memo: {[key: string]: any} = {}) {
    if (!this.isObj(obj)) {
      memo[this.toQPK(crumbs)] = obj;
    } else if (Array.isArray(obj)) {
      for (let i = 0; i < obj.length; i++) {
        crumbs.push(i.toString());
        this.parse(obj[i], crumbs, memo);
        crumbs.pop();
      }
    } else {
      for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
          crumbs.push(key);
          this.parse(obj[key], crumbs, memo)
          crumbs.pop();
        }
      }
    }
    return memo;
  }

  public encode() {
    return this.parse(this.query);
  }
}

其 encode 方法创建一个对象，您可以将其传递给您进行的任何 HTTP 调用：

makeCall(type: string): Observable<any> {
    let populate = {
        authors: ["listing", "publisher"]
    };
    let params = new DeepQuery({populate});
    return this.html.get<any>(url.href, params.encode());
  }

Answer 6

我发现这个带有 Strapi 插件的解决方案能够获取使用 Strapi 创建的自定义组件中的 collectionTypes 的数据。

为了明确我的情况是这个，我有一个名为“article”的 collectionType，它包含在一个自定义组件中，显然我们需要深入研究才能获取它们。

这是我使用 strapi 插件的解决方案 gatsby-source-strapi

{
  resolve: "gatsby-source-strapi",
  options: {
    apiURL:
      process.env.NODE_ENV === "production"
        ? process.env.API_URL
        : "http://localhost:1337/api",
    accessToken: process.env.STRAPI_TOKEN,
    collectionTypes: [
      { name: `descrizioni-home-page` },
      { name: "article", endpoint: "articles?populate=*" },
    ],
    singleTypes: [{ name: "homepage", endpoint: "homepage?populate=*" }],
    queryLimit: 5000,
  },
},

Strapi api 响应中未包含的组件

Components not included in Strapi api response

content-management-system

strapi

headless