基于ASP.NET Core 6与Angular 13的文件下载API链接异常问题

你遇到的核心问题是代码里的条件判断错误，导致逻辑分支走偏，最终显示Angular服务器地址而非API地址。以下是具体问题分析和修复方案：

问题1：条件判断中的赋值操作错误 #

你的TS代码里的if(this.AllDemande.fileUrl=!null)是赋值语句，不是判断语句：

• =!null会把true赋值给this.AllDemande.fileUrl，然后判断这个赋值结果（永远是true）
• 如果原本fileUrl是有效的API路径，这会覆盖它；如果原本是null，会强制进入if分支生成无效链接；极端情况下可能因为逻辑异常走到else分支，显示Angular的静态资源地址（assets/pdf.png）

问题2：URL拼接可能存在的冗余 #

如果数据库返回的fileUrl已经是完整的API路径（比如https://localhost:7125/api/files/xxx.pdf），直接拼接baseUrl会生成重复的无效链接。

修复后的代码 #

1. 修正TS文件的setFile方法 #

把错误的赋值判断改成正确的非空校验：

public setFile(): void {
  // this.AllDemande.fileUrl : url link from database
  if (this.AllDemande.fileUrl != null && this.AllDemande.fileUrl.trim() !== '') {
    this.DisplayFileUrl = this.congeService.getFilePath(this.AllDemande.fileUrl);
  } else {
    this.DisplayFileUrl = 'assets/pdf.png';
  }
}

2. 优化Angular服务的getFilePath方法 #

添加完整URL判断，避免冗余拼接，同时处理路径开头的斜杠：

private baseUrl = 'https://localhost:7125/api';
getFilePath(url: string): string {
  // 先判断是否已经是完整URL
  try {
    new URL(url);
    return url;
  } catch {
    // 相对路径则拼接baseUrl，同时去掉开头的斜杠避免重复//
    return `${this.baseUrl}/${url.replace(/^\/+/, '')}`;
  }
}

验证逻辑 #

• 当this.AllDemande.fileUrl是有效的相对路径（比如files/xxx.pdf），会拼接成https://localhost:7125/api/files/xxx.pdf
• 当fileUrl已经是完整API地址，会直接使用该地址
• 当fileUrl为空或null，才会显示Angular的静态图片地址

内容的提问来源于stack exchange，提问作者salah kimi