Helô bawb! Croeso i'r ail bost yn ein cyfres sy'n dangos sut i ddefnyddio cymwysiadau gwe modern ar Red Hat OpenShift.
Yn ein postiad blaenorol, fe wnaethon ni sôn yn fyr am alluoedd y ddelwedd adeiladwr S2I (ffynhonnell-i-ddelwedd) newydd, sydd wedi'i chynllunio ar gyfer adeiladu a defnyddio cymwysiadau gwe modern ar blatfform OpenShift. Bryd hynny, roedden ni'n canolbwyntio ar ddefnyddio cymwysiadau'n gyflym, a heddiw byddwn ni'n archwilio sut i ddefnyddio'r ddelwedd S2I fel delwedd adeiladwr "lân" a'i chyfuno ag adeiladweithiau OpenShift cysylltiedig.
Delwedd adeiladwr glân
Fel y soniasom yn y rhan gyntaf, mae gan y rhan fwyaf o gymwysiadau gwe modern gam adeiladu fel y'i gelwir, sydd fel arfer yn cyflawni gweithrediadau fel trawsblannu cod, cysylltu ffeiliau, a lleihau. Mae'r ffeiliau sy'n deillio o hyn—HTML statig, JavaScript, a CSS—yn cael eu rhoi mewn ffolder allbwn. Mae lleoliad y ffolder hon fel arfer yn dibynnu ar yr offer adeiladu a ddefnyddir, ac ar gyfer React, y ffolder ./build fydd hi (byddwn yn dychwelyd at hyn yn fanylach isod).
Ffynhonnell-i-Delwedd (S2I)
Yn y post hwn, dydyn ni ddim yn cyffwrdd â'r pwnc "beth yw S2I a sut i'w ddefnyddio" (gallwch ddarllen mwy am hyn yma) ), ond mae'n bwysig cael dealltwriaeth glir o ddau gam y broses hon er mwyn deall beth mae delwedd Adeiladwr Apiau Gwe yn ei wneud.
Cyfnod y cydosod
Mae'r cam cydosod yn debyg iawn i'r hyn sy'n digwydd pan fyddwch chi'n rhedeg adeiladwaith Docker ac yn cael delwedd Docker newydd. Yn unol â hynny, mae'r cam hwn yn digwydd wrth redeg adeiladwaith ar y platfform OpenShift.
Yn achos delwedd Adeiladwr Apiau Gwe, mae'n gyfrifol am osod dibyniaethau eich cymhwysiad a rhedeg yr adeiladwaith. Yn ddiofyn, mae delwedd yr adeiladwr yn defnyddio'r adeiladwaith npm run build, ond gellir diystyru hyn trwy'r newidyn amgylcheddol NPM_BUILD.
Fel y trafodwyd yn gynharach, mae lleoliad y rhaglen orffenedig, wedi'i hadeiladu ymlaen llaw yn dibynnu ar yr offer a ddefnyddir. Er enghraifft, ar gyfer React, dyma'r ffolder ./build, tra ar gyfer rhaglenni Angular, dyma'r ffolder project_name/dist. Ac, fel y dangosir yn y post blaenorol, gellir diystyru lleoliad y cyfeiriadur allbwn, sydd wedi'i osod i adeiladu yn ddiofyn, gan ddefnyddio'r newidyn amgylcheddol OUTPUT_DIR. Gan fod lleoliad y cyfeiriadur allbwn yn amrywio yn ôl fframwaith, rydych chi'n syml yn copïo'r allbwn a gynhyrchwyd i'r ffolder ddiofyn yn y ddelwedd, sef /opt/apt-root/output. Mae hyn yn bwysig ar gyfer deall gweddill yr erthygl hon, ond am y tro, gadewch i ni adolygu'r cam nesaf yn gyflym—y cyfnod rhedeg.
Cyfnod rhedeg
Mae'r cam hwn yn digwydd pan wneir galwad rhedeg dociwr i ddelwedd newydd a grëwyd yn ystod y cam cydosod. Mae hefyd yn digwydd wrth ei ddefnyddio ar y platfform OpenShift. Yn ddiofyn defnyddiau i weini cynnwys statig sydd wedi'i leoli yn y cyfeiriadur allbwn safonol a bennir uchod.
Mae'r dull hwn yn dda ar gyfer defnyddio cymwysiadau'n gyflym, ond yn gyffredinol nid yw'n cael ei argymell ar gyfer gweini cynnwys statig. Gan mai dim ond cynnwys statig yr ydym yn ei weini, nid oes angen Node.js wedi'i osod yn ein delwedd—bydd y gweinydd gwe ei hun yn ddigonol.
Hynny yw, mae angen un peth arnom yn ystod y gwaith adeiladu a pheth arall yn ystod y gwaith gweithredu. Yn y sefyllfa hon, mae adeiladweithiau cadwynog yn dod yn ddefnyddiol.
Adeiladau cadwynog
Dyma beth maen nhw'n ysgrifennu amdano yn nogfennaeth OpenShift:
"Gellir cysylltu dau gynulliad â'i gilydd, gydag un yn cynhyrchu endid wedi'i lunio a'r llall yn gosod yr endid hwnnw mewn delwedd ar wahân a ddefnyddir i redeg yr endid hwnnw."
Hynny yw, gallwn ddefnyddio delwedd Adeiladwr Apiau Gwe i redeg ein hadeiladwaith, ac yna defnyddio delwedd gweinydd gwe, fel NGINX, i weini ein cynnwys.
Fel hyn gallwn ddefnyddio delwedd Adeiladwr Apiau Gwe fel adeiladwr "pur" a dal i gael delwedd amser rhedeg fach.
Nawr, gadewch i ni edrych ar hyn gan ddefnyddio enghraifft benodol.
Ar gyfer hyfforddiant byddwn yn defnyddio , wedi'i greu gan ddefnyddio'r offeryn llinell orchymyn create-react-app.
I'n helpu ni i roi'r cyfan at ei gilydd .
Gadewch i ni edrych yn agosach ar y ffeil hon, gan ddechrau gyda'r adran paramedrau.
parameters:
- name: SOURCE_REPOSITORY_URL
description: The source URL for the application
displayName: Source URL
required: true
- name: SOURCE_REPOSITORY_REF
description: The branch name for the application
displayName: Source Branch
value: master
required: true
- name: SOURCE_REPOSITORY_DIR
description: The location within the source repo of the application
displayName: Source Directory
value: .
required: true
- name: OUTPUT_DIR
description: The location of the compiled static files from your web apps builder
displayName: Output Directory
value: build
required: false
Mae popeth yma’n eithaf hunanesboniadol, ond mae’n werth rhoi sylw i’r paramedr OUTPUT_DIR. Ar gyfer y rhaglen React yn ein hesiampl ni, does dim byd i boeni amdano, gan fod React yn defnyddio’r gwerth diofyn ar gyfer y cyfeiriadur allbwn. Fodd bynnag, ar gyfer Angular neu rywbeth arall, bydd angen newid y paramedr hwn yn unol â hynny.
Nawr gadewch i ni edrych ar yr adran ImageStreams.
- apiVersion: v1
kind: ImageStream
metadata:
name: react-web-app-builder // 1
spec: {}
- apiVersion: v1
kind: ImageStream
metadata:
name: react-web-app-runtime // 2
spec: {}
- apiVersion: v1
kind: ImageStream
metadata:
name: web-app-builder-runtime // 3
spec:
tags:
- name: latest
from:
kind: DockerImage
name: nodeshift/ubi8-s2i-web-app:10.x
- apiVersion: v1
kind: ImageStream
metadata:
name: nginx-image-runtime // 4
spec:
tags:
- name: latest
from:
kind: DockerImage
name: 'centos/nginx-112-centos7:latest'
Cymerwch olwg ar y drydedd a'r bedwaredd ddelwedd. Mae'r ddau wedi'u diffinio fel delweddau Docker, ac mae'n amlwg o ble maen nhw'n dod.
Y drydedd ddelwedd yw web-app-builder ac mae wedi'i chymryd o nodeshift/ubi8-s2i-web-app gyda'r tag 10.x arno .
Y bedwaredd un yw delwedd NGINX (fersiwn 1.12) gyda'r tag diweddaraf arno .
Nawr, gadewch i ni edrych ar y ddwy ddelwedd gyntaf. Maen nhw ill dau yn wag wrth gychwyn ac yn cael eu creu yn ystod y cyfnod adeiladu yn unig. Y ddelwedd gyntaf, react-web-app-builder, fydd canlyniad y cyfnod cydosod, a fydd yn cyfuno'r ddelwedd amser rhedeg web-app-builder- â'n cod ffynhonnell. Dyma pam y gwnaethom gynnwys "-builder" yn enw'r ddelwedd.
Yr ail ddelwedd, react-web-app-runtime, fydd canlyniad cyfuno nginx-image-runtime a rhai ffeiliau o'r ddelwedd react-web-app-builder. Bydd y ddelwedd hon hefyd yn cael ei defnyddio ar gyfer defnyddio a dim ond y gweinydd gwe a'r HTML, JavaScript a CSS statig o'n cymhwysiad fydd yn ei gynnwys.
Dryslyd? Beth am edrych ar y ffurfweddiadau adeiladu a bydd yn dod ychydig yn gliriach.
Mae gan ein templed ddau gyfluniad adeiladu. Dyma'r cyntaf, sy'n eithaf safonol:
apiVersion: v1
kind: BuildConfig
metadata:
name: react-web-app-builder
spec:
output:
to:
kind: ImageStreamTag
name: react-web-app-builder:latest // 1
source: // 2
git:
uri: ${SOURCE_REPOSITORY_URL}
ref: ${SOURCE_REPOSITORY_REF}
contextDir: ${SOURCE_REPOSITORY_DIR}
type: Git
strategy:
sourceStrategy:
env:
- name: OUTPUT_DIR // 3
value: ${OUTPUT_DIR}
from:
kind: ImageStreamTag
name: web-app-builder-runtime:latest // 4
incremental: true // 5
type: Source
triggers: // 6
- github:
secret: ${GITHUB_WEBHOOK_SECRET}
type: GitHub
- type: ConfigChange
- imageChange: {}
type: ImageChange
Fel y gallwn weld, mae'r llinell wedi'i labelu 1 yn dweud y bydd canlyniad yr adeiladwaith hwn yn cael ei osod yn yr un ddelwedd react-web-app-builder a welsom yn gynharach yn yr adran ImageStreams.
Mae llinell wedi'i labelu 2 yn nodi ble i gael y cod. Yn ein hachos ni, mae'n storfa git, ac mae'r lleoliad, y cyfeirnod, a'r ffolder cyd-destun yn cael eu pennu gan y paramedrau a welsom eisoes uchod.
Llinell wedi'i labelu 3 yw'r hyn a welsom eisoes yn yr adran paramedrau. Mae'n ychwanegu'r newidyn amgylcheddol OUTPUT_DIR, sydd yn ein hesiampl ni yn hafal i build.
Mae llinell wedi'i labelu 4 yn dweud wrthym am ddefnyddio'r ddelwedd web-app-builder-runtime a welsom eisoes yn yr adran ImageStream.
Mae llinell 5 yn nodi ein bod am ddefnyddio adeiladwaith cynyddrannol os yw delwedd S2I yn ei gefnogi, ac mae delwedd Adeiladwr Apiau Gwe yn ei gefnogi. Ar y rhediad cyntaf, ar ôl cwblhau'r cam cydosod, bydd y ddelwedd yn cadw'r ffolder node_modules i ffeil archif. Yna, ar rediadau dilynol, bydd y ddelwedd yn syml yn dadsipio'r ffolder hon i leihau'r amser adeiladu.
Ac yn olaf, dim ond ychydig o sbardunau yw label llinell 6 i gael yr adeilad i redeg yn awtomatig, heb ymyrraeth â llaw, pan fydd rhywbeth yn newid.
At ei gilydd, mae hwn yn gyfluniad adeiladu eithaf safonol.
Nawr, gadewch i ni edrych ar yr ail gyfluniad adeiladu. Mae'n debyg iawn i'r cyntaf, ond mae un gwahaniaeth pwysig.
apiVersion: v1
kind: BuildConfig
metadata:
name: react-web-app-runtime
spec:
output:
to:
kind: ImageStreamTag
name: react-web-app-runtime:latest // 1
source: // 2
type: Image
images:
- from:
kind: ImageStreamTag
name: react-web-app-builder:latest // 3
paths:
- sourcePath: /opt/app-root/output/. // 4
destinationDir: . // 5
strategy: // 6
sourceStrategy:
from:
kind: ImageStreamTag
name: nginx-image-runtime:latest
incremental: true
type: Source
triggers:
- github:
secret: ${GITHUB_WEBHOOK_SECRET}
type: GitHub
- type: ConfigChange
- type: ImageChange
imageChange: {}
- type: ImageChange
imageChange:
from:
kind: ImageStreamTag
name: react-web-app-builder:latest // 7
Felly, yr ail gyfluniad adeiladu yw react-web-app-runtime, ac mae'n dechrau'n eithaf safonol.
Does dim byd newydd yn label llinell 1 - mae'n dweud yn syml bod allbwn yr adeilad yn cael ei roi yn y ddelwedd react-web-app-runtime.
Mae llinell wedi'i labelu 2, fel yn y cyfluniad blaenorol, yn nodi ble i gael y cod ffynhonnell. Ond nodwch yma ein bod yn nodi ei fod wedi'i gymryd o ddelwedd. Yn benodol, o'r ddelwedd a grëwyd gennym ni newydd—react-web-app-builder (a nodir yn llinell wedi'i labelu 3). Mae'r ffeiliau yr ydym am eu defnyddio wedi'u lleoli y tu mewn i'r ddelwedd, ac mae eu lleoliad wedi'i nodi yn llinell wedi'i labelu 4; yn ein hachos ni, mae'n /opt/app-root/output/. Os cofiwch chi, dyma lle mae'r ffeiliau a gynhyrchir trwy adeiladu ein cymhwysiad yn cael eu storio.
Y ffolder cyrchfan a bennir yn y llinell gyda'r label 5 yw'r cyfeiriadur cyfredol yn unig (cofiwch fod hyn i gyd yn rhedeg y tu mewn i rywbeth hudolus o'r enw OpenShift, ac nid ar eich cyfrifiadur lleol).
Mae'r adran strategaeth—llinell 6—hefyd yn debyg i'r cyfluniad adeiladu cyntaf. Y tro hwn, fodd bynnag, byddwn yn defnyddio nginx-image-runtime, a welsom eisoes yn yr adran ImageStream.
Yn olaf, y llinell wedi'i labelu 7 yw'r adran sbardunau a fydd yn sbarduno'r adeiladwaith hwn bob tro y mae'r ddelwedd react-web-app-builder yn newid.
Fel arall, mae'r templed hwn yn cynnwys cyfluniad defnydd safonol iawn, yn ogystal â phethau sy'n gysylltiedig â gwasanaethau a llwybrau, ond ni fyddwn yn mynd i mewn i hynny. Sylwch mai'r ddelwedd a fydd yn cael ei defnyddio yw'r ddelwedd react-web-app-runtime.
Defnyddio Cais
Felly nawr ein bod ni wedi edrych ar y templed, gadewch i ni weld sut i'w ddefnyddio i ddefnyddio'r rhaglen.
Gallwn ddefnyddio'r offeryn cleient OpenShift o'r enw oc i ddefnyddio ein templed:
$ find . | grep openshiftio | grep application | xargs -n 1 oc apply -f
$ oc new-app --template react-web-app -p SOURCE_REPOSITORY_URL=https://github.com/lholmquist/react-web-app
Y gorchymyn cyntaf yn y sgrinlun uchod yw ffordd a beiriannwyd yn fwriadol o ddod o hyd i'r template./openshiftio/application.yaml.
Mae'r ail orchymyn yn syml yn creu cymhwysiad newydd yn seiliedig ar y templed hwn.
Ar ôl i'r gorchmynion hyn gael eu gweithredu, fe welwn fod gennym ddau gynulliad:
A chan ddychwelyd i'r sgrin Trosolwg, byddwn yn gweld y pod yn rhedeg:
Bydd clicio ar y ddolen yn mynd â ni i'n cymhwysiad, sef tudalen ddiofyn Ap React:
Atodiad 1
I gariadon Angular mae gennym ni hefyd .
Mae'r templed yma yr un peth, ac eithrio'r newidyn OUTPUT_DIR.
Atodiad 2
Yn yr erthygl hon fe wnaethon ni ddefnyddio NGINX fel gweinydd gwe, ond mae'n eithaf hawdd ei ddisodli gydag Apache, dim ond newid y templed yn y ffeil ar .
Casgliad
Yn rhan gyntaf y gyfres hon, fe wnaethon ni ddangos sut i ddefnyddio cymwysiadau gwe modern yn gyflym ar blatfform OpenShift. Heddiw, fe wnaethon ni edrych ar yr hyn y mae delwedd Ap Gwe yn ei wneud a sut y gellir ei gyfuno â gweinydd gwe brodorol fel NGINX gan ddefnyddio adeiladweithiau cadwynog i greu adeiladwaith cymhwysiad sy'n fwy parod ar gyfer cynhyrchu. Yn yr erthygl nesaf ac olaf yn y gyfres hon, byddwn yn dangos i chi sut i lansio gweinydd datblygu ar gyfer eich cymhwysiad ar OpenShift a chadw ffeiliau lleol ac anghysbell mewn cydamseriad.
Cynnwys y gyfres hon o erthyglau
- Rhan 1: ;
- Rhan 2: Sut i ddefnyddio'r ddelwedd S2I newydd ochr yn ochr â delwedd gweinydd HTTP sy'n bodoli eisoes, fel NGINX, gan ddefnyddio adeiladweithiau OpenShift cysylltiedig i alluogi defnyddiau cynhyrchu;
- Rhan 3: Sut i redeg gweinydd datblygu ar gyfer eich cymhwysiad ar y platfform OpenShift a'i gysoni â'r system ffeiliau leol.
Adnoddau Ychwanegol
- E-lyfr am ddim .
- Gwybodaeth am .
Ffynhonnell: hab.com
