3D安全验证需POST跳转外部站，选ASP.NET Core还是Angular实现？

你收到Cannot POST /错误的核心原因有两个：

• Angular是单页应用，默认的开发服务器ng serve仅支持GET请求访问前端路由，第三方网关POST回调到http://localhost:4200/payment这类前端路径时，自然会被拦截报错
• 如果你把表单直接写在Angular组件模板中，Angular表单模块会默认覆盖原生表单的提交行为，导致请求没有正常跳转到外部支付网关，反而提交到了本地根路径

两种技术栈都可以实现需求，你可以根据场景选择： #

方案1：前端Angular实现（开发效率高，适合快速调试） #

不要用Angular模板写表单，直接通过原生DOM动态创建表单提交即可，步骤如下：

1. 在需要触发3D验证的组件中添加如下方法，把你拿到的PaReq、TermUrl、MD三个参数传入：

submit3DSForm(paReq: string, termUrl: string, md: string) {
  // 创建原生隐藏表单
  const form = document.createElement('form');
  form.method = 'post';
  form.action = 'https://test.sagepay.com/mpitools/accesscontroler?action=pareq';
  form.style.display = 'none';

  // 插入三个隐藏字段
  const fields = [
    {name: 'PaReq', value: paReq},
    {name: 'TermUrl', value: termUrl},
    {name: 'MD', value: md}
  ];
  fields.forEach(field => {
    const input = document.createElement('input');
    input.type = 'hidden';
    input.name = field.name;
    input.value = field.value;
    form.appendChild(input);
  })

  // 挂载到DOM提交后销毁
  document.body.appendChild(form);
  form.submit();
  document.body.removeChild(form);
}

2. 如果要前端接收回调，生产环境需要配置你的Web服务器（Nginx/IIS等）把所有对Angular路由路径的请求都重定向到index.html，兼容POST请求场景。

方案2：后端ASP.NET Core Web API实现（安全性更高，适合生产环境） #

可以避免支付参数前端泄露、被篡改的风险，步骤如下：

1. 前端先调用你的后端接口，传递支付相关的业务参数。
2. 后端调用SagePay接口拿到3D验证所需的PaReq、MD等参数，直接返回自动提交的表单HTML：

[HttpPost("get-3d-form")]
public IActionResult Get3DSecureForm([FromBody] PaymentReq req)
{
    // 此处省略调用SagePay接口获取参数的逻辑
    string paReq = "你的PaReq值";
    string md = "你的MD值";
    string termUrl = "你的后端回调地址";
    
    string formContent = $@"
    <html>
        <body>
            <form id=""pa-form"" method=""post"" action=""https://test.sagepay.com/mpitools/accesscontroler?action=pareq"">
                <input type=""hidden"" name=""PaReq"" value=""{paReq}""/>
                <input type=""hidden"" name=""TermUrl"" value=""{termUrl}""/>
                <input type=""hidden"" name=""MD"" value=""{md}""/>
            </form>
            <script>document.getElementById('pa-form').submit();</script>
        </body>
    </html>";
    return Content(formContent, "text/html");
}

3. 前端收到后端返回的HTML后直接替换当前页面内容，就会自动跳转到3D验证页。
4. 支付网关回调你的后端TermUrl地址，处理完验证逻辑后再跳转到前端的支付结果页即可。

• 测试阶段如果用localhost地址作为回调地址，SagePay可能会无法正常回调，建议用内网穿透工具映射本地端口到公网使用。
• 生产环境优先选择后端实现方案，避免敏感支付参数暴露在前端。

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