一、前言

上一章讲解了 Chrome浏览器如何唤起客户端应用程序，以及如何简单的传递参数，如：<a href="AngWeiRobot://?uid=250&name=438">调用客户端程序</a>

这一章讲解前端如何传递更加复杂的Json参数以及后端如何接收，比如我需要传递一个数组对象：

var tmpDevices = [{Name:'测试设备',LocalLogin_IPAddress: '172.24.0.168',LocalLogin_Port: 8000,Login_Account: 'admin',Login_Password:'1234qwer'}
];

二、前端编码传参：

<html>
<body id="myid" title="mytitle"><script type="text/javascript">function CallLocalApp() {//1、数组对象准备var tmpDevices = [{Name:'测试设备',LocalLogin_IPAddress: '172.24.0.168',LocalLogin_Port: 8000,Login_Account: 'admin',Login_Password:'1234qwer'}];//2、将对象转换为Json字符串var tmpJsonDevices = JSON.stringify(tmpDevices);//3、对Json字符串进行编码var tmpEncodeDevices = encodeURIComponent(tmpJsonDevices);//4、拼接最终浏览器调用客户端参数：var tmpRequest = "angweirobot://?devices=" + tmpEncodeDevices;//5、唤起客户端程序window.open(tmpRequest);}</script><button onclick="CallLocalApp()">唤起客户端</button>
</body>
</html>

//2、将对象转换为Json字符串
var tmpJsonDevices = JSON.stringify(tmpDevices);
.
前端控制台打印结果为：[{“Name”:“测试设备”,“LocalLogin_IPAddress”:“172.24.0.168”,“LocalLogin_Port”:8000,“Login_Account”:“admin”,“Login_Password”:“1234qwer”}]
.
后台接收到的结果为，tmpStr1："[%7b%22name%22:%22%e6%b5%8b%e8%af%95%e8%ae%be%e5%a4%87%22,%22locallogin_ipaddress%22:%22172.24.0.168%22,%22locallogin_port%22:8000,%22login_account%22:%22admin%22,%22login_password%22:%221234qwer%22%7d]"

//3、对Json字符串进行编码
var tmpEncodeDevices = encodeURIComponent(tmpJsonDevices);
.
后台接收到的结果为，tmpStr2："%5b%7b%22name%22%3a%22%e6%b5%8b%e8%af%95%e8%ae%be%e5%a4%87%22%2c%22locallogin_ipaddress%22%3a%22172.24.0.168%22%2c%22locallogin_port%22%3a8000%2c%22login_account%22%3a%22admin%22%2c%22login_password%22%3a%221234qwer%22%7d%5d"

三、后端接收参数并转码：

App.xaml.cs重写启动函数：

protected override void OnStartup(StartupEventArgs e)
{//1、调用父级base.OnStartup(e);//2、提取参数数组Dictionary<string, string> tmpKeyValues = GetRequestParameters(e.Args[0].ToLower());//3、提取编码后的Json设备参数数组对象字符串string tmpEncodeJsonDevices=tmpKeyValues["devices"];//4、解码Json字符串对象：string tmpJsonDevices= HttpUtility.UrlDecode(tmpEncodeJsonDevices);//解码后结果为正常的Json字符串：[{"Name":"测试设备","LocalLogin_IPAddress":"172.24.0.168","LocalLogin_Port":8000,"Login_Account":"admin","Login_Password":"1234qwer"}]//5、转换为对应的设备类列表List<DeviceDto> tmpDeviceLst= JsonConvert.DeserializeObject<List<DeviceDto>>(tmpStr2);//6、小心翼翼的保存起来...............
}

/// <summary>
/// 链接参数提取
/// </summary>
/// <param name="urlOrParameter"></param>
/// <returns></returns>
public static Dictionary<string, string>? GetRequestParameters(string urlOrParameter)
{//1、参数空字符串检测if (string.IsNullOrEmpty(urlOrParameter)){return null;}//2、去除参数前面的链接内容int tmpIndex = urlOrParameter.IndexOf('?');if (tmpIndex >= 0){urlOrParameter = urlOrParameter.Substring(tmpIndex + 1);}//3、以&作为分隔符进行数据拆分：key=value string[] tmpKeyValues = Regex.Split(urlOrParameter, "&");if (tmpKeyValues == null || tmpKeyValues.Length <= 0){return null;}//4、最终参数拆分Dictionary<string, string> tmpDictionary = new();for (int i = 0; i < tmpKeyValues.Length; i++){string tmpItem = tmpKeyValues[i];if (!tmpItem.Contains('=')){continue;}string[] tmpKeyValue = Regex.Split(tmpItem, "=");tmpDictionary.Add(tmpKeyValue[0], tmpKeyValue[1]);}//5、返回参数字典return tmpDictionary;
}

//设备实体类
public class DeviceDto{     public  string Name { get; set; }public  string LocalLogin_IPAddress { get; set; }public  int LocalLogin_Port { get; set; }public  string Login_Account { get; set; }public  string Login_Password { get; set; }     }

四、前端传参和后端解码注意事项：

//2、将对象转换为Json字符串
var tmpJsonDevices = JSON.stringify(tmpDevices);
.
//3、对Json字符串进行编码
var tmpEncodeDevices = encodeURIComponent(tmpJsonDevices);
.
不管是回传tmpJsonDevices 或者 tmpEncodeDevices 后端代码都可以通过HttpUtility.UrlDecode(jsonstr); 得到正确的相同的Json字符串对象

五、总结

前端编码什么的都好说，但是后端应该如何解码，用什么类或者什么方法解码，尝试了其他好几种方法都不行，匹配不上，找了好久才发现原来是这个方法：HttpUtility.UrlDecode();

【海康威视】WPF客户端二次开发：【5】Chrome浏览器调用客户端程序链接参数处理 —— 前端encodeURIComponent编码，后端UrlDecode解码相关推荐

海康威视工业相机SDK二次开发（VS+Opencv+QT+海康SDK+C++）（一）
最近在做一个项目,涉及到工业相机,需要对其进行二次开发.相机方面选择了海康威视,网上关于海康威视工业相机SDK的开发资料很少,官方文档里面虽然写的是支持C++开发的,但其实是C.自己也摸索了一段时间, ...
海康威视工业相机SDK二次开发
海康威视工业相机SDK二次开发好气,第一次写文章,结果没不小心保存关掉,什么都没了. 本人是一名在读研究生,被导师分配了做项目中海康工业相机的二次开发.实现的需求是:实现八个相机同时打开视频,并且分 ...
Visual Studio 2019 STK11.6 C#（WPF）二次开发
Visual Studio 2019 STK11.6 C#(WPF)二次开发概述环境软件效果工程创建添加引用文件主要代码 1.创建场景 2.创建飞机 3.创建站点 4.创建传感器 5.创建 ...
海康威视摄像机SDK二次开发--提取音频保存至文件
由于最近在开发海康威视摄像头,特此记录一下如何提取音频数据,这里主要依靠语音对讲返回的音频数据,通过回调函数写入文件中,加个WAV头即可播放,编码格式可以自己设置在代码中有注释文件结构其中Came ...
海康威视摄像机SDK二次开发--指定云台位置,焦距放大倍数,拍摄时长,并拆分保存为视频文件
按照config.txt配置,出现的效果是有几组参数就录制几个视频,视频时长按照配置文件录制 config.txt的内容,请参照海康威视摄像机SDK二次开发–实时预览视频流保存到指定文件中 java实 ...
Python基于周立功盒子的二次开发的封装和调用
Python基于周立功盒子的二次开发的封装和调用一.介绍前面我们介绍如何拿到官网给的例程并使用起来,但在使用的过程中,我们发现官网给的例子非常的冗长,可读性不好,于是我进行分解和封装,使得 ...
UG NX二次开发(C#)-CAM-加工模板、程序、方法、刀具和几何体的读取
1.前言在UG NX的CAM模块中,加工程序是根据UG NX设置的加工模板来编程的,本人是针对CAM模块的UG NX二次开发,获取加工模板.程序名称.加工方法.刀具和几何体的字符串. 2.进入加工模 ...
【Electron】酷家乐客户端开发实践分享 — 浏览器启动客户端
作者:钟离,酷家乐PC客户端负责人原文地址:webfe.kujiale.com/browser-to-- 酷家乐客户端:下载地址 www.kujiale.com/activity/13- 文章背景: ...
NX CAM二次开发 UFUN获得/设置(刀具/几何体/方法/操作)参数
NX CAM二次开发 UFUN获得/设置(刀具/几何体/方法/操作)参数 #include <uf_param.h> #include <uf_param_indices.h> ...
20221126给Chrome浏览器安装扩展程序——猫抓
20221126给Chrome浏览器安装扩展程序--猫抓 2022/11/26 21:43 百度:chrome 猫爪 https://www.onlinedown.net/soft/1232149.h ...

【海康威视】WPF客户端二次开发：【5】Chrome浏览器调用客户端程序链接参数处理 —— 前端encodeURIComponent编码，后端UrlDecode解码

文章目录

一、前言

二、前端编码传参：

三、后端接收参数并转码：

四、前端传参和后端解码注意事项：

五、总结

【海康威视】WPF客户端二次开发：【5】Chrome浏览器调用客户端程序链接参数处理 —— 前端encodeURIComponent编码，后端UrlDecode解码相关推荐

最新文章

热门文章

【海康威视】WPF客户端二次开发：【5】Chrome浏览器调用客户端程序 链接参数处理 —— 前端encodeURIComponent编码，后端UrlDecode解码

文章目录

一、前言

二、前端编码传参：

三、后端接收参数并转码：

四、前端传参和后端解码注意事项：

五、总结

【海康威视】WPF客户端二次开发：【5】Chrome浏览器调用客户端程序 链接参数处理 —— 前端encodeURIComponent编码，后端UrlDecode解码相关推荐

最新文章

热门文章

【海康威视】WPF客户端二次开发：【5】Chrome浏览器调用客户端程序链接参数处理 —— 前端encodeURIComponent编码，后端UrlDecode解码

【海康威视】WPF客户端二次开发：【5】Chrome浏览器调用客户端程序链接参数处理 —— 前端encodeURIComponent编码，后端UrlDecode解码相关推荐