Share
En av ioniske styrker er i tjenestene som den tilbyr på toppen av rammen. Dette inkluderer tjenester for godkjenning av brukere av appen din, pressemeldinger og analyser. I denne serien lærer vi om disse tjenestene ved å lage apper som gjør bruk av dem.
I dette innlegget skal vi ta en titt på Ionic Deploy. Denne tjenesten gjør at du kan publisere endringer i din joniske app uten behov for å kompilere og sende det på nytt til appbutikken. Dette er veldig nyttig for raskt å presse feilrettinger, mindre oppdateringer og andre kosmetiske endringer i appen. Med funksjonen "Deploy Channels" kan du også utføre A / B-tester ved å introdusere forskjellige kodeendringer til forskjellige distribusjonskanaler.
Ikke alle endringene du vil introdusere til appen din, kan bli skjøvet med Ionic Deploy, skjønt. Bare endringer i HTML, CSS, JavaScript og eiendeler under din www katalog kan skyves på denne måten. Binære endringer som oppdateringer til Cordova-plattformversjonen, Cordova-plugins (enten oppdatering av eksisterende eller legge til nye), og app-ressurser som ikon og sprutskjerm kan ikke skyves med Ionic Deploy.
I din ikoniske app kan du ha kode som vil sjekke for tilgjengelige distribusjoner (oppdateringer). Som standard vil det sjekke for distribusjon i produksjon kanal. Men du kan også spesifisere andre kanaler for å motta oppdateringer fra.
Du kan da trykke på endringene dine ved hjelp av ionisk opplasting kommando. Dette vil laste opp endringene dine til Ionic Cloud. Når de er lastet opp, kan du velge hvilken kanal du vil distribuere til, og om du skal distribuere nå eller på et senere tidspunkt.
Implementering til en kanal som appen din overvåker, vil utløse koden i appen din for å utføre. Denne koden er da ansvarlig for nedlasting av oppdateringen, utvinning av den, og lasting av appen for å bruke endringene.
I dette innlegget bruker du kommandolinjen til å trykke endringene og teste om distribusjonen fungerer som forventet. For å holde det enkelt, vil endringene vi skal introdusere, være hovedsakelig til brukergrensesnittet. For hver distribusjon skal vi endre versjonen som vises for appen. Vi skal også endre bildet som vises på appen for å vise at eiendeler kan oppdateres også.
Nå som du har en ide om hvordan ionisk distribusjon fungerer og hva du skal bygge, er det på tide å få hendene skitne ved å faktisk lage en app som bruker ionisk distribusjon. Begynn med å starte en ny jonisk app:
ioniske start - v2 distribuereApp-faner
Kommandoen ovenfor vil opprette en ny app ved hjelp av fanemalen. Naviger inne i deployApp katalog når det er ferdig å installere:
cd deployApp
Deretter må du installere @ Ionisk / sky-vinkel pakke. Dette er JavaScript-biblioteket for Ionic Cloud-tjenesten. Det tillater oss å samhandle med Ionic Deploy-tjenesten og andre ioniske tjenester via JavaScript-kode.
npm installere @ ionic / cloud-angular - save
Når det er ferdig med å installere, kan du nå initialisere en ny jonisk app basert på denne appen. Før du gjør det, må du sørge for at du allerede har en jonisk konto. Kommandolinjeverktøyet vil be deg om å logge inn med din joniske konto hvis du ikke allerede har gjort det.
ionisk io init
Dette vil opprette en ny app kalt "deployApp" (eller hva du kalt appen din når du bootstrapped en ny jonisk app) under din Ionic apps dashboard.
Når du har bekreftet at appen er oppført på ditt ioniske dashbord, går du tilbake til terminalen og installerer Deploy-plugin:
cordova plugin legg til ionic-plugin-deploy - save
Merk at dette pluginet er det som faktisk gjør det tunge løftet. De @ Ionisk / sky-vinkel pakken avslører bare APIene som kreves for enkelt å jobbe med de ioniske tjenestene i en jonisk app.
Nå som du har gjort alt nødvendig oppsett, er det på tide å legge til koden for å sjekke og bruke oppdateringer. Men før du gjør det, må du først tjene appen gjennom nettleseren din:
ionisk servering
Dette lar deg kontrollere om koden du har lagt til, fungerer eller ikke. På denne måten kan du gjøre de nødvendige rettelsene så snart du ser en feil.
Åpne src / app / app.module.ts fil. Under velkomstbilde importere, importere tjenestene som trengs for å jobbe med Ionic Cloud:
importer SplashScreen fra '@ ionic-native / splash-skjerm'; // legg til følgende: importer CloudSettings, CloudModule fra '@ ionic / cloud-angular';
Deretter legger du til APP_ID av din joniske app. Du finner dette på din ikoniske dashbord, rett under navnet på appen.
const cloudSettings: CloudSettings = 'core': 'app_id': 'DIN IONISK APP ID;
Når du har lagt til det, kan du nå inkludere det som en av modulene til appen:
@NgModule (declarations: [// ...], import: [BrowserModule, IonicModule.forRoot (MyApp), CloudModule.forRoot (cloudSettings) // <-- add this ], );
Deretter åpner du src / app / app.component.ts fil. Rett under TabsPage Import, inkluderer følgende:
importer TabsPage fra '... / pages / tabs / tabs'; // legg til disse: import AlertController, LoadingController fra 'ionisk-vinkelformet'; importer Deploy fra '@ ionic / cloud-angular'; // importer Deploy tjenesten fra @ ionic / cloud-angular pakken
I konstruktør (), Legg til tjenestene som vi importerte tidligere:
constructor (plattform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, offentlig distribusjon: Deploy, privat alarmCtrl: AlertController, privat loadingCtrl: LoadingController) // ...
Siden vi fortsatt utvikler appen, setter du distribusjonskanalen til dev:
this.deploy.channel = 'dev';
Senere, hvis du vil bytte til produksjonskanalen, kan du bare fjerne denne linjen som produksjon er standardkanalen for distribusjoner. Hvis du har opprettet en annen kanal, kan du også inkludere navnet her.
Du kan få tilgang til en rekke stillbilder som tidligere har blitt lastet ned av appen. De snapshots variabel er en matrise som inneholder IDene til hvert av øyeblikksbilder.
Accentsconagua
this.deploy.getSnapshots (). then ((snapshots) => console.log ('nå får stillbilder ...'); console.log (stillbilder););Vi vil egentlig ikke bruke øyeblikksbilder for denne appen, men det er godt å vite at appen lagrer denne typen informasjon for senere bruk. I eksemplet nedenfor går vi gjennom listen over gamle stillbilder og sletter hver for å frigjøre plass på enheten.
Snapshots.forEach ((snapshot_id) => this.deploy.getMetadata (snapshot_id) .then ((metadata) => // gjør noe med metadata); / / slett øyeblikksbilde this.deploy.deleteSnapshot (snapshot_id); );
For å sjekke om oppdateringer, bruk kryss av() metode. Dette returnerer en boolsk verdi som forteller deg om et nytt øyeblikksbilde er tilgjengelig eller ikke. Som standard vil den nyeste distribusjonen skape et nytt øyeblikksbilde. Så bare den nyeste distribusjonen blir brukt hvis du trykket to oppdateringer etter hverandre.
this.deploy.check (). deretter ((stillbildeAvailable: boolean) => // ...);
Hvis et øyeblikksbilde er tilgjengelig for nedlasting, kan du få mer informasjon om det ved å ringe getMetaData () metode. Denne metadata kan legges til en distribusjon gjennom ikonet dashbordet. Nøkkelverdier kan legges til her, og hver av dem blir tilgjengelige som en eiendom for metadata gjenstand. Senere bruker vi metadata for å tilpasse meldingene som vises i appen hver gang en ny oppdatering blir tilgjengelig.
hvis (stillbildeAvailable) // få metadata this.deploy.getMetadata (). deretter ((metadata) => console.log ('nå får metadata ...'); console.log (metadata);); Deretter viser du en bekreftelsesvarselmelding for å la brukeren avgjøre om de vil laste ned oppdateringen eller ikke:
la alert = this.alertCtrl.create (title: 'Version' + metadata.version + 'er tilgjengelig', melding: 'Vil du laste ned denne oppdateringen?', knapper: [text: 'Nei', rolle: "avbryt", handler: () => // gjør noen ting (f.eks. legg til analytikkode for å telle hvor mange brukere som ikke brukte oppdateringen), tekst: 'Ja', handler: () => // fortsett med å laste ned oppdateringen]); alert.present ();
Du kan være bekymret for at dette vil irritere brukeren hvis de fortsetter å motta meldingen om å oppdatere appen deres hvis de fortsetter å svare "Nei". Oftere det ikke, selv om dette er faktisk en god ting. Det bør ikke være noen grunn til at en bruker kan avvise en oppdatering hvis den skal forbedre sin erfaring.
Når brukeren er enig, kan du gå videre og laste ned oppdateringen. Dette kan ta en stund, avhengig av Internett-tilkoblingen din og enheten din. Når oppdateringen er lastet ned, vis en laster for å tiltrekke brukerens oppmerksomhet mens den utdrages. Når den er ekstrahert, la appen på nytt og skjul lasteren.
this.deploy.download (). then (() => // nedlastingen er gjort console.log ('nedlasting fullført!'); // Vis loader la last = this.loadingCtrl.create (content: 'Laster nå appen ... '); loading.present (); // utdrag oppdateringen this.deploy.extract (). deretter (() => console.log (' utdrag fullført! '); this.deploy.load ( ); // gjenopplasting av appen for å bruke endringene console.log ('Last inn fullført!'); loading.dismiss ();););Ta en titt på hva den oppdaterte app.components.ts filen skal se ut etter alle de endringene.
Nå som koden for å sjekke deployer er lagt til, kan vi bygge appen og installere den på en enhet. Resten av endringene som vi skal introdusere, blir primært presset gjennom Ionic Deploy-tjenesten.
Gå videre og legg til android plattformen til ditt ioniske prosjekt og bygge .apk fil med følgende kommandoer:
ionisk plattform legge android ionic build android
Dette vil skape en android-debug.apk fil inne i plattformer / android / bygge / utganger / apk mappe. Kopier den til enheten din og installer den.
Nå er det på tide for oss å presse noen endringer i appen. For å prøve det, bare gjør noen mindre endringer i app-brukergrensesnittet. Og nå kan du laste opp endringene:
ionisk opplasting
Når det er gjort opplasting, vil en ny oppføring bli oppført i din Nylig aktivitet. Klikk på Redigere lenke til den oppføringen. Dette vil tillate deg å legge til et notat, versjonsinformasjon og metadata til den bestemte utgivelsen. Det er alltid en god ide å legge til et notat slik at du vet hva den spesifikke utgivelsen handler om. Når du har gjort det, klikk på metadata fanen og legg til følgende:
Klikk deretter på Lagre knappen for å begå endringene dine. Til slutt klikker du på Utplassere knappen for å distribuere utgivelsen. Når appen henter på endringen, blir metadataene du har levert også tilgjengelige.
Du kan se at det nå viser versjonen av utgivelsen:
Noen ganger vil du skyve en oppdatering med Ionic Deploy, men også gjenoppbygge og sende de pakkene til den medfølgende appen i App Store. Vær imidlertid oppmerksom på, fordi ionisk ikke vet at appen din allerede inneholder oppdateringen, og appen din vil be brukeren om å laste ned de nyeste oppdateringene første gangen appen din kjøres.
Versjonsfunksjonen kan bidra til å forhindre dette. Med versionsversjonen kan du spesifisere versjonen av appen som kan motta oppdateringene:
Du kan legge til versionsinformasjon ved å klikke på REDIGERE lenke på en bestemt utgave, og deretter gå til versjons~~POS=TRUNC fane. Derfra kan du spesifisere versjoner (enten iOS eller Android) som du vil målrette mot.
Hva ionisk gjør er å sammenligne denne versjonen med den du spesifiserte i din config.xml fil:
Hvis appversjonen faller mellom minimum og maksimum spesifisert, utgivelsen er plukket opp. Og hvis appversjonen er lik den tilsvarende versjon verdi, utgivelsen ignoreres. Så for ovenstående skjermbilde, hvis versjonen angitt i config.xml filen er 0.0.1, utgivelsen vil bli ignorert av appen.
Den neste endringen vi skal gjøre er å vise et bilde.
Det første du må gjøre er å finne et bilde. Sett det inne i src / assets / img mappe og lenke den fra src / sider / home / home.html fil:
Hjem 
Versjon 4
Last opp endringene dine som en ny versjon til Ionic Deploy.
ionisk opplasting
Når du har lastet opp, går du til din ikoniske dashbord og oppdaterer utgivelsen med et notat og tilsvarende versjon i metadataene. Lagre endringene og distribuere det.
Å åpne appen bør nå hente denne nye utgivelsen, og oppdateringen vil gjelde endringene til brukergrensesnittet.
Ionic Deploy har som standard tre kanaler som du kan distribuere til: dev, iscenesettelse, og produksjon. Men du kan også opprette nye kanaler for appen din for å lytte etter oppdateringer på. Du kan gjøre det ved å klikke på tannhjulikonet på Ionisk distribuere fanen på appens dashbord:
Dette er nyttig for ting som A / B-testing, så du kan bare skyve bestemte endringer til bestemte brukere.
Ikke glem å oppdatere koden din for å bruke den aktuelle distribusjonskanalen:
this.deploy.channel = 'me';
Hvis du har presset noe du ikke burde ha, kan du bruke tilbakestillingsfunksjonen. Med denne funksjonen kan du trykke på en tidligere utgave tilbake til brukerne.
Merk at du ikke kan fikse ødelagt kode ved å rulle tilbake! Hvis du for eksempel har en syntaksfeil i JavaScript-koden din, vil den ødelegge hele appen, og koden for å sjekke at oppdateringer aldri vil kjøre. For å fikse slike feil, er det eneste du kan gjøre å frigjøre en ny versjon i appbutikken.
Du kan tilbakestille ved å klikke på Rull tilbake til her lenke på en gitt distribusjon.
Dette vil be deg om å bekrefte om du vil rulle tilbake eller ikke. Når bekreftet, blir den automatisk satt som den nåværende utgivelsen. Koden for å plukke opp nye utgivelser vil derfor gjenkjenne den som den nyeste utgivelsen, og vil be brukerne å oppdatere. Valsede tilbakemeldinger vil ha et oransje oppdateringsikon.
Du kan også distribuere en bestemt utgave ved å klikke på Utplassere lenke ved siden av utgivelsen du vil distribuere.
Du kan automatisere distribusjonen av appoppdateringer på Ionic Deploy med Git-kroker. Git kroker tillater deg å utføre skript før eller etter bestemte Git hendelser som forplikte, presse og motta. I dette tilfellet skal vi bruke pre-trykk krok for å laste opp våre endringer i Ionic Cloud rett før git push kommando gjør dens ting.
Start med å gi nytt navn til prøven pre-trykk Skript til det faktiske navnet anerkjent av Git:
mv. git / kroker / pre-push.sample. git / kroker / pre-push
Åpne filen i tekstredigeringsprogrammet og erstatt innholdet med følgende:
#! / bin / sh echo nå skyver endringer til ionisk distribuere ionisk opplasting
Gjør nå endringene dine og trykk dem til en ekstern repo:
git add. git commit -m "gjør noen endringer ..." git push origin master
Like før git push kommandoen utføres, ionisk opplasting vil bli utført.
Du kan også automatisk distribuere utgivelsen hvis du vil:
#! / bin / sh echo nå skyver endringer til ionisk distribuere ionic opplasting --deploy dev
Dette fungerer ikke for vårt eksempel, fordi du ikke kan spesifisere metadata!
Hvis du vil ta distribusjonsprosessen videre, anbefaler jeg at du sjekker ut HTTP-API for ionisk distribusjon. Dette lar deg programmere distribuere endringer i appen din fra Kontinuerlig Integreringsserver. Det lar deg oppdatere versjonsnumrene og metadataene på distribusjonene dine også. Alt dette kan gjøres automatisk og uten å berøre ikonet for ikonet.
Det er det! I denne opplæringen har du lært om Ionic Deploy og hvordan du kan bruke den til å presse oppdateringer til din joniske app. Dette er en kraftig funksjon som lar deg bygge et robust versjonings- og oppdateringssystem i appen din.
Hold deg oppdatert for mer innhold på ionisk og på sky tjenester som Ionic Deploy! Hvis du vil ha en komplett introduksjon til å komme i gang med ionisk 2 app-utvikling, sjekk ut kurset vårt her på Envato Tuts+.
Og sjekk ut noen av våre andre innlegg på jonisk og plattforms mobil app utvikling.
