2

I'm trying to use the new Notion API as a CMS for my personnal website. As a way to improve, i tried to use it with React. But it seems that it does not allow CORS (i use Axios).

What is the best way to consume this API ? Use an Express.JS Back-end ? I would think it's overkill for my use (I just want to read pages & blocks, not edit).

Here is my actual API Call, but from 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);
      });
      
}

In fact, I never really experienced back-end, so I don't know if it's really obligated to use the API.

Thanks.

Etienne Moureton
  • 59
  • 1
  • 8

3 Answers3

2

I solved this problem by Next.js.

I tried the official notion-sdk-js, but still can’t solve this problem, because it may be aimed at the server instead of the client.

By using the getServerSideProps of Next.js, Notion data can be obtained through fetch before each client request, and then the rendered page is directly returned to the client. Because the request is completed on the server side, there is no CORS problem. But the price is that you have to keep a Next.js process in the background for rendering the page.

Ginakira
  • 33
  • 5
1

Would you consider using a react framework like NextJS? You can use its SSG feature to generate the pages during build time, in which your credentials will not be visible on client side.

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

Notion also has an official js sdk, so you don't have to do all the API call hard work:

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

Tai Logan
  • 11
  • 1
0

use notion sdk -> https://github.com/makenotion/notion-sdk-js it provides all the functionality to interact with notion weather client side or server side.

ani chan
  • 51
  • 5