Dronuilleach - Conas cead a sheiceáil bunaithe ar ról agus stádas aonáin

Sa lá atá inniu ann, is gnách go mbíonn d’iarratas sa phróiseas fíordheimhnithe agus údaraithe. Má chuardaíonn tú leabharlanna agus teicnící údaraithe ar an ngréasán, is féidir leat réitigh a fháil nach dtugann ach údarú ról-bhunaithe, ach a choisceann rochtain ar leathanach. Tarlaíonn sé beagnach i gcónaí go dteastaíonn údarú difriúil uait le haghaidh stádas an aonáin.

Don TL; Is é DR anseo an taispeántas agus an cód a úsáidtear sa taispeántas.

Creidmheasanna íomhá

Cad é an ifreann údarú stáit aonáin?

Bhuel, sílim nach raibh aon rud níos fearr i mo chloigeann chun é a ainmniú nuair a scríobh mé an post seo. Mar sin féin, baineann níos mó nó níos lú leis an méid atá mé ag iarraidh a rá leis na cásanna ina gcaithfidh tú an cumas atá ag an úsáideoir reatha gníomh áirithe a dhéanamh nó a bhaint de nuair a bhíonn stádas reatha an aonáin ag brath ar an stádas X agus ceann eile Leagann an cumas nuair a chumasaítear an t-aonán stáit Y agus tháinig an cás is measa nuair a bhí sé seo ar fad ar an scáileán céanna nó fiú sa chomhpháirt chéanna. Sábhálann gach leabharlann a bhfuil údarú bonn róil aici an fhadhb seo. Bhí mé tuirseach as ailt éagsúla a léamh ina gcuireann leathanaigh ról-bhunaithe cosc ​​ar réitigh, agus thosaigh mé ag smaoineamh agus ag clárú gan aon rud a bheith ar intinn agam. Go tobann fuair mé réiteach simplí, neamhchasta agus an-solúbtha ar an gcineál seo faidhbe, a raibh ceithre chuid ann.

  • Seirbhís chun an fhaisnéis úsáideora reatha a sholáthar (an rud atá thar a bheith tábhachtach ná bealach chun na róil úsáideora lena mbaineann an t-úsáideoir reatha nó a sannadh dóibh san iarratas a shonrú).
  • Cárta údaraithe sreabhadh oibre (comhad JSON)
  • Seirbhís údaraithe a dhéanann an seiceáil údaraithe
  • Treoir chun an tseirbhís údaraithe a sheiceáil

Céim 1: Faigh róil úsáideora reatha

Cuir seirbhís i bhfeidhm chun aisghabháil ó thaobh an fhreastalaí (den chéad uair) nó ó sheisiún nó fianáin mar is fearr leat le húsáid níos déanaí. Tá sé tábhachtach liosta scileanna (róil) an úsáideora a sholáthar.

// Sampla {Ainm: "John Doe", r-phost: '[email protected]', róil: ['díoltóir', 'díoltóir_manager'], <- braitheann sé ar accessToken: 'Alotofleters, dieanaccesstokenhahahaaa!' ... níos mó rudaí
}

I mo chás tá cuma níos mó nó níos lú air mar seo:

// allmhairiú anseo ...
Aicme onnmhairithe @Injectable () CurrentUserService {private userSubject = nua ReplaySubject (1); príobháideach hasUser = bréagach; Tógálaí (úsáideoirí príobháideachaApi: UserApi) {} getUser poiblí (): Breathnaithe {más rud é (! this.hasUser) {this.fetchUser (); } seo a chur ar ais.userSubject.asObservable (); } fetchUser poiblí (): neamhní {this.usersApi.getCurrent () // <== http glao chun userInfo .subscribe (user => {// ba cheart go mbeadh róil ag an úsáideoir this.hasUser = fíor; seo. userSubject.next (úsáideoir); this.userSubject.complete ();}, (error) => {this.hasUser = bréagach; this.userSubject.error (earráid);}); }}

An dara céim: cruthaigh do shreabhadh oibre agus forbhreathnú ar údarú

Níl anseo ach léiriú ar an méid is féidir linn a dhéanamh agus cé is féidir linn a dhéanamh trí chrann a thógáil leis na heintitis éagsúla agus a stáit féin. Mar shampla, smaoinigh ar an bpróiseas díolacháin seo a leanas: Is féidir go mbeidh cineálacha éagsúla ról ag ár bhfeidhmchlár. Inár sampla, sannann muid na róil don Díoltóir, do na réitigh ARCHITECT agus don CHUSTAIMÉIR.

Ionas nach labhraímid faoin bpróiseas:

  • Ar dtús, cuireann an Díoltóir deis trí ghníomh Add New Opportunity a dhéanamh, ar dóigh dó an stádas deise a chruthú
  • Ag an bpointe seo, is féidir leis an gCUSTAIMÉIRÍ & Díoltóir na riachtanais a chur leis an deis ionas gur féidir leis an mbeirt an gníomh Cuir Ceanglais a úsáid nuair a dhéantar na ceanglais. Féadfaidh stádas na deise athrú go dtí Arna chur isteach
  • Nuair a chomhlíontar na ceanglais, b’fhéidir go mbeidh ARCHITECT ag iarraidh réiteach a chur leis ionas go mbeidh gníomh ag teastáil: uaslódáil an réiteach agus d’fhéadfadh an stádas athrú go réiteach
  • Nuair a bheidh an réiteach curtha i bhfeidhm, b’fhéidir go mbeidh an CUSTAIMÉIR ag iarraidh glacadh leis ionas go mbeidh gníomh ag teastáil uaidh chun an réiteach a cheadú agus athraítear an stádas go réiteach_approved

Déanfaimid an próiseas a ghiorrú anseo, ar shlí eile mhéadódh sé seo an iomarca agus ní hamhlaidh atá leis an léamh seo. Bunaithe ar an bpróiseas seo, ar mhapáil, agus ag glacadh leis go bhfuil réimse rianaithe stádais ag an eintiteas deise, bheadh ​​an chuma ar ár sreabhadh oibre mar seo:

{"Opportunity": {"addOpportunity": {"allowRoles": ["SELLER"]}}, "created": {"addRequirement": {"allowRoles": ["SELLER", "CLIENT"]}}, " curtha isteach ": {" addSolution ": {" allowRoles ": [" ARCHITECT "]}}," réiteach ": {" ApproveSolution ": {" allowRoles ": [" CLIENT "]}}}}

Céim 3: An tseirbhís údaraithe fíoraithe chun an forbhreathnú ar shreabhadh oibre agus údarú a úsáid

Tar éis an próiseas a mhapáil isteach i sreabhadh oibre agus mapáil cead, caithfimid seirbhís a chruthú chun í a úsáid agus seiceáil an bhfuil an t-úsáideoir údaraithe nó nach bhfuil. D’fhéadfadh sé seo a bheith mar seo:

// Treoracha iompórtála anseo // Dála an scéil, in Angular-Cli is féidir linn an comhad JSON a chur isteach i // Environment.ts
@Injectable () aicme easpórtála WorkflowEvents {príobháideach inléite WORKFLOW_EVENTS = Comhshaol ['Sreabhadh Oibre']; userRoles príobháideach: tacar ;
// An cuimhin leat céim 1? úsáidtear é anseo tógálaí (current currentUserService: CurrentUserService) {} // seoltar seic poiblí inbhraite Boole ar aisAuthorization (cosán: ar bith): Breathnaithe {// Ní dhéanaimid na róil a luchtú ach uair amháin más rud é (! This.userRoles) {seol seo.currentUserService.getUser () .map (currentUser => currentUser.roles) .do (role => {const role = role.map ( role => role.name); this.userRoles = tacar nua (róil);}) .map (role => this.doCheckAuthorization (cosán)); } breathnaigh Observable.of (this.doCheckAuthorization (cosán)); } doCheckAuthorization príobháideach (cosán: sreangán []): boolean {if (path.length) {const entry = this.findEntry (this.WORKFLOW_EVENTS, cosán); más rud é (iontráil && iontráil ['allowRoles'] && this.userRoles.size) {faigh ar ais iontráil.permittedRoles .some (allowRole => this.userRoles.has (allowRole)); } filleadh bréagach; } filleadh bréagach; }
/ ** * Déan cuardach athfhillteach ar iontrálacha léarscáileanna sreabhadh oibre bunaithe ar na teaghráin chosáin * / findEntry príobháideach (currentObject: any, key: string [], index = 0) {const key = eochracha [innéacs]; más rud é (currentObject [eochair] && innéacs

Go bunúsach, caithfidh tú iontráil bhailí a chuardach agus seiceáil an bhfuil na róil úsáideora reatha san áireamh sna Ceadaithe Rialaithe.

Comhad 4: An Polasaí

Tar éis dúinn na róil úsáideora reatha, crann údaraithe sreabhadh oibre agus seirbhís chun an t-údarú do róil reatha úsáideora a sheiceáil, caithfimid é seo a chur i bhfeidhm in uillinn 2/4 trí threoir. Ar dtús, ba í an treoir a scríobh mé treoir tréith a thóg an tréith CSS taispeána. Mar sin féin, d’fhéadfadh fadhbanna feidhmíochta a bheith mar thoradh air seo toisc go bhfuil comhpháirteanna atá stóráilte i DOM fós luchtaithe. Dá bhrí sin, is fearr treoracha struchtúracha a úsáid (buíochas le mo chomhghleacaí Petyo Cholakov as an dea-ghabháil seo (féach an difríocht anseo) mar is féidir linn DOM na sprice eiliminte agus a sliocht a athrú chun eilimintí neamhúsáidte a luchtú a sheachaint.

@Directive ({Selector: '[appCanAccess]'}) aicme easpórtála Cuireann CanAccessDirective OnInit, OnDestroy {@Input ('appCanAccess') appCanAccess: sreang | sreang []; cead príobháideach $: síntiús; Tógálaí (teimpléad príobháideachRef: TemplateRef , amharc príobháideachContainer: ViewContainerRef, sreabhadh oibre príobháideachEvents: WorkflowEvents) {} ngOnInit (): neamhní {this.applyPermission (); } iarratas príobháideachPermission (): neamhní {this.permission $ = this.workflowEvents .checkAuthorization (this.appCanAccess) .subscribe (údaraithe => {más rud é (údaraithe) {this.viewContainer.createEmbeddedView (this.templateRef);} eile {seo .viewContainer.clear ();}}); } ngOnDestroy (): neamhní {this.permission $ .unsubscribe (); }}

Ar deireadh an obair mar thoradh air

Anois níl uainn ach am chun é a chur i ngníomh. Is é an t-aon rud atá le déanamh againn inár dteimpléad HTML ná an cód seo a leanas

Ligean le rá go bhfuil comhpháirt samplach againn ina bhfuil an réad deise:

@Component ({roghnóir: 'sp -ghsáil-painéal', teimpléad: ` 
 
 
 
 `}) An rang easpórtála Cuireann SampleComponent i bhfeidhm OnInit {@Input () OpportunityObject: ar bith;
Dearthóir () {} ngOnInit () {}}

Agus sin é, is féidir linn comhpháirt shimplí a bheith againn a léiríonn iompar bunaithe ar róil úsáideora agus stádas aonáin.

A bhuíochas le mo chomhghleacaithe Petyo agus Govind as an droch-chódú a ghabháil agus a cháineadh, bhíomar in ann an réiteach seo a fháil a oireann go foirfe dár riachtanais. Tá súil agam go gcabhraíonn sé sin leatsa freisin.

MEITHEAMH 2018, sampla beag oibre => https://emsedano.github.io/ng-entity-state/