Diskuze: JSON:API
V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.
Zobrazeno 12 zpráv z 12.
K personalizaci obsahu a reklam, poskytování funkcí sociálních médií a analýze naší návštěvnosti využíváme soubory cookie. Informace o tom, jak náš web používáte, sdílíme se svými partnery pro sociální média, inzerci a analýzy. Partneři tyto údaje mohou zkombinovat s dalšími informacemi, které jste jim poskytli nebo které získali v důsledku toho, že používáte jejich služby.
Používáme nezbytné cookies pro fungování webu a s tvým souhlasem také analytické a marketingové cookies.
Zajišťují základní funkce, bezpečnost a služby, které sis vyžádal. Nelze je vypnout.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| ITnetwork | ITnetwork | Provoz webu, relace, přihlášení a uložení nastavení cookies. | PHPSESSID, auth_token, sid, itn_consent_impression, __Host-itn_consent | Relace až 1 rok |
| Google Tag Manager | Správa značek a načítání měřicích nástrojů webu. | Žádné | Neukládá se | |
| Google Fonts | Načítání typografie webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google Hosted Libraries | Načítání potřebných knihoven a stylů webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google reCAPTCHA | Ochrana formulářů a webu před zneužitím. | _GRECAPTCHA, rc::a, rc::b, rc::c, rc::f | Relace až 180 dní | |
| YouTube | Přehrávání vloženého video obsahu. | localStorage, IndexedDB; cookies after playback interaction | Relace až trvalé úložiště | |
| Vimeo | Vimeo | Přehrávání vloženého video obsahu. | __cf_bm, _cfuvid, vuid, localStorage, IndexedDB | Relace až 2 roky |
| Facebook Login | Meta | Přihlášení pomocí účtu třetí strany. | Úložiště řízené poskytovatelem | Relace až 1 rok |
| GoPay | GoPay | Zpracování uživatelem vyžádané platby. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
Pomáhají nám porozumět používání webu a zlepšovat ho.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Analytics 4 | Měření návštěvnosti a používání webu. | _ga, _ga_* | Až 2 roky | |
| Microsoft Clarity | Microsoft | Měření návštěvnosti a používání webu. | _clck, _clsk, _cltk | Relace až 1 rok |
Slouží k měření kampaní, personalizaci reklamy a marketingové komunikaci.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Ads | Měření kampaní, reklama a remarketing. | _gcl_au, _gcl_ls | Relace až 90 dní | |
| Meta Pixel | Meta | Měření kampaní, reklama a remarketing. | _fbp, _fbc, localStorage | Až 90 dní |
| Sklik | Seznam.cz | Měření kampaní, reklama a remarketing. | retargeting, sid, szn:* | Relace až trvalé úložiště |
| LinkedIn Insight | Měření kampaní, reklama a remarketing. | bcookie, li_gc, lidc, __cf_bm | Relace až 1 rok | |
| Ecomail | Ecomail.cz | Měření kampaní, reklama a remarketing. | ecmid, Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
| Atribuce kampaní ITnetwork | ITnetwork | Přiřazení návštěvy a objednávky ke kampani. | campaign_clid[*], user_session_context | Až 1 rok |
V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.
Zdravím,
co je myšleno tím "přistupuje"? Pokud to API tvoříš, tak postupuješ podle toho standardu, je to v něm popsáno. A pokud ho konzumuješ, tak stejně jako k ostatním datům, prostě si vezmeš, co je posláno samozřejmě za předpokladu, že to k něčemu potřebuješ. Můžeš tu otázku případně zkusit formulovat trochu lépe? Díky!
Ahoj, díky za odpověď. Ano, jedná se o konzumaci vlastního API. Příklad: z API dostanu v JSON kolekci článků, to je tedy položka "data". Každý článek má autora. To by byla položka "data"->"relationships" a "included". Kdybych chtěl vypsat všechny články s autorem, projel bych nejspíš položku "data", kde jsou všechny články, jenže v "data"->"relationships" jsou jen IDčka. Pro bližší informace, např. jméno, musím jít do included. Included je jen pole s číselným indexem, čili mě nenapadá žádná rozumná možnost, jak k němu přistupovat z toho foreach. (Maximálně udělat další foreach a kontrolovat, jestli se shoduje ID, jenže to mi performance-wise přijde jako blbost.)
(Přikládám ilustrační kód, psal jsem narychlo, tak je nejspíš plný chyb, jde ale jen o ilustraci.)
{
"data": [{
"type": "articles",
"id": "1",
"attributes": "",
"relationships": [{
"type": "users",
"id": "1"
}]
},
{
"type": "articles",
"id": "2",
"attributes": "",
"relationships": [{
"type": "users",
"id": "1"
}]
},
{
"type": "articles",
"id": "3",
"attributes": "",
"relationships": [{
"type": "users",
"id": "2"
}]
}
],
"included": [{
"type": "users",
"id": "1",
"name": "John"
},
{
"type": "users",
"id": "2",
"name": "Patrick"
}
]
}
Bez toho precyklenia poľa included to ale nepôjde. Zato však stačí urobiť to raz. Mám na mysli napríklad urobiť si nové pole, kde index bude zhodný s id užívateľa.
Tak ako píše Vladislav, bez ďalšieho foreach to asi
nepôjde.
Pozor na to, že musíš kontrolovať aj type nie len rovnaké
id. V poli included môže byť viacero typov
(všetko čo je v data.relationships).
Viz ukážku (odstránil som z nej links):
{
"data": [{
"type": "articles",
"id": "1",
"attributes": {
"title": "JSON:API paints my bikeshed!"
},
"relationships": {
"author": {
"data": { "type": "people", "id": "9" }
},
"comments": {
"data": [
{ "type": "comments", "id": "5" },
{ "type": "comments", "id": "12" }
]
}
}
}],
"included": [{
"type": "people",
"id": "9",
"attributes": {
"firstName": "Dan",
"lastName": "Gebhardt",
"twitter": "dgeb"
}
}, {
"type": "comments",
"id": "5",
"attributes": {
"body": "First!"
},
"relationships": {
"author": {
"data": { "type": "people", "id": "2" }
}
}
}, {
"type": "comments",
"id": "12",
"attributes": {
"body": "I like XML better"
},
"relationships": {
"author": {
"data": { "type": "people", "id": "9" }
}
}
}]
}
Neexistuje nejaký balíček, ktorý ti tie dáta z API namapuje na nejaké
použiteľné objekty, aby si to nemusel riešiť sám? Imho to už niekto
vymyslel 
Vidíš, to mě nenapadlo. Zdá se, že nějaké parsery existují. Děkuji všem za odpovědi.
Kdyby někoho zajímalo, našel jsem teď narychlo třeba tento: https://github.com/…-serializer/
Přesně jak radí [me|]53059[/me|], udělej si z toho
"included" nové pole s indexy podle ID uživatelů. Je to
poměrně jednoduché. Předpokládejme, že máš např. ta vzorová data, co
jsi sem posílal, uložena v proměnné response. Potom kód v
JavaScriptu (ES6) může vypadat třeba takto:
const response = {...}; // Vzorová data.
const users = response.included.reduce((accumulator, user) => {
if (user.type === 'users' && user.id) accumulator[user.id] = user;
return accumulator;
}, {});
Teď už máš přímo to pole users, se kterým se bude lépe
pracovat podle toho ID:
console.log(users[2]); // ID 2 => {type: "users", id: "2", name: "Patrick"}
Jéje, dík za akceptovanie
A ešte poznámka ... ak máš takýchto vzťahov viacero, bolo by možno
vhodné prejsť z REST na GraphQL API. Mapovať si takéto veci na frontende,
aspoň pričasto teda, je zhovadilosť. S GraphQL sa ti to vráti tak, ako
potrebuješ. Napríklad miesto nič nehovoriaceho ID sa ti v relationship môže
vrátiť rovno príslušné NAME a TYPE.
Zobrazeno 12 zpráv z 12.
