尝试使用 11ty 从 Strapi 发布数据时收到 403 错误

Question

目标

我正在尝试从 Strapi API http://localhost:1337/articles 检索数据，但是当我尝试运行 11ty 构建时，我收到控制台错误（如下所示）。

我尝试过的

我尝试查看是否有其他人遇到过同样的问题，但我似乎找不到任何东西。我还查看了其他人的 Strapi 和 11ty 设置，看看我的常规设置是否做错了，一切似乎都很好。这个问题似乎是基于我的 blogposts.js 文件和strapi数据之间的连接。

用于发布数据的文件 (blogposts.js)

const fetch = require("node-fetch");

// function to get blogposts
async function getAllBlogposts() {
    // max number of records to fetch per query
    const recordsPerQuery = 100;

    // number of records to skip (start at 0)
    let recordsToSkip = 0;

    let makeNewQuery = true;

    let blogposts = [];

    // make queries until makeNewQuery is set to false
    while (makeNewQuery) {
        try {
            // initiate fetch
            const data = await fetch("http://localhost:1337/articles", {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                    Accept: "application/json",
                },
                body: JSON.stringify({
                    query: `{
              articles {
              id
              Title
              Content
              published_at
              Cover
              Slug
            }
          }`,
                }),
            });

            // store the JSON response when promise resolves
            const response = await data.json();

            // handle CMS errors
            if (response.errors) {
                let errors = response.errors;
                errors.map((error) => {
                    console.log(error.message);
                });
                throw new Error("Houston... We have a CMS problem");
            }

            // update blogpost array with the data from the JSON response
            blogposts = blogposts.concat(response.data.articles);

            // prepare for next query
            recordsToSkip += recordsPerQuery;

            // stop querying if we are getting back less than the records we fetch per query
            if (response.data.articles.length < recordsPerQuery) {
                makeNewQuery = false;
            }
        } catch (error) {
            throw new Error(error);
        }
    }

    // format blogposts objects
    const blogpostsFormatted = blogposts.map((item) => {
        return {
            id: item.id,
            title: item.Title,
            slug: item.Slug,
            body: item.Content,
            cover: item.Cover,
            date: item.published_at
        };
    });

    // return formatted blogposts
    return blogpostsFormatted;
}

// export for 11ty
module.exports = getAllBlogposts

运行 npm 后控制台报错

> TypeError: Cannot read property 'articles' of undefined

`Error` was thrown:
    Error: TypeError: Cannot read property 'articles' of undefined
        at getAllBlogposts (C:\Users\Kaleshe\kaleshe.github.io\_data\blogposts.js:62:19)        
        at processTicksAndRejections (internal/process/task_queues.js:93:5)
        at async TemplateData.getDataValue (C:\Users\Kaleshe\AppData\Roaming\npm-cache\_npx\11352\node_modules\@11ty\eleventy\src\TemplateData.js:385:23)
        at async TemplateData.getAllGlobalData (C:\Users\Kaleshe\AppData\Roaming\npm-cache\_npx\11352\node_modules\@11ty\eleventy\src\TemplateData.js:228:18)
        at async TemplateData.getData (C:\Users\Kaleshe\AppData\Roaming\npm-cache\_npx\11352\node_modules\@11ty\eleventy\src\TemplateData.js:255:24)

Strapi 控制台错误消息

debug POST /articles (9 ms) 403

Answer 1

说明：

403 错误响应码对应403 - Forbidden。这意味着您尝试访问的路由根本不允许您的用户角色访问。

现在，查看您的请求调用，很明显您不是经过身份验证的用户，因为您没有在 api 请求上附加任何 bearer 令牌。它表明您可能正在尝试访问公共 api。但不幸的是，它没有在strapi 设置中标记为公开。

解决办法：

要使其正常工作，您需要允许此 api 用于公共角色。您可以通过访问user-permissions 模块并编辑public 角色的权限来完成此操作。

http://localhost:1337/admin/settings/users-permissions/roles

UI界面：

您应该会看到如下所示的界面，您可以在其中勾选您需要公开的apis。

参考：

Roles & Permissions