Awọn ohun elo ode oni lori OpenShift, apakan 2: awọn ile-ẹwọn

Bawo ni gbogbo eniyan! Eyi ni ifiweranṣẹ keji ninu jara wa ninu eyiti a fihan bi o ṣe le ran awọn ohun elo wẹẹbu ode oni sori Red Hat OpenShift.

Awọn ohun elo ode oni lori OpenShift, apakan 2: awọn ile-ẹwọn

Ninu ifiweranṣẹ ti tẹlẹ, a fọwọkan diẹ lori awọn agbara ti aworan Akole S2I tuntun (orisun-si-aworan), eyiti o jẹ apẹrẹ fun kikọ ati gbigbe awọn ohun elo wẹẹbu ode oni sori pẹpẹ OpenShift. Lẹhinna a nifẹ si koko-ọrọ ti gbigbe ohun elo ni iyara, ati loni a yoo wo bii o ṣe le lo aworan S2I kan bi aworan akọle “mimọ” ati darapọ pẹlu awọn apejọ OpenShift ti o ni ibatan.

Mọ Akole image

Gẹgẹbi a ti mẹnuba ninu Apá XNUMX, ọpọlọpọ awọn ohun elo wẹẹbu ode oni ni ohun ti a pe ni ipele kikọ, eyiti o ṣe deede awọn iṣẹ bii gbigbe koodu, isomọ faili pupọ, ati minififisonu. Awọn faili ti o gba bi abajade awọn iṣẹ wọnyi - ati pe eyi jẹ HTML aimi, JavaScript ati CSS - ti wa ni ipamọ ninu folda iṣelọpọ. Ipo ti folda yii nigbagbogbo da lori kini awọn irinṣẹ kikọ ti a nlo, ati fun React eyi yoo jẹ folda ./build (a yoo pada wa si eyi ni alaye diẹ sii ni isalẹ).

Orisun-si-Aworan (S2I)

Ninu ifiweranṣẹ yii a ko fi ọwọ kan koko-ọrọ “kini S2I ati bii o ṣe le lo” (o le ka diẹ sii nipa eyi nibi), ṣugbọn o ṣe pataki lati ṣe alaye nipa awọn igbesẹ meji ninu ilana yii lati ni oye kini aworan Akole Oju opo wẹẹbu ṣe.

Apejọ alakoso

Ipele apejọ jẹ iru pupọ ni iseda si ohun ti o ṣẹlẹ nigbati o ba ṣiṣẹ docker kọ ati pari pẹlu aworan Docker tuntun kan. Nitorinaa, ipele yii waye nigbati o bẹrẹ kikọ lori pẹpẹ OpenShift.

Ninu ọran ti aworan Akole Ohun elo Wẹẹbu, o jẹ iduro fun fifi awọn igbẹkẹle ohun elo rẹ sori ẹrọ ati ṣiṣe kikọ. adapo akosile. Nipa aiyipada, aworan olupilẹṣẹ naa nlo ikole npm run build, ṣugbọn eyi le jẹ agbekọja nipasẹ oniyipada ayika NPM_BUILD.

Gẹgẹbi a ti sọ tẹlẹ, ipo ti pari, ohun elo ti a ti kọ tẹlẹ da lori iru awọn irinṣẹ ti o lo. Fun apẹẹrẹ, ninu ọran ti React eyi yoo jẹ folda ./build, ati fun awọn ohun elo Angular yoo jẹ folda project_name/dist. Ati pe, bi a ti han tẹlẹ ninu ifiweranṣẹ ti tẹlẹ, ipo ti itọsọna iwejade, eyiti o ṣeto lati kọ nipasẹ aiyipada, le jẹ agbekọja nipasẹ oniyipada ayika OUTPUT_DIR. O dara, niwọn bi ipo folda ti o wu jade yatọ si ilana si ilana, o kan daakọ iṣelọpọ ti ipilẹṣẹ si folda boṣewa ninu aworan, eyun /opt/apt-root/output. Eyi ṣe pataki fun agbọye iyoku nkan yii, ṣugbọn fun bayi jẹ ki a yara wo ipele atẹle - ipele ṣiṣe.

ṣiṣe alakoso

Ipele yii waye nigbati ipe kan si ṣiṣe docker wa lori aworan tuntun ti a ṣẹda lakoko ipele apejọ. Bakanna ni o ṣẹlẹ nigbati o ba n ṣiṣẹ lori pẹpẹ OpenShift. Aiyipada ṣiṣe akosile awọn lilo sìn module lati sin akoonu aimi ti o wa ninu ilana iṣelọpọ boṣewa loke.

Ọna yii dara fun gbigbe awọn ohun elo ni kiakia, ṣugbọn kii ṣe iṣeduro ni gbogbogbo lati sin akoonu aimi ni ọna yii. O dara, niwọn bi ni otitọ a ṣe iranṣẹ akoonu aimi nikan, a ko nilo Node.js ti a fi sori ẹrọ inu aworan wa - olupin wẹẹbu kan yoo to.

Ni awọn ọrọ miiran, nigba apejọ a nilo ohun kan, nigba ṣiṣe a nilo miiran. Ni ipo yii, awọn ile-ẹwọn ti o wa ni ọwọ wa.

Ṣẹwọn kọ

Eyi ni ohun ti wọn kọ nipa dè kọ ninu iwe OpenShift:

“Awọn apejọpọ meji ni a le sopọ papọ, pẹlu ọkan ti n ṣẹda nkan ti o ṣakojọ ati ekeji gbalejo nkan yẹn ni aworan lọtọ ti a lo lati ṣiṣe nkan yẹn.”

Ni awọn ọrọ miiran, a le lo aworan Akole Ohun elo wẹẹbu lati ṣiṣẹ kikọ wa, ati lẹhinna lo aworan olupin wẹẹbu, NGINX kanna, lati sin akoonu wa.

Nitorinaa, a le lo aworan Akole Ohun elo Wẹẹbu bi “funfun” Akole ati ni akoko kanna ni aworan asiko asiko kekere kan.

Bayi jẹ ki a wo eyi pẹlu apẹẹrẹ kan pato.

Fun ikẹkọ a yoo lo o rọrun React ohun elo, ti a ṣẹda nipa lilo ohun elo laini aṣẹ ṣẹda-react-app.

Yoo ṣe iranlọwọ fun wa lati fi ohun gbogbo papọ OpenShift awoṣe faili.

Jẹ ki a wo faili yii ni awọn alaye diẹ sii, ki o bẹrẹ pẹlu apakan awọn paramita.

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

Ohun gbogbo nibi jẹ kedere, ṣugbọn o tọ lati san ifojusi si paramita OUTPUT_DIR. Fun ohun elo React ninu apẹẹrẹ wa, ko si nkankan lati ṣe aniyan nipa, nitori React nlo iye aiyipada bi folda ti o wu jade, ṣugbọn ninu ọran ti Angular tabi nkan miiran, paramita yii yoo nilo lati yipada bi o ṣe pataki.

Bayi jẹ ki a wo apakan 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'

Wo awọn aworan kẹta ati kẹrin. Wọn jẹ asọye mejeeji bi awọn aworan Docker, ati pe o le rii ni kedere ibiti wọn ti wa.

Aworan kẹta ni ayelujara-app-builder ati pe o wa lati nodeshift/ubi8-s2i-web-app ti a samisi 10.x lori Docker ibudo.

Ẹkẹrin jẹ aworan NGINX (ẹya 1.12) pẹlu aami tuntun lori Docker ibudo.

Bayi jẹ ki ká wo ni akọkọ meji images. Wọn ti ṣofo mejeeji ni ibẹrẹ ati pe wọn ṣẹda nikan lakoko ipele kikọ. Aworan akọkọ, react-web-app-builder, yoo jẹ abajade ti igbesẹ apejọ kan ti yoo ṣajọpọ aworan wẹẹbu-app-builder-runtime aworan ati koodu orisun wa. Ti o ni idi ti a fi kun "-Akole" si awọn orukọ ti yi image.

Aworan keji - react-web-app-runtime - yoo jẹ abajade ti apapọ nginx-image-runtime ati diẹ ninu awọn faili lati aworan fesi-web-app-builder. Aworan yii yoo tun ṣee lo lakoko imuṣiṣẹ ati pe yoo ni olupin wẹẹbu nikan ati HTML aimi, JavaScript, CSS ti ohun elo wa.

O rudurudu bi? Bayi jẹ ki a wo awọn atunto Kọ ati pe yoo di alaye diẹ sii.

Awoṣe wa ni awọn atunto Kọ meji. Eyi ni akọkọ, ati pe o jẹ boṣewa lẹwa:

  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

Bii o ti le rii, laini pẹlu aami 1 sọ pe abajade ti kikọ yii yoo gbe si aworan ifaṣe-web-app-builder kanna ti a rii diẹ ṣaaju ni apakan ImageStreams.

Laini ti a samisi 2 sọ fun ọ ibiti o ti gba koodu lati. Ninu ọran wa, eyi jẹ ibi ipamọ git kan, ati ipo, ref ati folda agbegbe jẹ ipinnu nipasẹ awọn aye ti a ti rii tẹlẹ loke.

Laini ti a samisi 3 jẹ ohun ti a ti rii tẹlẹ ni apakan awọn paramita. O ṣe afikun OUTPUT_DIR oniyipada ayika, eyiti ninu apẹẹrẹ wa ni kikọ.
Laini ti a samisi 4 sọ lati lo oju opo wẹẹbu-app-builder-runtime image, eyiti a ti rii tẹlẹ ni apakan ImageStream.

Laini ti a samisi 5 sọ pe a fẹ lati lo kikọ afikun ti aworan S2I ba ṣe atilẹyin, ati aworan Akole Ohun elo wẹẹbu ṣe. Ni ifilọlẹ akọkọ, lẹhin ti ipele apejọ ti pari, aworan naa yoo ṣafipamọ folda node_modules sinu faili pamosi kan. Lẹhinna, lori awọn ṣiṣe atẹle, aworan naa yoo ṣii folda yii nirọrun lati dinku akoko kikọ.

Ati nikẹhin, laini ti a samisi 6 jẹ awọn okunfa diẹ lati jẹ ki iṣelọpọ ṣiṣẹ laifọwọyi, laisi ilowosi afọwọṣe, nigbati nkan ba yipada.

Lapapọ eyi jẹ iṣeto Kọ boṣewa lẹwa kan.

Bayi jẹ ki ká wo ni keji Kọ iṣeto ni. O jọra pupọ si akọkọ, ṣugbọn iyatọ pataki kan wa.

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

Nitorinaa iṣeto ikole keji jẹ akoko ṣiṣe-ayelujara-app-akoko, ati pe o bẹrẹ boṣewa lẹwa.

Laini ti a samisi 1 kii ṣe nkan tuntun - o kan sọ pe abajade kikọ ni a fi sinu aworan react-web-app-runtime image.

Laini ti a samisi 2, bi ninu iṣeto iṣaaju, tọka ibiti o ti le gba koodu orisun lati. Ṣugbọn ṣe akiyesi pe nibi a n sọ pe o ti ya lati aworan naa. Pẹlupẹlu, lati aworan ti a ṣẹṣẹ ṣẹda - lati react-web-app-Builder (itọkasi ni ila ti a samisi 3). Awọn faili ti a fẹ lati lo wa ninu aworan naa ati pe ipo wọn wa nibẹ ti ṣeto ni laini ti a samisi 4, ninu ọran wa o jẹ /opt/app-root/output/. Ti o ba ranti, eyi ni ibiti awọn faili ti ipilẹṣẹ ti o da lori awọn abajade ti kikọ ohun elo wa ti wa ni ipamọ.

Fọọmu opin irin ajo ti o ṣalaye ninu ọrọ pẹlu aami 5 jẹ itọsọna lọwọlọwọ (eyi ni gbogbo rẹ, ranti, nṣiṣẹ inu diẹ ninu ohun idan ti a pe ni OpenShift, kii ṣe lori kọnputa agbegbe rẹ).

Awọn apakan nwon.Mirza - ila ike 6 - jẹ tun iru si akọkọ Kọ iṣeto ni. Ni akoko yii nikan a yoo lo nginx-image-runtime, eyiti a ti rii tẹlẹ ni apakan ImageStream.

Lakotan, laini ti a samisi 7 jẹ apakan ti awọn okunfa ti yoo mu kikọ yii ṣiṣẹ ni gbogbo igba ti aworan-atunṣe-web-app-builder image yipada.

Bibẹẹkọ, awoṣe yii ni iṣeto imuṣiṣẹ imuṣiṣẹ ti o lẹwa, bakanna bi awọn nkan ti o ni ibatan si awọn iṣẹ ati awọn ipa-ọna, ṣugbọn a kii yoo lọ sinu alaye ti o pọ julọ. Jọwọ ṣakiyesi pe aworan ti yoo gbe lọ jẹ aworan akoko ṣiṣe-ayọ-ayelujara-app.

Ohun elo imuṣiṣẹ

Nitorinaa ni bayi ti a ti wo awoṣe naa, jẹ ki a wo bii o ṣe le lo lati fi ohun elo kan ranṣẹ.

A le lo ohun elo alabara OpenShift ti a pe ni oc lati mu awoṣe wa:

$ 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

Aṣẹ akọkọ ninu sikirinifoto ti o wa loke jẹ ọna imọ-ẹrọ imọ-jinlẹ lati wa awoṣe kan./openshiftio/application.yaml.

Aṣẹ keji n ṣẹda ohun elo tuntun kan ti o da lori awoṣe yii.

Lẹhin ti awọn aṣẹ wọnyi ṣiṣẹ, a yoo rii pe a ni awọn apejọ meji:

Awọn ohun elo ode oni lori OpenShift, apakan 2: awọn ile-ẹwọn

Ati pada si iboju Akopọ, a yoo rii adarọ ese ti a ṣe ifilọlẹ:

Awọn ohun elo ode oni lori OpenShift, apakan 2: awọn ile-ẹwọn

Tẹ ọna asopọ naa ati pe a yoo mu wa lọ si app wa, eyiti o jẹ oju-iwe App React aiyipada:

Awọn ohun elo ode oni lori OpenShift, apakan 2: awọn ile-ẹwọn

Àfikún 1

Fun awọn ololufẹ Angular a tun ni ohun elo apẹẹrẹ.

Àpẹẹrẹ nibi jẹ kanna, ayafi fun oniyipada OUTPUT_DIR.

Àfikún 2

Ninu nkan yii a lo NGINX bi olupin wẹẹbu, ṣugbọn o rọrun pupọ lati paarọ rẹ pẹlu Apache, kan yi awoṣe pada ninu faili naa. aworan NGINX on Apache aworan.

ipari

Ni apakan akọkọ ti jara yii, a fihan bi o ṣe le yara ran awọn ohun elo wẹẹbu ode oni sori pẹpẹ OpenShift. Loni a wo kini aworan Ohun elo Wẹẹbu kan ṣe ati bii o ṣe le ni idapo pẹlu olupin wẹẹbu mimọ bi NGINX ni lilo awọn ile-ẹwọn lati ṣẹda kikọ ohun elo ti o ṣetan-iṣelọpọ diẹ sii. Ninu nkan atẹle ati ikẹhin ninu jara yii, a yoo ṣafihan bi o ṣe le ṣiṣe olupin idagbasoke kan fun ohun elo rẹ lori OpenShift ati rii daju imuṣiṣẹpọ ti agbegbe ati awọn faili latọna jijin.

Awọn akoonu ti yi jara ti ìwé

  • Apa 1: bi o ṣe le ran awọn ohun elo wẹẹbu ode oni ni awọn igbesẹ diẹ;
  • Apá 2: Bii o ṣe le lo aworan S2I tuntun pẹlu aworan olupin HTTP ti o wa tẹlẹ, gẹgẹbi NGINX, ni lilo awọn apejọ OpenShift ti o somọ fun imuṣiṣẹ iṣelọpọ;
  • Apakan 3: bii o ṣe le ṣiṣe olupin idagbasoke kan fun ohun elo rẹ lori pẹpẹ OpenShift ki o muuṣiṣẹpọ pẹlu eto faili agbegbe.

Afikun Resources

orisun: www.habr.com

Fi ọrọìwòye kun