新上传的照片出现 404 错误。如果我停止然后运行网站，图像加载

Question

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

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

photos.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;
        }

photos.component.html

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

Answer 1

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

Part 1: https://youtu.be/ynhgDYVQTEI
Part 2: https://youtu.be/hJFxhVpA9To
Part 3: https://youtu.be/eRUjPrMMhCc

新上传的照片出现 404 错误。如果我停止然后运行网站，图像加载

Newly uploaded photo giving 404 error. If I stop then run website, image loads

angular

typescript

http-status-code-404

photo-upload

新上传的照片出现 404 错误。如果我停止然后 运行 网站，图像加载

Newly uploaded photo giving 404 error. If I stop then run website, image loads

angular

typescript

http-status-code-404

photo-upload

新上传的照片出现 404 错误。如果我停止然后运行网站，图像加载