Blazor Server在iOS Safari中无法新标签页打开链接的解决方案求助

iOS Safari对非用户直接同步交互触发的新标签页请求有严格拦截机制，你之前的方法失效是因为异步操作（比如Blazor Server的跨网络JS调用）脱离了用户点击的同步上下文，被判定为非主动操作。以下是可行的解决方法：

方法1：直接使用原生<a>标签（优先推荐） #

如果不需要提前执行复杂逻辑，直接用Blazor绑定<a>标签，这是最安全且兼容所有浏览器的方式：

<a href="@action.ActionData" target="_blank" rel="noopener noreferrer">打开链接</a>

rel="noopener noreferrer"是安全最佳实践，避免新标签页对原页面的潜在影响。

方法2：提前预加载URL，在用户同步点击时触发 #

如果需要先执行异步逻辑获取URL，提前在组件初始化或更早的时机完成异步操作，将URL存储在变量中，然后在用户点击的同步方法中触发打开操作：

<button @onclick="OpenPreloadedUrl">打开新标签</button>

@code {
    private string _targetUrl;
    [Inject] private IJSRuntime JSRuntime { get; set; }

    protected override async Task OnInitializedAsync()
    {
        // 提前异步获取目标URL，比如调用后端接口
        _targetUrl = await FetchTargetUrlAsync();
    }

    // 同步方法处理点击，确保在用户交互的同步上下文内触发
    private void OpenPreloadedUrl()
    {
        // 调用原生open方法
        _ = JSRuntime.InvokeVoidAsync("open", _targetUrl, "_blank");
        // 或使用你定义的NavigateTo方法
        // _ = JSRuntime.InvokeVoidAsync("NavigateTo", _targetUrl);
    }

    private async Task<string> FetchTargetUrlAsync()
    {
        // 模拟异步获取URL的逻辑
        await Task.Delay(100);
        return action.ActionData;
    }
}

这里不需要awaitJS调用，因为我们只需要触发打开操作，不需要等待其完成，关键是确保调用发生在用户点击的同步上下文里。

方法3：拆分异步逻辑与打开操作 #

如果必须在异步操作完成后打开新标签，可以拆分两步：

1. 用户点击按钮触发异步任务（比如提交表单、获取数据）
2. 异步任务完成后，显示一个"打开链接"的按钮，让用户再次主动点击打开新标签页
   这种方式完全符合iOS Safari的交互要求，不会被拦截。

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