Správičky 2 813 Blogy 948 Fórum 18 712

Javascript Config

photo
Liero
12. 1. 2018 14:01:04
Body: 9610
Najaktívnejší č.: 6

Javascript Config

Zaujimalo by ma, ako riesite nejaku konfiguraciu SPA aplikacii.

Mam napriklad konfiguracne premmene PageTitle, BackendUrl, atd.

Najprv ma napadlo, riesit do nejakymi tokenmi pocas buildu, napr:

gulp build --pageTitle="Moj Projekt" --backendUrl="https://.."

To by ale znamenalo, ze pre kazdy environment musim robit osobitny build a to sa mi nechce, uz len kvoli VSTS Build/Release pipeline. Aplikaciu budem deployovat na viacero serverov s inymi configmi.

Dalsie riesenie by bolo mat nejaky clientconfig.json, ktory by som editoval na serveri (resp pocas release). Lenze to znamena oneskorenie nacitavania aplikacie o jeden zbytocny roundtrip:

Load index.html -> Load main.js -> clientconfig.json -> render.

//main.js
fetch('clientconfig.json')
    .then(config => initApp(config));

 

este ma napadlo mat ten config priamo v index.html ako globalnu premennu, lenze aj tam sa to komplikuje:

<script>
  fetch('clientconfig.json')
     .then(config => window._myApp.config = config);
<script>
<script src="main.js"></script>


v main.js by som nejako musel zabezpecit, aby _myApp.config bol na mieste.

 Dalo by sa este aj takto:

 

<script src="clientconfig.js"></script>
<script src="main.js"></script>

lenze vtedy by clientconfig musel byt bud prehnany cez build pipeline (typescript, babel, browserify, etc), alebo by uz rovno musel byt v specifickom formate (AMD...),pripadne cisty ES5, ktory by vytvaral globalnu premennu, ale v tom pripade by sa napriklad nedal pouzit v nodejs..

[Reakcia]

photo
harrison314
14. 1. 2018 21:19:27
Body: 1165
Najaktívnejší č.: 24

RE: Javascript Config

Ak ide o SPA aplikaciu, tak fetsh konfigu  v main.js je asi naj riesnie pre teba. lebo ho nacitas le  raz pri starte SPA. V porovaie s niekolko megabajtovymi bundlami aplikacie je to nic.

 

Osobne som pouzil posledny sposob, no to som pouzival v ASP.NET Core projektoch, ziadne Node.js, a konfiguracia bola riesnea globalnou premennou, ale tak, ze som k tomu ma TS modul, ktory exportoval interface s nastaveniami a boli spritupnene cez funkciu, aby som zabzpecil, ze je to readonly a nepritupoval k u globalnej premnnej priamo.

[Reakcia]

photo
Liero
15. 1. 2018 10:11:40
Body: 9610
Najaktívnejší č.: 6

RE: Javascript Config

No, zatial som to vyriesil takto:

<script>
   var __myAppConfig = {
      backendUrl: ''
   }
</script>
<script src="main.js"></script>
<script>
  initApp(__myAppConfig); //initApp is entry point in main.js
</script>

 

[Reakcia]



Najaktívnejší užívatelia
1. 37770 b. photo vlko
2. 21430 b. photo T
3. 15955 b. photo spigi
4. 15450 b. photo Anonymous
5. 11120 b. photo dudok
6. 9610 b. photo Liero
7. 6910 b. photo siro
8. 6245 b. photo slavof
9. 5395 b. photo duracellko
10. 4620 b. photo xxxmatko