1

我正在尝试使用新的 Notion API 作为我个人网站的 CMS。作为一种改进的方法，我尝试将它与 React 一起使用。但似乎它不允许 CORS（我使用 Axios）。

使用此 API 的最佳方式是什么？使用 Express.JS 后端？我认为这对我的使用来说太过分了（我只想阅读页面和块，而不是编辑）。

这是我实际的 API 调用，但来自 React ：

    const getPages = (apiCmsPage) => {
    var config = {
        method: 'get',
        url: 'https://api.notion.com/v1/blocks/'+ apiCmsPage +'/children?page_size=100',
        headers: { 
          'Authorization': KEY,
          'User-Agent' : 'PostmanRuntime/7.26.8'
        }
      };
      
      axios(config)
      .then(function (response) {
        console.log(JSON.stringify(response.data));
      })
      .catch(function (error) {
        console.log(error);
      });
      
}

事实上，我从来没有真正体验过后端，所以我不知道它是否真的有义务使用 API。

谢谢。

4

2 回答 2

1

你会考虑使用像 NextJS 这样的反应框架吗？您可以在构建期间使用其 SSG 功能生成页面，其中您的凭据将在客户端不可见。

https://nextjs.org/docs/basic-features/data-fetching#getstaticprops-static-generation

Notion 也有一个官方的 js sdk，所以你不必做所有的 API 调用艰苦的工作：

https://github.com/makenotion/notion-sdk-js

于 2021-05-17T07:06:49.740 回答
1

我通过 Next.js 解决了这个问题。

官方试过了notion-sdk-js，还是不能解决这个问题，可能是针对服务端而不是客户端。

通过getServerSidePropsNext.js的使用，可以在每次客户端请求之前通过获取Notion数据fetch，然后将渲染出来的页面直接返回给客户端。因为请求是在服务端完成的，所以不存在CORS问题。但是代价是你必须在后台保留一个 Next.js 进程来渲染页面。

于 2021-05-25T14:54:27.877 回答