employee_1
statistik
news_2
statistik
news_2
Resurs
Contributors:
  • obbyb
  • Emil
Last edited: 1/9/2023

Lets get the data

The API part is where you'll find our ”Control-panel” for API-calls for fetching your data.
In this part of the studio you will set up and view your credentials for authentication, you will also be able to try the different route-urls and view the json-data provided.


Easyweb is using ”0auth2” for authentication.
If you want to learn more about that you can read about it on the official website.



In the green area is where we see our available API-connection To the left you see the website/union, to the right you see the credentials (the first time you visit, there will be a button to create the credentials automatically).

Regarding the credentials: 

  • Client-ID 
  • Secret 
  • Url


Client-ID and the Secret is whats needed for the authentication and URL is the base-url needed for all calls.


Using the javascript fetch method, we can easily get our access token by using the /connect/token endpoint:

 const token = async () => {
    const CLIENT_ID = "xxxxx.xxxxx.xxxxx";
    const CLIENT_SECRET = "xxxxxxxx-xxxx-xxxx-xxx";
    const API_URL = "https://app.easyweb.se/extapi/4094/";

    const AUTH = "Basic " + btoa(CLIENT_ID + ":" + CLIENT_SECRET);
    const RAW_URL = API_URL.split("/extapi/")[0];

    return await fetch(RAW_URL + "/connect/token", {
        method: "POST",
        headers: {
            Authorization: AUTH,
            Accept: "application/json",
            "Content-Type": "application/x-www-form-urlencoded",
        },
        body:
            "client_id=" +
            CLIENT_ID +
            "&client_secret=" +
            CLIENT_SECRET +
            "&grant_type=client_credentials&scope=Easyweb.ExternalApi",
    })
        .then(tResponse => tResponse.json())
        .then(tokenObject => tokenObject)
}

With the provided access token, we can get access to our content. To get the content on the startpage, we'll use the /routes/home endpoint:

const getHomeData = async () => {
return await fetch("https://app.easyweb.se/extapi/4094/routes/home", {
headers: {Authorization: "Bearer" + Token}
     })
          .then(dResponse => dResponse.json());
}

The request response includes all the elements with keys added from the studio. And each element has the "value" property that contains our content:

{
   label: "Start",
   urlname: "start",
   viewKey: "Home",
   showDate: "2020-06-10T17:31:00+02:00",
   id: 23263,
   hero: {
       image: {
           value: "https://developer-docs.easyweb.site/upl/images/832950_1100_0_1_thumb.jpg"
       },
       label: {
           value: "Ett nytt sätt att upptäcka"
       },
       header: {
          value: "Silkeslena produkter med glansiga detaljer"
       },
    },
}

That's everything you need to build your interface!

This website uses cookies to improve your user experience, for security routines and for statistics. By continuing to use the website, you agree to the use of cookies.

This website uses cookies to improve your user experience, to provide a basis for improvement and further development of the website and to be able to direct more relevant offers to you.

Feel free to read ours privacy policy. If you agree to our use, choose Accept all. If you want to change your choice afterwards, you will find that option at the bottom of the page.

Cookies