首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

除非刷新页面,否则NavigationManager.Uri根本不会更新。如何在Blazor Server中获得真正的当前URI?

在Blazor Server中,可以通过使用NavigationManager的Uri属性来获取当前的URI。但是,由于Blazor Server使用了SignalR来实现与服务器的通信,导致在页面上进行导航时,NavigationManager.Uri属性不会立即更新。

要获得真正的当前URI,可以使用以下方法之一:

  1. 使用NavigationManager的LocationChanged事件:订阅NavigationManager的LocationChanged事件,该事件在URI更改时触发。在事件处理程序中,可以通过NavigationManager.Uri属性获取最新的URI。
代码语言:txt
复制
@inject NavigationManager NavigationManager

@code {
    protected override void OnInitialized()
    {
        NavigationManager.LocationChanged += OnLocationChanged;
    }

    private void OnLocationChanged(object sender, LocationChangedEventArgs e)
    {
        var currentUri = NavigationManager.Uri;
        // 处理当前URI
    }

    public void Dispose()
    {
        NavigationManager.LocationChanged -= OnLocationChanged;
    }
}
  1. 使用Blazor的JSInterop功能:通过JavaScript与浏览器进行交互,获取真正的当前URI。可以创建一个JavaScript函数,通过调用window.location.href来获取当前URI,并通过Blazor的JSInterop功能在C#中调用该函数。

在wwwroot目录下创建一个名为"scripts.js"的JavaScript文件,包含以下代码:

代码语言:txt
复制
window.getCurrentUri = function () {
    return window.location.href;
};

然后,在Blazor组件中使用JSInterop调用该函数:

代码语言:txt
复制
@inject IJSRuntime JSRuntime

@code {
    private string currentUri;

    protected override async Task OnInitializedAsync()
    {
        currentUri = await JSRuntime.InvokeAsync<string>("getCurrentUri");
        // 处理当前URI
    }
}

这样就可以通过JSInterop调用JavaScript函数获取真正的当前URI。

无论使用哪种方法,都可以获得真正的当前URI,以便在Blazor Server应用程序中进行进一步处理。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

集成Ids4,实现统一授权认证

,只要有兴趣了,剩下就是勤为径; 《最终选型 Blazor.Server:又快又稳!》...从这篇文章开始,慢慢开始实战了,因为刚开始选型blazor.wasm,后来发现速度上比较慢,特别是刷新上,所以就最终选型了Blazor.Server了,速度当然没得说,和我们平时ASP.NETCore...选型了server版本以后,总感觉wasm版本不可能那么慢,然后就好好深入研究了下,通过了PWA、GZIP压缩、CDN等技术,基本能保证WASM框架首屏首次刷新在3~5s之内,之后静态加载毫秒级别,动态刷新是...2、Ids4模块配置 如果你之前开发过Ids4呢,接下来已经能看懂,如果完全不会,建议还是先把Ids4学一遍吧,除非就完全copy我代码,尽管会遇到这样那样Bug。...,具体内容不做赘述; 3、blazor项目引用 我们都知道Blazor.Server更像是一个netcore项目,那如何引用js文件呢,很简单,之前文章我也讲过,有一个统一页面,用来承载整个app

2.1K20

nginx下载防盗链-技术精短文

st=LSVzmZllg68AJaBmeK3E8Q&e=1378881984 页面不要刷新,等到5分钟后在下载一次,你会发现点击下载会跳转到403页面。...尤为注意一点是大家一定不要泄露了自己密钥,否则别人就可以盗链了,除了泄露之外最好能经常更新密钥. secure link 指令 secure_link 语法: secure_link md5_hash...[,expiration_time] 默认: none 配置段: location variables: yes 这个指令由uriMD5哈希值和过期时间组成. md5哈希必须由base64加密,过期时间为...注意事项 密钥防止泄露、以及经常更新密钥 下载服务器和php服务器时间不能相差太大,否则容易出现文件一直都是过期状态....最后 secure link以及内置到了nginx,不需要额外安装第三方模块,有下载服务器兄弟,我极力推荐你们使用它,除非你不在乎你带宽.

57820
  • Blazor学习之旅(10)多语言+本地化

    因此,为Web应用提供多语言,页面内容可以本地化,会扩展我们IT系统受众范围,提升一点用户体验。 因此,如何在Blazor实现多语言+本地化就被提上议程。...在Blazor实现本地化方式 在Blaozr实现本地化方式,其实也就是ASP.NET Core提供那些本地化工具: IStringLocalizer IStringLocalizerFactory...接下来,我就以IStringLocalizer为例,介绍如何通过它来在Blazor应用实现多语言和本地化。...在Blazor实现本地化步骤 (1)准备工作 假设我们已经有了一个Blazor应用程序,并且有一个Home.razor页面,需要支持中文(默认语言)、英语和德语。...为了让页面语言切换能够更新系统的当前Culture,我们让其通过调用API方式来实现。

    40310

    使用Blazor和SqlTableDependency进行实时HTML页面内容更新

    原文:https://blog.csdn.net/mzl87/article/details/104264781 介绍 在这个简单示例,我们将看到发生在SQL Server数据库表更改时如何更新HTML...在Blazor帮助下,从服务器到HTML页面的通知得到了极大简化,从而获得了极好抽象水平:使用Blazor——实际上——我们代码只是C#和Razor语法。 ?...使用代码 假设您有一个报告库存清单页面,并且其中任何一种价格发生变化时,都需要刷新HTML页面。...在下面的例子Blazor会负责更新HTML页面,而SqlTableDependency组件会负责在由于insert,update或delete而更改表内容时从SQL Server数据库获取通知: 我们必须使用...第一步,我们检索OnInitialized()方法所有当前股价,然后我们订阅有关表记录更改事件通知,以刷新HTML视图: @page "/" @using BlazorApp1.Models @using

    1.6K20

    利用AdvancedTimer定时刷新页面

    组件 高级计时器:包装到 Blazor 组件计时器对象,用于对已用事件执行异步操作。 AdvancedTimer元件 此组件不呈现任何 HTML 元素。它被包装到一个组件,以便于使用。...组件将允许您调用操作,框架自动释放资源等。当您需要定期更新 UI 时,例如,通过async调用 API 端点每 30 秒刷新一次仪表板,这非常有用。 注意:此技术称为“轮询”。...这不是通知客户最有效方式。如今您可以使用 更现代技术。基于“推送”通信,:SignalR 或 WebSecket 等。确保您除了“轮询”之外没有其他选择。...返回计时器内部状态。如果计时器正在运行true,否则false 可以应用任意 HTML 属性,例如:id=“load1”,但不会导致 HTLM DOM。...@using Majorsoft.Blazor.Components.Timer 下面的代码示例演示如何在 Blazor 应用中使用高级计时器组件。

    1.2K10

    Blazor.Server以正确方式 丶集成Ids4

    (一个真正以后端形式来集成认证中心方案) ❤ 本文导读 首先特别感谢张善友老师提供技术指导,源于上周我发了一篇文章 《[Mvp.Blazor] 集成Ids4,实现统一授权认证》, 我本来是想通过像...//github.com/BlazorHub/AntDesignTemplate 那今天我就快速给大家说一下,如何在Blazor服务端来设计和集成认证中心,当然里边会涉及一些基础知识点,我就不展开了,...页面是否需要加权,如果不配置,那就是很正常浏览,比如我们博客index首页,肯定不能加权,除非是后台管理系统,那就需要每个页面都加权了,配置好后,如果用户未登录,那就会立刻跳转到上边我们配置登录地址...用户数据存储cache 在上边登录时候,我们看到了,每次登录成功回调时候,都会刷新页面,也当然会执行OnGet()方法,这样,就会把当然用户信息,通过特定sid作为缓存key形式来保存到内存里...navigationManager.NavigateTo("/Login", true); return await Task.FromResult(string.Empty); } 到了这里,我们Blazor.Server

    1.5K10

    .NET 8 Release Candidate 1 (RC1)现已发布,包括许多针对ASP.NET Core重要改进!

    Blazor Web App模板更新 在.NET 8,我们一直在增加Blazor功能,以便您可以使用Blazor组件来满足您所有Web UI需求。...您现在可以根据请求静态地从服务器呈现Blazor组件,逐渐增强体验,增强导航和表单处理,流式服务器呈现更新,并根据需要添加丰富交互性,使用Blazor ServerBlazor WebAssembly...使用交互式Server组件:启用对交互式Server渲染模式支持,基于Blazor Server。 包括示例页面:如果选择此选项,项目将包括基于Bootstrap样式示例页面和布局。...()以触发页面刷新。...这将使用增强页面导航( 如果可能)来刷新页面否则,它将触发完整页面刷新

    32940

    Blazor资源大全,很棒Blazor(2)

    您将学习基础知识,包括如何使用XAML构建用户界面,如何使用MVVM和数据绑定简化开发,如何在页面之间导航,访问平台功能(地理位置),优化数据集合,并为浅色和深色主题设置应用程序主题。...在这个以演示为主演讲,Steve将展示Blazor WebAssembly/Server如何无缝嵌入其他语言(Rust或C/C++)编写库和逻辑,Blazor WebAssembly/Server...Blazor NavigationManager - 2023年2月23日 - NavigationManager 是一种服务,使开发人员能够以编程方式将用户导航到不同页面或外部 URI。...Core 更新焦点。...如果您发布了该 PWA 新版本,您可能希望进行验证,我猜测。在这种情况下,您将重新加载该 Web 浏览器上页面。然而,即使您进行硬刷新,您也可能意外地看不到新版本内容。

    77920

    .NET Core 3.0 Preview 6对ASP.NET Core和Blazor更新

    具体可以关注“汪宇杰博客”公众号,或者我“DotNetCore实战”公众号然后在历史文章里面进行查阅。而我们这篇文章将会介绍本次更新对ASP.NET Core和Blazor所做更新。... 为C#事件处理程序指定委托时,@属性值当前仍需要前缀,但我们希望在将来更新删除此要求。 在将来,我们还希望使用指令属性语法来支持事件处理程序其他功能。...要授权访问Blazor应用程序特定页面,请使用普通[authorize]属性。可以使用新@attribute指令将[authorize]属性应用于组件。。...这些Router参数仅在此版本客户端Blazor中提供支持,但在将来更新中将为服务器端Blazor启用它们。...该Grpc.Net.ClientFactory设计用于non-ASP.NET应用模型使用(工人服务)仍然使用Microsoft.Extensions.*原语不会对ASP.NET核心依赖。

    6.7K20

    有遇到布署服务器后刷新404问题吗?

    我们先还原一下场景: vue项目在本地时运行正常,但部署到服务器刷新页面,出现了404错误 先定位一下,HTTP 404 错误意味着链接指向资源不存在 问题在于为什么不存在?...为什么history模式下有问题 Vue是属于单页应用(single-page application) 而SPA是一种网络应用程序或网站模型,所有用户交互是通过动态重写当前页面,前面我们也看到了,不管我们应用有多少页面...:hash 虽然出现在 URL ,但不会被包括在 HTTP 请求,对服务端完全没有影响,因此改变 hash 不会重新加载页面 hash 模式下,仅 hash 符号之前内容会被包含在请求 website.com...JS来执行视图切换, 当我们进入到子路由时刷新页面,web容器没有相对应页面此时会出现404 所以我们只需要配置将任意页面都重定向到 index.html,把路由交由前端处理 对nginx配置文件..../ { index /data/dist/index.html; try_files $uri $uri/ /index.html; } } 修改完配置文件后记得配置更新 nginx

    8.1K31

    ASP.NET Core Blazor 初探之 Blazor WebAssembly

    Blazor WebAssembly Blazor 技术又分两种: Blazor WebAssembly Blazor Server Blazor WebAssembly 是真正SPA,页面的渲染在前端实现...而Blazor Server可以认为是前者服务端渲染版本,它使用SignalR实现了客户端实时通讯,它计算跟渲染都在服务端处理。...如果是JavaScript我们平时使用axios等库,但是Blazor可以使用C#实现HttpClient,在前端由C#发起Http请求,Cool!...比如这个Edit组件点击保存时候并没有进行真正保存操作,而是对外抛一个事件,当外部组件接受这个事件时候进行真正处理,比如是调用新增API还是更新API。...实现一个Store 修改页面显然需要显示学生当前信息。我们通过url传递过来参数只有id,那么需要一次Http请求去后台获取学生信息,这没什么问题。

    6.6K10

    全面的ASP.NET Core Blazor简介和快速入门

    浏览者 Version Apple Safari 当前版本+ Google Chrome 当前版本+ Microsoft Edge 当前版本+ Mozilla Firefox 当前版本+ +当前版本指的是浏览器最新版本...Blazor应用程序及其依赖项和.NET运行时被下载到浏览器。该应用程序直接在浏览器UI线程上执行。UI更新和事件处理在同一进程中进行。...如果你再次刷新页面,将会看到这此加载下载文件很少,而且运行时不再需要网络,这样在断网环境或没有网络离线下,仍然可以运行,再次运行时情况: 课外知识拓展 WebAssembly是什么?   ...SPA(single-page application),翻译过来就是单页应用SPA是一种网络应用程序或网站模型,它通过动态重写当前页面来与用户交互,这种方法避免了页面之间切换打断用户体验在单页应用...,所有必要代码(HTML、JavaScript和CSS)都通过单个页面的加载而检索,或者根据需要(通常是为响应用户操作)动态装载适当资源并添加到页面页面在任何时间点都不会重新加载,也不会将控制转移到其他页面举个例子来讲就是一个杯子

    1.1K20

    HTTP请求响应报文&&相关状态码&&GET_POST请求方法 总结

    除非这是一个 HEAD 请求,否则响应实体应当包含指向新 URI 超链接及简短说明。   ...除非这是一个 HEAD 请求,否则响应实体应当包含指向新 URI 超链接及简短说明。   ...新 URI 应当在响应 Location 域中返回。除非这是一个 HEAD 请求,否则响应实体应当包含指向新 URI 超链接及简短说明。   ...新临时性URI 应当在响应 Location 域中返回。除非这是一个HEAD 请求,否则响应实体应当包含指向新URI 超链接及简短说明。...除非进行修改,否则客户端不应该重复提交这个请求。   2、请求参数有误。 43 44 401 当前请求需要用户验证。

    2.3K21

    Dotnet9网站回归Blazor重构,访问速度飞快,交互也更便利了!

    其次,Razor Pages在SEO(搜索引擎优化)方面具有一定优势。由于Razor Pages将视图和处理逻辑封装在同一个页面,搜索引擎可以更容易地理解和索引页面的内容。...相比于Razor Pages和MVC,Blazor提供了一种全新开发模式,具有许多独特优势和适用场景。 首先,Blazor提供了真正前端开发体验。...传统Web开发,前端开发人员需要使用JavaScript来处理页面的交互和动态效果,而后端开发人员则负责处理业务逻辑和数据操作。这种分离开发模式可能导致开发人员之间沟通和协作问题。...服务端模式:与传统基于HTTP请求页面刷新相比,Blazor使用SignalR连接来实现实时数据更新和双向绑定,可以提供更快速和流畅用户体验。...但目前该模式Razor组件无法交互,页面还出现了重连置灰UI,索性直接用Blazor Server重构,经过几天奋战,网站前台已经用Blazor Server完全替换Razor Pages,烦人重连也解决了

    57330

    结合使用 C# 和 Blazor 进行全栈开发

    我将展示如何在 Blazor 客户端和 WebAPI 服务器应用程序之间共享验证逻辑。目前,你不仅要在服务器验证输入,还要在客户端浏览器验证输入。新式 Web 应用程序用户希望获得准实时反馈。...页面的错误消息逻辑。...Blazor 客户端使用此方法来检索当前值,并在输入框显示它,如下所示: public String GetValue(String fieldName) { var propertyInfo =...它使用反射来查找此模型字段,并更新字段值。然后,它触发 CheckRules 方法,以对相应字段验证所有规则。Blazor 客户端使用此方法,以在用户在输入文本框中键入内容同时更新值。...如果此模型值已更改或在内部错误字典添加或删除了验证规则,便会触发这个事件。Blazor 客户端侦听此事件,并在事件触发时更新 UI。

    6.7K40

    基于 Blazor 打造一款实时字幕

    故而使用 Blazor server 实现一个。 总体思路 实时字幕自然需要语音转文字功能。...使用 Blazor server 从服务端实时刷新页面到前端是非常简单事情。因此,渲染一个简单列表文本,然后通过 OBS browser 组件接入画面即可。...将内容展示在页面上 有了基本项目结构和接口,便可以尝试将内容绑定到页面上。要将实时转换内容展示到界面上需要进行一定算法转换。...live caption display 主要需要注意是,在判断是要更新当前行还是进行换行,这部分逻辑需要注意进行处理。.../pushing-ui-changes-from-blazor-server-to-browser-on-server-raised-events 可以通过以下链接来了解,如何在 UI 线程之外来出发

    1.2K00

    何在CVM上安装Nginx

    但是,测试它最佳方法是从网页上是不是安装成功了。 您可以通过IP地址来访问默认Nginx登录页面以确认软件正常运行。如果您不知道服务器IP地址,可以通过几种不同方式获得它。.../your_server_ip 您应该会看到默认Nginx登录页面: [Nginx默认页面] 此页面包含在Nginx,以向您显示服务器正在正常运行。...location / { try_files $uri $uri/ =404; } } 请注意,我们已将root配置更新到新目录和server_name.../etc/nginx/sites-available/:可以存储每站点Nginx配置目录。除非链接到目录,否则Nginx不会使用此目录配置文件sites-enabled。...服务器日志 /var/log/nginx/access.log:除非Nginx配置为执行其他操作,否则对Web服务器每个请求都将记录在此日志文件

    2.9K62

    Blazor学习之旅(1)初步了解Blazor

    单击按钮、导航以及与 Blazor Server 应用程序进行其他交互用户将通过此 SignalR 连接传输其操作,并且服务器将使用相同连接来通过用户界面更新进行响应。...Blazor Server 框架使用 Web 服务器上生成内容来自动更新浏览器。 (2)Blazor WebAssembly模式 首先,什么是WebAssembly?...微软在官方文档也给出了如何抉择何时使用BlazorBlazor 是一种非常棒用户界面框架,适用于已熟悉 .NET 并且希望获得用于设计和交付基于 HTML 应用程序各种选项开发人员。...在使用Blazor过程,可以充分感受到Blazor当前主流前端技术联系: 组件式开发范式,推荐以组件形式作为页面基本UI元素 在html模板,部分C#关键词充当了类似“指令”角色...另外,在IE及其他一些老旧版本浏览器仍未被完全淘汰的当下,为了保证页面的普适和兼容,Blazor自然不会被大部分人看重。

    84720
    领券