await方法内window.location.href无法跳转至外部URL问题

问题根源 #

1. 按钮点击触发了默认提交行为（比如按钮处于表单内），导致页面刷新，打断了跳转逻辑
2. 异步代码混用await和.then()，写法冗余且可能引发时序问题
3. 若bFunc()返回的URL缺少完整协议前缀（如https://），会被当作相对路径处理，导致当前页面刷新

修复步骤 #

1. 阻止按钮默认行为 #

在点击回调里添加e.preventDefault()，避免页面刷新覆盖跳转逻辑：

<Button onClick={async (e) => {
  e.preventDefault();
  await redirect();
}}></Button>

2. 简化异步代码逻辑 #

去掉冗余的.then()嵌套，改用纯await写法，让逻辑更清晰且减少时序风险：

const redirect = async () => {
  await aFunc();
  const externalUrl = await bFunc();
  window.location.href = externalUrl;
};

3. 验证URL格式 #

确认bFunc()返回的是完整的外部URL，例如https://example.com，而非相对路径/example。

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