使用ngx-image-cropper时this.sanitizer.bypassSecurityTrustResourceUrl不是函数

编程问答 2022-07-23

问题描述

我在我的angular 6应用程序中使用ngx-image-cropper@1.3.8。我想给我的裁剪器加载一个现有的图像。我正在使用裁剪机的imageBase64属性。我将imageUrl转换为base64字符串，并辅助裁剪器。本地一切正常。但是在服务器中，我遇到了bypassSecurityResourceUrl错误。而且我发现此错误是在裁纸器包装内产生的。谁能帮我吗？

这是我的代码

<image-cropper mat-card-image class="inner-cropper" [imageChangedEvent]="imageChangedEvent"
            [maintainAspectRatio]="false" [aspectRatio]="1/1" [imageQuality]="50" format="jpeg"
            *ngIf="base64string && hasPicture" [imageBase64]="base64string" (imageCroppedBase64)="imageCropped($event)"
            (imageLoaded)="imageLoaded()" (imageCroppedFile)="imageCroppedFile($event)"
            (loadImageFailed)="loadImageFailed()">
</image-cropper>

这是我对组件级别的消毒。 我在下面做... 

import { DomSanitizer} from '@angular/platform-browser';

constructor(private _sanitizer:DomSanitizer)

getBase64(imgurl) {
        const self = this;
        var xhr = new XMLHttpRequest();
        xhr.open("get",imgurl,true);
        // Essential
        xhr.responseType = "blob";
        xhr.onload = function () {
            if (this.status == 200) {
                var blob = this.response;
                console.log("blob",blob)
                let oFileReader = new FileReader();
                oFileReader.onloadend = function (e) {
                    let base64 = e.target;
                    self.base64string = self._sanitizer.bypassSecurityTrustResourceUrl((<any>base64).result);

                };
                oFileReader.readAsDataURL(blob);

            }
        }

    }

我收到此错误

错误TypeError：this.sanitizer.bypassSecurityTrustResourceUrl不是 一个功能 在t.loadBase64Image（main.70f08624b0a556d33c40.js：1） 在t.set [作为imageBase64]（main.70f08624b0a556d33c40.js：1） 在Cr（main.70f08624b0a556d33c40.js：1） 在main.70f08624b0a556d33c40.js：1 在main.70f08624b0a556d33c40.js：1 在Zr（main.70f08624b0a556d33c40.js：1） 在wa（main.70f08624b0a556d33c40.js：1） 在Object.updateDirectives（main.70f08624b0a556d33c40.js：1） 在Object.updateDirectives（main.70f08624b0a556d33c40.js：1） 在Kr（main.70f08624b0a556d33c40.js：1）

ngx-imager-cropper软件包中此行的问题

enter image description here

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

angular