Vaadin 23中Anchor组件更新URL但未触发导航问题排查

在Vaadin 23.1.0应用的LoginView视图中，添加用于跳转至Microsoft Azure登录地址的Anchor组件，实现代码如下：

add(new Anchor("/oauth2/authorization/azure", "Login with MS Azure AD"));

点击该锚点/链接时，Firefox 101.0.1、Chromium 103浏览器的地址栏会更新为http://localhost:8080/oauth2/authorization/azure，但浏览器不会执行实际的页面导航操作。

• 点击该锚点后按下F5刷新页面即可正常访问，确认目标URL可正常连通，该方式为当前使用的临时规避方案
• 将Anchor组件的href属性修改为外部地址（例如https://google.com）时，可正常触发页面跳转

点击锚点时，浏览器会向Vaadin服务端发送如下请求：

{"csrfToken":"10c44508-3e55-455c-b4b1-86b7d2390f44","rpc":[{"type":"publishedEventHandler","node":1,"templateEventMethodName":"connectClient","templateEventMethodArgs":["flow-container-root-2521314","ROOT-2521314","oauth2/authorization/azure","",null],"promise":4}],"syncId":4,"clientId":4}

对应收到的服务端响应如下：

for(;;);[{"syncId":5,"clientId":5,"execute":[["Systemanmeldung","document.title = $0"],["Systemanmeldung","document.title = $0"],[false,[0,3],"return (function() { this.serverConnected($0)}).apply($1)"],[4,null,[0,1],"return (function() { this.$server['}p']($0, true, $1)}).apply($2)"]]}]

根因是Vaadin默认拦截同域下的相对路径链接点击事件，将其作为内部前端路由跳转处理，不会触发浏览器原生整页导航。/oauth2/authorization/azure是Spring Security的OAuth2授权端点，不属于Vaadin内部路由，因此会出现地址栏更新但页面不跳转的问题。
给Anchor组件添加router-ignore属性，让Vaadin跳过对该链接的路由拦截，使用浏览器原生跳转逻辑即可，修改后的代码如下：

Anchor azureLoginAnchor = new Anchor("/oauth2/authorization/azure", "Login with MS Azure AD");
azureLoginAnchor.getElement().setAttribute("router-ignore", true);
add(azureLoginAnchor);

所有需要跳转到非Vaadin路由的同域链接，都可以通过添加该属性实现正常跳转。

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