Angular 6与ASP.NET启用CORS遇跨域错误求助

我来帮你一步步搞定这个问题，咱们从报错根源入手：

核心问题定位 #

从你最后给出的500错误栈可以看到关键原因：

The specified policy origin 'http://localhost:4200/contact' is invalid. It must not contain a path, query, or fragment.

CORS的origin参数只允许域名+端口的格式，不能带具体路径（比如/contact），这就是导致服务器内部错误的直接原因。

第一步：修正ASP.NET API的CORS配置 #

把ContactFormsController上的EnableCors属性里的origins值改成不带路径的域名：

[EnableCors(origins: "http://localhost:4200", headers: "*", methods: "*")]
public class ContactFormsController : ApiController {
    // 你的SendEmail方法逻辑
}

另外，建议你统一CORS配置方式：要么用代码里的EnableCors属性，要么用Web.config的自定义头，不要同时混用，避免冲突。如果选择代码配置，确保WebApiConfig.Register里的config.EnableCors();已经正确启用。

第二步：优化Angular端的请求代码 #

你原来的代码里把formBody作为string传递，还要手动设置Content-Type: application/json，容易出现JSON格式错误。建议直接传递对象，Angular的HttpClient会自动帮你序列化为JSON并设置正确的请求头：

sendMail(formData: any): Promise<any> { 
    const url = "http://localhost:49561/api/SendEmail"; 
    // HttpClient默认会设置Content-Type为application/json，也可以显式设置
    const headers = new HttpHeaders().set('Content-Type', 'application/json'); 
    // 直接传入表单对象，无需手动转成string
    return this.httpClient.post(url, formData, { headers }) 
      .pipe(map(res => res))
      .toPromise(); 
}

调用这个方法时，直接传入表单对应的JavaScript对象即可，比如this.sendMail({name: 'xxx', email: 'xxx', message: 'xxx'})。

第三步：验证修复效果 #

1. 重启ASP.NET API服务，确保配置生效；
2. 在Angular应用中发起请求，此时跨域错误和500错误应该都能解决；
3. 如果还有问题，先通过Postman再次测试API，确认API本身逻辑正常（比如邮件发送功能、请求体解析是否正确）。

内容的提问来源于stack exchange，提问作者Marwan N