0

我们正在尝试在我们的网站上创建一个照片库。我们在管理端有一个上传组件，在客户端有一个照片库。我们能够将照片上传到我们的网站，并且目前将它们存储在我们网站资产的文件夹中。当我们上传一张新照片，退出管理门户，然后尝试查看图库中的照片时，新上传的照片给我们一个错误：GET https://localhost:5001/assets/PhotoGallery/DarkSide.jpg 404即使我们能够在控制台中将文件的路径显示为文本并且它是正确的路径。

如果我们停止网站运行，然后再次启动它，照片就会显示出来。我们不确定为什么会发生这种情况，但我们将不胜感激。谢谢你。

照片.component.ts

catcher: any[];
  photos: string[] = [];


  async ngOnInit() {
    await this.http.get<any[]>(this.baseUrl + 'api/imageUpload').subscribe(result => {
      this.catcher = result;
      this.setPhotos(result);
      console.log(result);
    }, error => console.error(error));
  }

  setPhotos(newArray: any[]) {
    var temp: string = ""
    newArray.forEach(path => {
      this.photos.push("..\\" + path.trim())
    });
  }

imageUploadController.cs

private IHostingEnvironment _hostingEnvironment;
        private string fPath = "";
        public imageUploadController(IHostingEnvironment hostingEnvironment)
        {
            _hostingEnvironment = hostingEnvironment;
            SetFullPath(_hostingEnvironment.ContentRootPath + "\\ClientApp\\src\\assets\\PhotoGallery");
        }

[HttpGet, DisableRequestSizeLimit]
        public List<string> GetImagePaths()
        {
            try
            {
                List<string> paths = new List<string>();
                string startRelPath = "assets";
                foreach (var path in Directory.GetFiles(fPath))
                {
                    int relPathStartIndex = path.IndexOf(startRelPath);
                    string newPath = path.Substring(relPathStartIndex);
                    Console.WriteLine(newPath);
                    paths.Add(newPath);
                }
               return paths;
            }
            catch(Exception e)
            {
                Console.WriteLine("Fail");
                return null;
            }
        }

private void SetFullPath(string path)
        {
            this.fPath = path;
        }

照片.component.html

<div *ngIf="photos?.length">
    <div *ngFor="let photo of photos">
        <img src="{{photo}}"/>
    </div>
</div>
4

1 回答 1

1

我最终通过使用 S3 存储桶解决了这个问题，我意识到一旦我将我的网站放在服务器上，我将不再能够访问文件路径来存储照片。我为解决我的问题而遵循的教程在这里：

Part 1: https://youtu.be/ynhgDYVQTEI
Part 2: https://youtu.be/hJFxhVpA9To
Part 3: https://youtu.be/eRUjPrMMhCc
于 2021-11-09T02:08:48.637 回答