Send authorization header

🙋Get Help
1

Currently im having a problem fetching my menus from wordpress since the endpoint need authorization and i cant figure out how to send the authorization bearer header.

  • Plugin installed for menus
  • Plugin installed for JWT-Authentication

I managed to setup a afterCSR request to fetch the token.

What i setup for menus:

actions: {
    theme: {       
      ...
      beforeSSR: ({ actions }) => async () => {
        await actions.source.fetch("menus/2");
      },
      afterCSR: async ({ state, libraries, actions }) => {
        if (state.frontity.platform === 'client') {
          if (undefined === state.theme.token) {
            actions.theme.fetchToken();
          }
        }
      },
      fetchToken
    }
  },
  libraries: {
   source: {
     handlers: [menuHandler],
    }
}

Handler:

const menuHandler = {
  name: "menus",
  priority: 10,
  pattern: "menus/:id",
  func: async ({ route, params, state, libraries }) => {
    const { api } = libraries.source;
    const { id } = params;
    const response = await api.get({
      endpoint: "menus/",
      headers: {
        "authorization": "Bearer mytokenhere",
        "host": "myhosthere",
        "accept": "*\/*",
      },
      params: {
        menus: id,
        per_page: 100
      }
    });

    const items = await response.json();
    const currentPageData = state.source.data[route];

    Object.assign(currentPageData, {
      id,
      items,
      isMenu: true
    });
  }
};

I repeatedly receive a 401 unauthorized.
Via Postman i managed to get the Menus from the endpoint so the authorization works actually. But i guess the header is not sent by frontity fetch. Any ideas on how to send the header correct?

2

Hello @pirmin.bahr one of my team member solve this issue

@sarang can you please provide the solution here?

1 Like
3

Heres a way to get menus that worked for me.

import { fetch } from "frontity";

const responseMenus = await fetch("https://example.com/wp-json/wp/v2/menus", {
            method: "GET",
            headers: {
                Authorization: `Bearer ${responseJSON.access_token}`,
            },
        });
4 Likes
4

Good morning I have the same problem, get a solution?

6

Hi @hugsaf2132

Does the solution provided not work for you? What error are you getting?

7

45/5000

Now it’s working, thanks for your attention

1 Like