以下基于海康ISC平台：
先说思路：通过接口获取人员信息（主要是获取访客接口需要的信息），填入到访时间、来访组织等来访信息后，通过接口抛到ISC平台。
海康接口开发之访客登记（一） 获取人员信息 海康接口开发之访客登记（二） 推送访客信息一、通过接口获取人员信息
API名称：查询人员列表
协议：HTTPS
HTTP Method：POST
数据类型：application/json请求path：/api/resource/v1/person/advance/personList
URL：https://IP:端口/artemis/api/resource/v1/person/advance/personList
一个员工姓名，一个用于联动获取接口回传的员工ID（后面隐藏）以及用于推送接口
2.引入库
using HttpUtil; //封装海康ISC SDK接口凭证信息以便复用 using ME1.ISCSDK; using Newtonsoft.Json; using Newtonsoft.Json.Serialization; using System; using System.Collections.Generic; using System.Web;
ISCSDK
public class ISC_Config
{
public static string appkey = "your key";
public static string secret = "your secret ";
public static string ip = "your ip";
public static int port = your 端口;
public static bool isHttps = true;
}
3.获取接口人员信息
为实现员工姓名模糊查找，方法有很多种，这里分别列举后端直接获取和Ajax。
3.1 后端获取json字符串写入前台控件 3.1.1 后端pageload这里有个点，我好像是搞清了又好像没搞清：autocomplete默认是通过label成立筛选条件的。所以要把json里面你想要筛选的字段改为label（我这里需要把personName改为label）
3.1.2 前端JS：ListJson = $.parseJSON(ListJson);
let projects = JSON.parse(JSON.stringify(ListJson).replace(/personName/g, "label"));
$(function () {
$("#MainContent_RE_Partner").autocomplete({
source: projects,
max: 1,
minLength: 0,
focus: function (event, ur) {
$("#MainContent_RE_Partner").val(ur.item.label);
return false;
},
select: function (event, ui) {
$("#MainContent_RE_Partner").val(ui.item.label);
$("#MainContent_RE_PartnerId").val(ui.item.personId);
return false;
}
}).data("ui-autocomplete")._renderItem = function (ul, item) {
return $("" ).appendTo(ul); }; }); 3.1.2 后端：
protected void Page_Load(object sender, EventArgs e)
{
HttpUtillib.SetPlatformInfo(ISC_Config.appkey, ISC_Config.secret, ISC_Config.ip, ISC_Config.port, ISC_Config.isHttps);
string body = "{"pageNo": 1,"pageSize": 1000}";
//填充Url
string uri = "/artemis/api/resource/v1/person/advance/personList";
//发起POST请求，超时时间15秒，返回响应字节数组
byte[] result = HttpUtillib.HttpPost(uri, body, 30);
if (null == result)
{
RE_Reason.Text = "执行了一次但接口未返回信息！";
}
else
{
var BackJson = Encoding.UTF8.GetString(result);
//切割json获取Json中的List
//参考https://blog.csdn.net/weixin_43942765/article/details/105964963
int IndexofA = BackJson.IndexOf("[");
int IndexofB = BackJson.IndexOf("]");
var listjson = BackJson.Substring(IndexofA, IndexofB - IndexofA + 1);
//通过JsonProperty转换，3.2 Ajax也会用到
Listjson.Text = listjson;
}
}
Json转换效果
3.2 Ajax获取json员工信息 3.2.1 前端JS
Ajax效率上要高一些，为跟上面区分，特地选了两个不同text
同时加入了缓存机制，效果见下图。
$(function () {
//缓存
var cache = {};
$("#MainContent_RE_Company").autocomplete({
max: 5,
//minLength: 2,
source: function (request, response) {
var term = request.term;
if (term in cache) {
response($.map(cache[term], function (item) {
return {
label: item.orgName + ":" + item.personName,
value: item.personId
}
}));
return;
}
$.ajax({
url: "../WebCash/PersonList.ashx",
dataType: "json",
data: {
keyword: request.term
},
success: function (data) {
cache[term] = data;
response($.map(data, function (item) {
return {
label: item.orgName + ":" + item.personName,
value: item.personId
}
}));
}
});
},
focus: function (event, ur) {
$("#MainContent_RE_Company").val(ur.item.label);
return false;
},
select: function (event, ui) {
$("#MainContent_RE_Company").val("");
$("#MainContent_RE_Name").val("");
//var strs = ui.item.label.split("-部门");
$("#MainContent_RE_Company").val(ui.item.label);
//存入员工ID
$("#MainContent_RE_Name").val(ui.item.value);
return false;
},
open: function () {
$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
},
close: function () {
$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
}
});
});
3.2.2 ashx
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
//接收前端页面的输入参数
string keyword = context.Request["keyword"];
if (keyword != null)
{
HttpUtillib.SetPlatformInfo(ISC_Config.appkey, ISC_Config.secret, ISC_Config.ip, ISC_Config.port, ISC_Config.isHttps);
string body = "{"pageNo": 1,"pageSize": 10, "personName": "" + keyword + ""}";
//填充Url
string uri = "/artemis/api/resource/v1/person/advance/personList";
//发起POST请求，超时时间15秒，返回响应字节数组
byte[] result = HttpUtillib.HttpPost(uri, body, 30);
if (null == result)
{
}
else
{
var BackJson = System.Text.Encoding.UTF8.GetString(result);
//切割json获取Json中的List
//参考网址--https://blog.csdn.net/weixin_43942765/article/details/105964963
int IndexofA = BackJson.IndexOf("[");
int IndexofB = BackJson.IndexOf("]");
var listjson = BackJson.Substring(IndexofA, IndexofB - IndexofA + 1);
context.Response.Write(listjson );
}
}
}
public bool IsReusable
{
get
{
return false;
}
}
3.2.3 最终实现效果图
可以看到数据流向：
在不刷新页面的情况下，不会重复调用接口，减轻服务器负载
参考文档：
https://www.cnblogs.com/jlcoder/p/3471664.html
https://www.w3cschool.cn/jqueryui/example-autocomplete.html
