Base solution for your next web application
Open Closed

Weird behaviour of ASPNET Zero and Angular project #4572


User avatar
0
khai created

Hello Volosoft,

I am getting the weird issue inside Angular project and ASP.NET Core 2.0 project (ASPNETZero version 5.0).

Inside the ASPNETZero Core project, I have used "AbpAuthorize(Permission)" for authorizing user. Ideally, if user doesn't have permission, they cannot access the resource. However, the weird thing is: I see the popup Not having permission, but after that, I still get the data. Here is my code:

Angular Code:

resetForm(model) {
        this.isBusy = true;
        setTimeout(() => {
            this.form.resetForm(model);
        });
        const { tenantId, languageCode } = this.getSectionInfo();
        this._unitsService.getMember(tenantId, model.memberId, languageCode)
            .subscribe(res => {
                setTimeout(() => {
                    this.form.resetForm(res);
                    this.DOB = res.dateOfBirth.toDate();
                    this.isBusy = false;
                });
            });
    }

Services proxy code:

getMember(tenantId: number, memberId: number, language: string): Observable<MemberReadOutput> {
        let url_ = this.baseUrl + "/api/services/app/Units/GetMember?";
        if (tenantId === undefined || tenantId === null)
            throw new Error("The parameter 'tenantId' must be defined and cannot be null.");
        else
            url_ += "tenantId=" + encodeURIComponent("" + tenantId) + "&"; 
        if (memberId === undefined || memberId === null)
            throw new Error("The parameter 'memberId' must be defined and cannot be null.");
        else
            url_ += "memberId=" + encodeURIComponent("" + memberId) + "&"; 
        if (language !== undefined)
            url_ += "language=" + encodeURIComponent("" + language) + "&"; 
        url_ = url_.replace(/[?&]$/, "");

        let options_ : any = {
            method: "get",
            headers: new Headers({
                "Content-Type": "application/json", 
                "Accept": "application/json"
            })
        };

        return this.http.request(url_, options_).flatMap((response_ : any) => {
            return this.processGetMember(response_);
        }).catch((response_: any) => {
            if (response_ instanceof Response) {
                try {
                    return this.processGetMember(<any>response_);
                } catch (e) {
                    return <Observable<MemberReadOutput>><any>Observable.throw(e);
                }
            } else
                return <Observable<MemberReadOutput>><any>Observable.throw(response_);
        });
    }

    protected processGetMember(response: Response): Observable<MemberReadOutput> {
        const status = response.status;

        let _headers: any = response.headers ? response.headers.toJSON() : {};
        if (status === 200) {
            const _responseText = response.text();
            let result200: any = null;
            let resultData200 = _responseText === "" ? null : JSON.parse(_responseText, this.jsonParseReviver);
            result200 = resultData200 ? MemberReadOutput.fromJS(resultData200) : new MemberReadOutput();
            return Observable.of(result200);
        } else if (status !== 200 && status !== 204) {
            const _responseText = response.text();
            return throwException("An unexpected server error occurred.", status, _responseText, _headers);
        }
        return Observable.of<MemberReadOutput>(<any>null);
    }

C# Code in Core project:

[AbpAuthorize(AppPermissions.Staffs_Units_Member_ReadAll)]
        public async Task<MemberReadOutput> GetMember(int tenantId, int memberId, string language = null)
        {
            try
            {
                _httpClient = new UnitsHttpClient(_baseUrl, GetHttpClient());
                var _response = await _httpClient.ApiByTenantIdMemberByMemberIdGetAsync(tenantId, memberId, language);
                var user = await UserManager.GetUserByIdAsync(memberId);
                if (user.ProfilePictureId.HasValue)
                {
                    var profile = await _profileService.GetProfilePictureById(user.ProfilePictureId.Value);
                    _response.ProfilePicture = "data:image/jpeg;base64," + profile.ProfilePicture;
                }
                _response.Name = user.Name;
                _response.Surname = user.Surname;
                _response.PhoneNumber = user.PhoneNumber;
                return _response;
            }
            catch (SwaggerException e)
            {
                throw new UserFriendlyException(int.Parse(e.StatusCode), e.Message);
            }
        }

I have made a demo, but it contains some confidential information. Therefore I will send you via email ASAP.

Please review it, thanks.


2 Answer(s)
  • User Avatar
    0
    alper created
    Support Team

    hi

    Seems like there's a recursive call, isn't is?

    resetForm(model) {
            this.isBusy = true;
            setTimeout(() => {
                this.form.resetForm(model); ********** RESETS FORM *******
            });
            const { tenantId, languageCode } = this.getSectionInfo();
            this._unitsService.getMember(tenantId, model.memberId, languageCode)
                .subscribe(res => {
                    setTimeout(() => {
                        this.form.resetForm(res);  ********** RESETS FORM *******
                        this.DOB = res.dateOfBirth.toDate();
    
  • User Avatar
    0
    alper created
    Support Team

    Ok. I watched the youtube video about the problem. In the google chrome dev console the api request results with 403-Forbidden. So you cannot retrieve any data from that request, can you? I guess there's no problem with permission mechanism because it does what it promises.

    I guess, you are binding data that you use for member listing.