Blazor路由参数传递含URI的序列化数据时异常求助

问题根源 #

System.Net.WebUtility.UrlEncode 是为**表单数据（application/x-www-form-urlencoded）**设计的编码方式，它会将空格转换为+，但对URL路径/查询参数中的特殊字符处理不彻底。当JSON中包含URL这类本身带有://、/等特殊字符的内容时，序列化后再用该方法编码，会导致最终URL结构混乱，引发浏览器解析错误。

修复方案 #

改用Uri.EscapeDataString编码序列化后的JSON字符串，它专门针对URL的查询参数或路径片段设计，能正确处理所有URL保留字符：

private void OnClickHandler()
{
    var data = new List<DataModel>()
        {
            new()
            {
                Description = "This problem",
                Url = "https://stackoverflow.com/questions/73114505/set-muddrawer-width-to-100-on-mobile/",
            },
            new()
            {
                Description = "Is annoying",
                Url = "https://stackoverflow.com/questions/",
            },
        };
    var jsonString = System.Text.Json.JsonSerializer.Serialize(data);
    var encodedData = Uri.EscapeDataString(jsonString);

    Url = CHEMIN + encodedData;
}

额外优化建议 #

• 若CHEMIN是基础URL（如https://yourapp.com/share?data=），确保拼接后为标准查询参数格式，提升解析稳定性。
• 若JSON数据量较大，可能超出浏览器/服务器的URL长度限制（通常约2048字符），此时建议改用POST方式传递数据，或对JSON进行压缩（如Gzip后Base64编码）再放入URL。

内容的提问来源于stack exchange，提问作者Dylan El Bar