Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/java/351.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Java 如何在Angular cli中访问项目文件夹中本地文件夹的映像_Java_Angular_Rest_Base64_Angular Cli - Fatal编程技术网

Java 如何在Angular cli中访问项目文件夹中本地文件夹的映像

Java 如何在Angular cli中访问项目文件夹中本地文件夹的映像,java,angular,rest,base64,angular-cli,Java,Angular,Rest,Base64,Angular Cli,我正试图通过base64上传图像,并已将图像上传到本地服务器上的文件夹中。但在装订好后,在有棱角的一面,无法访问这些图像。当我在Angular cli上工作时,我的组件代码是- 此代码用于从UI浏览图像后在后端发送base64字符串- base64:any; url:any; files : FileList; onSelectFile(event:any){ console.log("onSelectFile",event); this.files = event.target.fi

我正试图通过base64上传图像,并已将图像上传到本地服务器上的文件夹中。但在装订好后,在有棱角的一面,无法访问这些图像。当我在Angular cli上工作时,我的组件代码是- 此代码用于从UI浏览图像后在后端发送base64字符串-

base64:any;
url:any;
files : FileList; 
onSelectFile(event:any){
  console.log("onSelectFile",event);
  this.files = event.target.files;  
  console.log(this.files,"this.files");
  if (event.target.files && event.target.files[0]) {
    var reader = new FileReader();
    this.currentFileUpload = this.files.item(0);
    reader.readAsDataURL(event.target.files[0])
     reader.onload = (event:any) => {
      this.base64 = event.target.result;
      console.log(this.base64, this.url,"this.url......");
     }

  }
由于我在后端使用RESTfulWebService,所以我将base64字符串转换为字节数组,并将图像存储在本地文件夹中。作为回应,我得到了图片的名字。下面是响应代码-

getDataById(profileId: any) {     
    this.user.getDataById(profileId).subscribe((response: any) => {
      this.data = response;
     this.url ="/home/aartek/Desktop/images"+this.data.profileImage;
     console.log(this.url);
    })
  }
我的HTML代码是-

<img [src]="url" height="150" width="150" class="img-circle mt20 ml-20">
  • 将URL更改为“/home/aartek/Desktop/images”+
  • 确保在.angular.cli中的资产属性中列出了包含图像的文件夹,否则,该文件夹将不会包含在生成中

  • 后端的webservice应该公开这些上传资产的URL,因此客户端(在本例中,客户端是您的angular应用程序)将使用http协议(例如:)访问它。它不会以您尝试的方式工作,因为angular应用程序将无法访问它,除非(除非您在构建时将这些文件夹与文件捆绑在一起)。
    http://localhost:4200/home/aartek/Desktop/imagesMoon_merged_small.jpg 404 (Not Found)