Google My Business API – kako ga aktivirati i koristiti

Google My Business API pruža brz i jednostavan način za tvrtke, proizvode, robne marke, umjetnike i organizacije da upravljaju svojim lokacijama na Google mreži.

API omogućava da se lokacijama upravlja putem prilagođenih aplikacija, npr. možemo napraviti Ionic mobilnu aplikaciju ili web Angular aplikaciju koja će dohvaćati popis svih naših lokacija sa Google mreže. Na taj način na jednom mjestu imamo pregled detalja svih lokacija. Također, za svaku od tih lokacija možemo uređivati te detalje ili dodavati nove informacije bez potrebe za ručnom prijavom u Google My Business sučelje na adresi http://business.google.com/manage.

Preduvjeti

Nekoliko je preduvjeta potrebno zadovoljiti kako bi se Google My Business API mogao koristiti jer inače nije dostupan unutar Google Developer Console.

1.) Google račun

Potrebno je kreirati Google račun kako bi se moglo pristupiti Google API Console sučelju. Za pretpostaviti je da već imamo Google račun ako želimo upravljati našim lokacijama koje smo ranije već kreirali u Google mreži, ali eto ovo je ipak prvi korak.

2.) Upoznati Google My Business sučelje

Prije korištenja API-ja važno je dobro upoznati što sve nudi Google My Business sučelje na adresi http://business.google.com/manage kako bi se uopće znalo kojim podacima je moguće upravljati.

Google My Business

3.) Google API Console

Kreirati projekt unutar Google API Console sučelja na adresi https://console.developers.google.com/project. Ovdje će se kasnije aktivirati Google My Business API.

P.S. Ako ste pratili neke od mojih ranijih blog postova možete prepoznati projekte koje sam kreirao upravo za te blog postove.

Google API Console

4.) Zatražiti pristup API-ju.

U ovom je koraku potrebno ispuniti Google My Business API: Application Form For Basic Access formu.

1. stranica

Google My Business API

2. stranica

Project ID – može se vidjeti u jednoj od gornjih slika. Lijevo se nalazi naziv projekta, a desno project ID.
Project Number – može se pronaći na adresi https://console.developers.google.com/iam-admin/settings?project=projectid
Gmail e-mail adrese – e-mail adrese developera koji će raditi s API-jem

Project ID & Project Number

Google My Business API

3. stranica

Company Name – naziv tvrtke
Company Website – web adresa tvrtke
Company’s Headquarters Address – adresa tvrtke
Company HQ’s Google Maps Listing URL – Google Maps poveznica tvrtkine adrese
Your Name – ime i prezime osobe koja ispunjava formu
Your Email – e-mail adresa, odgovorne, osobe koja ispunjava formu. Mora imati isti nastavak kao i web adresa. Ovo će biti glavna e-mail adresa za svu komunikaciju sa Googleom.
Gmail adresa Google Account Managera ako ga imate. U suprotnom navesti N/A.

Google My Business API

4. stranica

Potrebno odabrati u kojoj se kategoriji tvrtka nalazi, Local Business ili Third-pary / Reseller / Agency. Ostala će pitanja ovisiti o ovom odabiru.

Google My Business API

5. stranica – ako se odabere Local Business

– Odabrati na koliko se lokacija poduzeće nalazi, manje ili više od 10.
– Označiti koristi li se trenutno Google My Business za upravljanje lokacijama.
– Ako je odgovor na prethodno pitanje “da” potrebno je navesti Gmail adresu ili adrese koje imaju mogućnost pristupa Google My Business web sučelju.
– Za kraj, opisati u koju svrhu se planira koristiti Google My Business API.

Local Business

6. stranica – ako se odabere Third-pary / Reseller / Agency

Third-pary / Reseller / Agency

8. stranica – na nju se dođe nakon što se ispuni 5. ili 6. i 7. stranica

Technical / Product Information

Klikom na “SUBMIT” pojavljuje se ekran s osnovnim informacijama.

Google My Business API: Application Form For Basic Access

Sada se može jedino čekati. Iako navode da je potrebno do dva tjedna za odgovor obično će on stići kroz 2-3 radna dana.

Nakon što Google pregleda zahtjev i omogući pristup API-ju stići će poruka na e-mail adresu, npr. @tvrtka.com, navedenu unutar forme sa sljedećim sadržajem:

Google My Business API

Dodavanje developera

Već sada mogu dodati Gmail račune developera koji će imati mogućnost upravljanja API-jem, a koje sam naveo prilikom ispunjavanja forme.

U Google API Console sučelju, u gornjem desnom uglu, klikom na Project settings pojavljuje se izbornik s lijeve strane i ondje odabirem IAM kako bi klikom na ADD dodao Gmail račun novog developera.

Google API Console

Uskoro će navedeni developeri dobiti e-mail sljedećeg sadržaja

Google API Console

Oni sada, ovisno o dobivenim pravima, mogu raditi sve što ću napisati u nastavku.

Aktivacija Google My Business API-ja

Povratak u Google API Console sučelje na adresu projekta https://console.developers.google.com/apis/library?project=projectid

Tek sada je u katalogu API-ja, moguće pronaći Google My Business API.

VAŽNO! Ako se nisu obavili koraci navedeni iznad tj. ako se nije ispunio upitnik i ako nije stigao potvrdni e-mail Google My Business API neće biti moguće pronaći i aktivirati.

Google My Business API

Aktivacija se obavlja klikom na “ENABLE“.

Google My Business API

OAuth 2.0 client ID

Nakon što je API aktiviran potrebno je kreirati OAuth 2.0 client ID zato što API nije javan i Google na taj način kontrolira da API koriste samo one osobe koje na to imaju pravo.

Svaki zahtjev koji se uputi na Google My Business API treba u sebi sadržavati OAuth 2.0 token koji se kreira unutar izbornika Credentials. Ovdje mi je bitan Client ID.

Client ID for Web application

S obzirom da API planiram testirati na OAuth 2.0 Playground moram odobriti adresu https://developers.google.com/oauthplayground kako bi s iste mogao slati upite na API.

OAuth 2.0 client ID

U gornjem desnom kutu klikom na ikonu kotačića otvaraju se postavke. Za “OAuth flow” je potrebno odabrati Client-side. Osim toga potrebno je još kliknuti i na “Use your own OAuth credentials” te ondje unijeti ranije kreiran OAuth client ID.

OAuth 2.0 Playground

U izborniku s lijeve strane pod “Step 1 – Select & authorize APIs” je potrebno unijeti https://www.googleapis.com/auth/plus.business.manage i kliknuti na Authorize APIs.

Pod “Step 2 – Configure request to API” je potrebno unijeti https://mybusiness.googleapis.com/v4/accounts i kliknuti na Send the request.

Ako je sve prošlo uspješno prikazati će se status 200 OK što znači da je API funkcionalan.

OAuth 2.0 Playground

Na slici iznad može se vidjeti i autorizacijski token Bearer ya29.GlvmBlVJdoojCkXP9boiD1oudk8teDNzqls485U6Uylf74QUc2mlhw0RDOoszfdqo594IH2YOqVjNwCPscwEgFPqs3pwiRNPizJyrdUHaJCiiI-pjnX4TyPpK1ic koji ću sada iskoristiti kako bi isti upit na API napravio kroz Postman.

Kao što se može vidjeti na sljedećoj slici dobio sam rezultat s popisom lokacija tj. detalje, radno vrijeme, tih lokacija.

Google My Business API - Postman

Bez autorizacijskog tokena ne bi mogao dobiti traženi rezultat s popisom lokacija.

Google My Business API - Postman

Više informacija o ostalim dostupnim API pozivima na poveznici https://developers.google.com/my-business/reference/rest/

Uber API & Ionic 4 – Ride Request Button

U ovom ću blog postu pokazati kako koristiti Uber API tj. Ride Request Button unutar Ionic 4 aplikacije.

Ride Request Button je najjednostavniji i najbrži način da se unutar Ionic aplikacije omogući korištenje Ubera tj. slanje zahtjeva za vožnjom.

Dovoljno je kliknuti na gumb i korisnik će automatski biti preusmjeren unutar Uber aplikacije kojoj će biti prosljeđeni parametri kao što su mjesto preuzimanja i mjesto odredišta, uz ostale opcionalne parametre.

The Ride Request Button

Developer Dashboard

Prije svega potrebno je kreirati korisnički računa unutar Developer Dashboard sučelja. Također, potrebno je kreirati i profil za mobilnu aplikaciju koja će koristiti Uber API.

Developer Dashboard Uber API

Od podataka ovdje su mi najvažniji Client ID, Server Token i Client Secret.

Developer Dashboard Uber API
Parametar Opis
client_id Služi kao identifikator aplikacije, nešto kao korisničko ime aplikacije.
client_secret Služi kao lozinka aplikacije.
server_token Omogućava slanje zahtjeva prema API-ju.

Slanje upita na API

Sada se prebacujem na Uber API dokumentaciju.

Ekran će se sastojati od prikaza Google karte na većem dijelu ekrana i Uber gumba na dnu ekrana. Klikom na taj gumb poziva se Uber aplikacija kojoj prosljeđujem parametre:

  • clientID – obavezno
  • pickupLat
  • pickupLng
  • dropoffLat – obavezno
  • dropoffLng – obavezno

Uber API & Ionic 4 Na slici iznad vidim ekran sa Google kartom na kojoj se nalazi lokacija gdje želim da me Uber odveze. Ako mu i ne proslijedim svoju lokaciju Uber aplikacija će ju sama dohvatiti.

Čak niti Uber aplikacije ne mora, u trenutku klika na gumb, biti instalirana na mobilnom uređaju.

Uber Ride Request Button

Google Distance Matrix API – prikaz informacija o udaljenosti i vremenu putovanja između dvije lokacije na Google karti

U ovom ću blog postu pokazati kako koristiti Google® Distance Matrix API za prikaz informacija o udaljenosti i vremenu putovanja između dvije ili više lokacija na Google karti. Ideja za ovaj blog post došla je iz jednog projekta od prije nekoliko mjeseci, slično ovome, gdje smo kod kolege ugrađivali ovaj jednostavan, a vrlo koristan API.

The Distance Matrix API is a service that provides travel distance and time for a matrix of origins and destinations. The API returns information based on the recommended route between start and end points, as calculated by the Google Maps API, and consists of rows containing duration and distance values for each pair. – Developer Guide

Priprema projekta

Unutar Google Cloud Platform Console sučelja trebam prvo kreirati novi projekt ili odabrati postojeći.

Google Cloud Platform

S obzirom da sam prije koristio nekoliko različitih Google API-ja već imam postojeće projekte, ali ovaj API ne želim dodati niti u jedan od njih pa ću kreirati novi.

Google Cloud Platform

Novi projekt će se zvati APIs4Blog.

Google Cloud Platform New Project

Nakon što se novi projekt kreira pojavit će se sljedeći ekran. Ovdje me zanima gumb “ENABLE APIS AND SERVICES”.

Google Cloud Platform

Klikom na gumb “ENABLE APIS AND SERVICES” dolazim do sljedećeg ekrana gdje mogu vidjeti sve dostupne API-je.

Google Cloud Platform

Pomoću tražilice pronalazim Distance Matrix API.

Distance Matrix API Google Cloud Platform

Ovdje se još jednom mogu vidjeti detalji kao i cijena korištenja Distance Matrix API-ja.

Distance Matrix API Google Cloud Platform

Klikom na “ENABLE” mogu vidjeti sučelje s informacijama o korištenju API-ja.

Distance Matrix API Google Cloud Platform

Odmah se prebacujem na Credentials tab kako bi ondje kreirao API KEY bez kojega ne mogu koristiti Distance Matrix API.

Distance Matrix API Google Cloud Platform

API KEY je uspješno kreiran i spreman za korištenje.

Google Matrix API KEY

Implementacija

URL za slanje zahtjeva izgleda ovako:

Format dobivenih rezultata.

outputFormat određuje format dobivenih rezultata koji može biti u dva oblika: json ili xml. Maksimalna dužina URL-a je 8192 znakova.

Obavezni parametri (parameters)

Primjer API poziva sa obaveznim parametrima:

Kod parametara je situacija nešto složenija i postoje razne kombinacije kao što su:

Polazište (origins)

Polazište označava početnu lokaciju. Može biti zadano u obliku adrese, koordinata ili place ID-a.

Ako se za početnu lokaciju koristi više adresa ili koordinata između njih je potrebno staviti sljedeći znak “|”.

Korištenje adrese kao polazišta:

Distance Matrix API Adresa

Korištenje koordinata kao polazišta:

Distance Matrix API koordinate

Korištenje Place ID-a kao polazišta:

Distance Matrix API place ID

Odredište (destinations)

Jednak oblik kao i za polazište.

API Ključ (API KEY)

Njega sam kreirao ranije u ovom blog postu.

Opcionalni parametri
  • mode – označava način prijevoza koji će se koristiti pri izračunavanju udaljenosti. Moguće je birati između: driving (vožnja, ako se ništa ne odabere uzima se ovaj parametar), walking (hodanje), bicycling (bicikl), transit (javni prijevoz, ako postoji).

Google Distance Matrix API mode walking

Google Distance Matrix API language

  • region – označava odabir države prema ccTLD. Ovaj parametar će utjecati na rezultate geokodera, ali ako relevantniji rezultati postoje izvan određenog područja, oni mogu biti uključeni u rezultat.
  • avoid – omogućava odabir ograničenja za rutu. Npr. izbjegavati cestarinu (avoid=tolls), autocestu (avoid=highways).

Više o ostalim parametrima.

Kasnije je unutar sučelja moguće vidjeti statistiku korištenja API-ja.

Google Distance Matrix API statistika

HelmetJS – zaštita HTTP headera Express.js aplikacija

Sigurnost, jedna od stvari s kojoj svi prilikom razvoja aplikacije govore, ali ju malo njih smatra ozbiljnom ili odgađa za kasnije.

S druge strane, HTTP headeri su nešto što korisnici Express.js aplikacije ne vide i onda je developerima lako zapostaviti ih i gledati na njih kao na nešto nebitno. S obzirom da headeri daju razne informacije koje osobe s lošim namjerama mogu iskoristiti jasno je zašto ipak treba voditi brigu o njima tj. informacijama koje pružaju.

Jedna od tih informacije je X-Powered-By: Express što web pregledniku govori što pokreće aplikaciju tj. na čemu se temelji. Helmet.js će, između ostalog, sakriti ovu informaciju.

Zato je cilj ovog blog posta pokazati kako na brz i jednostavan način zaštititi Express.js aplikaciju koristeći Helmet.js koji neće riješiti sve sigurnosne probleme, ali je ipak odličan početak.

Što je Helmet.js?

Helmet.js je kolekcija od 14 modula koje se brinu za sigurnost HTTP zaglavlja (headers) točnije response headera.

HelmetJS moduli

7 od 14 modula aktiviraju se jednom linijom koda

Osim toga, svaki od tih zadanih modula moguće je individualno aktivirati

ili deaktivirati

Helmet.js moduli

Trenutno postoji 14 modula (defaultni označeni sa (✓)), a to su sljedeći:

1.) contentSecurityPolicy

Sets the Content-Security-Policy header which can help protect against malicious injection of JavaScript, CSS, plugins, and more.

2.) crossdomain

Prevents Adobe Flash and Adobe Acrobat from loading content on your site.

3.) dnsPrefetchControl (✓)

This middleware lets you disable browsers’ DNS prefetching by setting the X-DNS-Prefetch-Control header.

4.) expectCt

Tells browsers to expect Certificate Transparency. For more about Certificate Transparency and this header, see this blog post and the in-progress spec.

5.) featurePolicy

Lets you restrict which browser features can be used. For example, you can disable fullscreen or vibration APIs.

6.) frameguard (✓)

Frameguard mitigates clickjacking attacks by setting the X-Frame-Options header.

7.) hidePoweredBy (✓)

Removes the X-Powered-By header to make it slightly harder for attackers to see what potentially-vulnerable technology powers your site.

8.) hpkp

Helps you set the Public-Key-Pins header to prevent person-in-the-middle attacks. Usage of this header (and therefore this middleware) is not recommended. Be very careful when deploying this—you can easily misuse this header and cause problems. Chrome dropped support for HPKP citing risks of misuse.

9.) hsts (✓)

This module sets the Strict-Transport-Security header to keep your users on HTTPS.

10.) ieNoOpen (✓)

This middleware sets the X-Download-Options to prevent Internet Explorer from executing downloads in your site’s context.

11.) noCache

Aims to disable browser caching by setting several headers.

12.) noSniff (✓)

Helps prevent browsers from trying to guess (“sniff”) the MIME type, which can have security implications. It does this by setting the X-Content-Type-Options header to nosniff.

13.) referrerPolicy

Can control the behavior of the Referer header by setting the Referrer-Policy header.

14.) xssFilter (✓)

Sets the X-XSS-Protection header to prevent reflected XSS attacks.

Kreiranje projekta

Kreiram mapu projekta ExpressHelmet i unutar nje datoteku server.js

HelmetJS i Express.js

sa sljedećim sadržajem:

Detalje o tome kako kreirati osnovni Express.js API moguće je pronaći u blog postu pod naslovom Izrada RESTful API-ja koristeći Node.js i Express.js

Ako sada pokrenem API na adresi http://localhost:8080/api unutar Google Chrome Developer alata pod tabom Network dobit ću sljedeće:

HelmetJS i Express.js Headers

Postavljanje Helmet.js-a

Sljedećom naredbom untuar mape projekta instaliram Hellmet.js

Također, unutar server.js datoteke dodajem sljedeće:

Ako sada pokrenem API na adresi http://localhost:8080/api unutar Google Chrome Developer alata pod tabom Network dobit ću sljedeće:

HelmetJS i Express.js Headers

Na slici iznad mogu se vidjeti headeri kojih ranije nije bilo, a to su:

Također, headere mogu vidjeti i pokretanjem sljedeće naredbe:

Command line curl

Zaključak

Helmet.js nije “all in one” rješenje niti se njegovim postavljenjem unutar projekta može reći da je sigurnosna zaštita aplikacije gotova, ali je svakako dobar početak procesa razmišljanja o sigurnosti.

Node.js resursi

Do sada sam objavio nekoliko blog postova na temu Node.js-a, ali sam odlučio objaviti i ovaj blog post kako bi olakšao pronalazak i pregled svih blog postova vezanih upravo uz Node.js jednako kao što sam to napravio za Angular tj. Ionic Framework.

Ako niste pronašli vama zanimljiv/potreban blog post slobodno ostavite komentar s prijedlogom teme pa ću se potruditi objaviti blog post ili pronaći resurs koji će vam biti od pomoći.

9.) HelmetJS – zaštita HTTP headera Express.js aplikacija (28/10/2018)
8.) Node.js Cron Job – automatsko izvršavanje zakazanih zadataka (26/08/2018)
7.) ExpressJS middleware za ograničavanje ponovljenih zahtjeva na API-je (12/08/2018)
6.) nodemon – automatski restart NodeJS aplikacije (18/02/2018)
5.) Nodemailer & NodeJS – API za slanje emaila (07/07/2018)
4.) Kako napraviti REST API koristeći JSON Server (02/07/2017)
3.) Node.js API za slanje Push notifikacija (05/02/2017)
2.) Node.js RESTful API za upload datoteka (15/01/2017)
1.) Izrada RESTful API-ja koristeći Node.js i Express.js (08/01/2017)