从Angular向Spring Boot上传PDF文件遇到问题求助

问题1：Angular请求手动设置Content-Type导致解析失败 #

你的Angular UploadService中手动指定了Content-Type: multipart/form-data，这会破坏FormData自动生成的包含boundary的正确请求头，导致后端无法解析文件。

修复后的UploadService代码：

uploadFile(file: File) {
    const formData = new FormData;
    formData.append('file', file);
    // 移除手动设置的Content-Type，HttpClient会自动处理请求头
    return this.http.post<any>(this.apiUrl2 + 'upload', formData);
}

问题2：Angular组件中冗余且错误的FormData操作 #

UploadComponent的uploadFile方法里，多余创建了FormData并仅传入文件名，属于无效代码，且后续并未使用，直接删除即可；同时注意后端返回的下载地址字段是downloadURl，不是url。

修复后的UploadComponent的uploadFile方法：

uploadFile(){
    if (this.selectedFile) {
        this.dataService.uploadFile(this.selectedFile).subscribe(
            (response) => {
                console.log('File uploaded successfully!', response);
                this.pdfUrl = response.downloadURl;
            },
            (error) => {
                console.error('Error uploading file:', error);
            }
        );
    }
}

问题3：Spring Boot Service中DownloadURL未生成有效字符串 #

BankStatementService中直接将ServletUriComponentsBuilder对象赋值给实体字段，前端会收到一个复杂对象而非可访问的URL字符串，需要构建完整的下载地址。

修复后的BankStatementService代码：

@Service
public class BankStatementService{

    public BankStatement uploadFile(MultipartFile file) {
        BankStatement bankStatement = new BankStatement();
        String fileName = file.getOriginalFilename();
        String fileType = file.getContentType();
        // 构建完整的下载URL字符串（需确保后端存在对应/download接口）
        String downloadUrl = ServletUriComponentsBuilder.fromCurrentContextPath()
                .path("/download/")
                .path(fileName)
                .toUriString();
        long data = file.getSize();
        if (StringUtils.isEmpty(fileName)) {
            fileName = file.getName();
        }
        bankStatement.setFileName(fileName);
        bankStatement.setFileType(fileType);
        bankStatement.setData(data);
        bankStatement.setDownloadURl(downloadUrl);
        return bankStatement;
    }
}

额外检查项 #

• 跨域问题：若Angular与Spring Boot端口不同，需在Spring Boot控制器添加@CrossOrigin注解或配置全局跨域
• Multipart配置：Spring Boot默认自动配置MultipartResolver，若自定义配置需确保参数正确
• 文件校验：可在Angular的onSelectFile方法中打印this.selectedFile，确认文件信息正确传递

内容的提问来源于stack exchange，提问作者Nour Ben Hadj Abdallah