Jarný odpočinok so zástupcom spoločnosti Zuul

1. Prehľad

V tomto článku preskúmame komunikácia medzi front-end aplikáciou a REST API, ktoré sú nasadené osobitne.

Cieľom je obísť CORS a obmedzenie prehliadača pomocou politiky rovnakého pôvodu a umožniť používateľskému rozhraniu volať API, aj keď nezdieľajú rovnaký pôvod.

V zásade vytvoríme dve samostatné aplikácie - aplikáciu používateľského rozhrania a jednoduché rozhranie REST API a použijeme ju proxy Zuul v aplikácii UI na volania proxy na REST API.

Zuul je router založený na JVM a nástroj na vyrovnávanie zaťaženia na strane servera od spoločnosti Netflix. A Spring Cloud má príjemnú integráciu so zabudovaným proxy serverom Zuul - čo tu použijeme.

2. Konfigurácia Maven

Najskôr musíme pridať závislosť na podpore zuul z Spring Cloud do našich aplikácií používateľského rozhrania pom.xml:

 org.springframework.cloud spring-cloud-starter-netflix-zuul 2.2.0.RELEASE 

Najnovšiu verziu nájdete tu.

3. Vlastnosti Zuul

Ďalej - musíme nakonfigurovať Zuul a keďže používame Spring Boot, urobíme to v aplikácia.yml:

zuul: trasy: foos: cesta: / foos / ** url: // localhost: 8081 / spring-zuul-foos-resource / foos

Poznač si to:

  • Vykonávame proxy servera na náš zdrojový server Foos.
  • Všetky žiadosti z používateľského rozhrania, ktoré sa začínajú „/ foos /”Bude smerovaný k nášmu Foos Zdrojový server na adrese // loclahost: 8081 / spring-zuul-foos-resource / foos /

4. API

Naša aplikácia API je jednoduchá aplikácia Spring Boot.

V tomto článku sa budeme zaoberať rozhraním API nasadeným na spustenom serveri na porte 8081.

Najprv definujeme základné DTO pre zdroj, ktorý budeme používať:

public class Foo {private long id; súkromné ​​meno reťazca; // štandardné getre a setre}

A jednoduchý ovládač:

@RestController verejná trieda FooController {@GetMapping ("/ foos / {id}") verejné Foo findById (@PathVariable long id, HttpServletRequest req, HttpServletResponse res) {return new Foo (Long.parseLong (randomNumeric (2)), randomAl 4)); }}

5. Aplikácia používateľského rozhrania

Naša UI aplikácia je tiež jednoduchá aplikácia Spring Boot.

V tomto článku sa budeme zaoberať rozhraním API nasadeným na spustenom serveri na porte 8080.

Začnime tým hlavným index.html - pomocou trochy AngularJS:

     var app = angular.module ('myApp', ["ngResource"]); app.controller ('mainCtrl', function ($ scope, $ resource, $ http) {$ scope.foo = {id: 0, name: "sample foo"}; $ scope.foos = $ resource ("/ foos / : fooId ", {fooId: '@ id'}); $ scope.getFoo = function () {$ scope.foo = $ scope.foos.get ({fooId: $ scope.foo.id});}}) ; {{foo.id}} {{foo.name}} Nové Foo 

Najdôležitejším aspektom je to, ako pristupujeme k API pomocou relatívnych adries URL!

Pamätajte, že aplikácia API nie je nasadená na rovnakom serveri ako aplikácia používateľského rozhrania, takže relatívne adresy URL by nemali fungovať, a bez proxy servera nebude fungovať.

S proxy však pristupujeme k Foo zdroje prostredníctvom proxy servera Zuul, ktorý je samozrejme nakonfigurovaný na smerovanie týchto požiadaviek kamkoľvek, kde je API skutočne nasadené.

A nakoniec, skutočne povolená aplikácia Boot:

@EnableZuulProxy @SpringBootApplication verejná trieda UiApplication rozširuje SpringBootServletInitializer {public static void main (String [] args) {SpringApplication.run (UiApplication.class, args); }}

Okrem jednoduchej anotácie pri spustení si všimnite, že používame anotáciu v štýle aktivácie aj pre proxy server Zuul, čo je celkom super, čisté a výstižné.

6. Vyskúšajte smerovanie

Teraz - otestujme našu aplikáciu používateľského rozhrania - nasledovne:

@Test public void whenSendRequestToFooResource_thenOK () {Response response = RestAssured.get ("// localhost: 8080 / foos / 1"); assertEquals (200, response.getStatusCode ()); }

7. Vlastný filter Zuul

K dispozícii je niekoľko filtrov Zuul a môžeme si tiež vytvoriť vlastný:

@Component public class CustomZuulFilter rozširuje ZuulFilter {@Override public Object run () {RequestContext ctx = RequestContext.getCurrentContext (); ctx.addZuulRequestHeader ("Test", "TestSample"); návrat null; } @Override public boolean shouldFilter () {return true; } // ...}

Tento jednoduchý filter iba pridáva hlavičku s názvom „Test”K požiadavke - ale samozrejme, môžeme byť tak zložití, ako potrebujeme, aby sme tu rozšírili naše požiadavky.

8. Vyskúšajte vlastný filter Zuul

Na záver otestujme, či náš vlastný filter funguje - najskôr upravíme náš FooController na serveri zdrojov Foos:

@RestController public class FooController {@GetMapping ("/ foos / {id}") public Foo findById (@PathVariable long id, HttpServletRequest req, HttpServletResponse res) {if (req.getHeader ("Test")! = Null) {res .addHeader ("Test", req.getHeader ("Test")); } vrátiť nové Foo (Long.parseLong (randomNumeric (2)), randomAlphabetic (4)); }}

Teraz - otestujme to:

@Test public void whenSendRequest_thenHeaderAdded () {Response response = RestAssured.get ("// localhost: 8080 / foos / 1"); assertEquals (200, response.getStatusCode ()); assertEquals ("TestSample", response.getHeader ("Test")); }

9. Záver

V tomto zápise sme sa zamerali na použitie Zuulu na smerovanie požiadaviek z aplikácie používateľského rozhrania na REST API. Úspešne sme pracovali na princípe CORS a politike rovnakého pôvodu a podarilo sa nám tiež prispôsobiť a rozšíriť požiadavku HTTP pri prenose.

The úplná implementácia tohto tutoriálu nájdete v projekte GitHub - jedná sa o projekt založený na Maven, takže by malo byť ľahké ho importovať a spustiť tak, ako je.


$config[zx-auto] not found$config[zx-overlay] not found