专栏首页人脸识别温故而知新C#学习系列之如何使用webform调用人脸识别接口
原创

C#学习系列之如何使用webform调用人脸识别接口

背景

在人工智能技术迅猛发展的今天,纵观整个行业的发展,人脸识别几乎是每个公司的必争之地,如果现在行业里获得快速赋能,那就来使用腾讯云的人脸识别接口赋能你的业务。在系列学习文章里,我分别介绍了如何一步一步通过控制台调用人脸识别接口,如何通过winform调用人脸识别接口,在接下来得这篇文章里,我介绍如何使用webform调用人脸识别接口,希望你能快速掌握,给你的企业赋能。webform设计的内容也比较多,我们就一步步开始吧。

C# web form应该如何去学

学习web form推荐使用如下的教程:

什么是web form?

几个最基本的概念

ASP(Active Server Pages 动态服务器页面)是一种生成动态交互性网页的强有力工具。

ASP.NET 支持三种不同的开发模式:Web Pages(Web 页面)、MVC(Model View Controller 模型-视图-控制器)、Web Forms(Web 窗体)。

Web Pages(Web 页面):最简单的 ASP.NET 模式,与 PHP 和经典 ASP 相似,内置了数据库、视频、图形、社交媒体等模板和帮助器。

MVC 将 Web 应用程序分成 3 个不同的组成部分:

  • 模型负责数据
  • 视图负责显示
  • 控制器负责输入

Web Forms(Web 窗体): 传统的 ASP.NET 事件驱动开发模式:带有服务器控件、服务器事件和服务器代码的网页。

ASP 文件是什么?

  • ASP 文件与 HTML 文件类似
  • ASP 文件可包含文本、HTML、XML 和脚本
  • ASP 文件中的脚本可在服务器上执行
  • ASP 文件的文件扩展名是 ".asp"

web form学习中的重要笔记

MVC的结构

为什么要放出这个部分的笔记呢?因为这一部分对于我们的业务侧排障非常有帮助,我们的接口就是通过Client向服务端发送request请求,然后服务端返回调用的结果。这对于阅读SDK源码是很有帮助的。

使用web form调用人脸识别接口

具体的操作步骤

在我的学习系列文章里,已经有了使用winform调用人脸识别接口的应用,接下来,在这篇文章介绍如何使用web form调用人脸识别接口的。其实也是分为两部分,一部分是UI的设计,然后是后端逻辑的设计,逻辑设计部分只需要做把数据喂给接口,接口获取数据,接口调用云端算法,获取返回结果。

新建一个空的项目

1. 直接在同一个解决方案里新建一个项目右键单击 解决方案,选择添加,选择新建项目,选择ASP.NET WEB 应用程序,然后选择下一步。

2. 命名项目名称为Web Demo,然后点击创建

选择一个空的项目类型
项目初始化界面

3. 在项目创建好之后,我们发现webform的项目不像winform项目那样直接就有一个设计的界面,而是需要我们自己手动添加一个后缀名为.aspx的文件,添加方法 如下

第一步,右键项目名称,

第二步,选择添加,

第三步,选择新建项,

第四步,找到web窗体,

第五步,设置名称为WebForm1.aspx,

第六步,单击添加。

4. 得到如下初始界面的代码,左边是webform静态页面的代码,工程目录里多了一个文件

初始界面

下面这部分代码保持默认的,我们不要乱去修改,在红色方框部分找出可视化界面即可。

5. 选择上图中红色方框中的拆分,这样又可以看到代码,又可以有可视化的界面。

6. 在界面的左侧点击工具箱,会调出工具箱,从工具箱里选择Button和TextBox

UI界面设计

在做web form这一部分,网页设计需要简单快速学习HTML,CSS,JAVASCRIPT,不知道的再回去查阅相关资料。web form 要实现我们的需求,只需要用到文本框,按钮。

设计好的界面如下

在设计界面上单击鼠标右键,选择在浏览器中查看(google chrome)(B),在浏览器中就能看到运行的界面效果。

功能代码实现

给按钮添加功能

双击按钮进入代码实现部分,把我们从腾讯云控制台拷贝过来的代码放在这里,但是还需要做修改,可以先测试拷贝过来设置好参数的代码,但是会遇到一个界面卡主的问题,在下面给出解决办法。

我们发现还有很多红线,按照我们前面的方法使用Nuget安装依赖包就可以了。

这时候,红色波浪线都消除完了。

消除波浪线之后

点击运行

webform运行结果

界面卡主问题的解决

关键的部分是解决同步调用一步的问题,由于完整的代码我还有写修改,暂时还没像上篇文章那样直接贴出来。

我们的接口的通用调用代码

DetectFaceResponse resp = client.DetectFace(req).
                    ConfigureAwait(false).GetAwaiter().GetResult();
                Console.WriteLine(AbstractModel.ToJsonString(resp));

同步异步调用的解决

新版本SDK中同时提供了异步接口和同步接口,同步接口统一在异步接口之后添加了Sync后缀

req = DetectFaceRequest.FromJsonString<DetectFaceRequest>(strParams);
                DetectFaceResponse resp = client.DetectFaceSync(req);
                //ConfigureAwait(false).GetAwaiter().GetResult();
                Console.WriteLine(AbstractModel.ToJsonString(resp));

这部分的代码,我们注释掉了 ConfigureAwait(false).GetAwaiter().GetResult(),然后在接口名称之后添加Sync,然后就可以解决页面卡主的问题,在这个地方我也是花了挺多的时间去寻找解决办法。

在GitHub的源码上有说明

其实,和在前面实现win form的时候是类似的,对于输入的base64值部分,我们输入base64值到文本框,然后设置按钮的调用,获取base64值,作为参数,就是参数部分的设置也是要注意的,多一个空格少一个空格都会出错,这一步要注意,因为同步异步的问题,界面会卡主,所以就是要解决同步调用异步的问题,只要返回结果,把结果放到文本框就可以了。

同步异步调用的参考文章:https://cloud.tencent.com/developer/article/1395819

总结

在这篇文章里,介绍web的学习,使用webform调用人脸识别人脸检测接口,如何解决调用页面卡主的问题。这是一系列的文章,我还会逐一的完善,后面我还会把我所学到的分享给大家。通过这一系列的文章,相信你也可以更好的理解控制台,winform,webform如何调用人脸识别接口,如何解决同步调用异步调用的问题。别开心太早,这才是开启你业务的第一步。C#学习内容之多,还可能会走弯路,到时候我会把我的经验毫无保留的分享给各位,希望你们不要再去走弯路,而能直接使用。在逐步学习过程中,发现了其中的不足之处,还会检查更新完善。

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

相关文章

  • C#学习系列之人脸识别控制台接口调用

    要想使用C#的人脸识别控制台,对于没有使用过的朋友,可能会遇到比较多的坑,所以我这里就先去踩了坑,趁着这段时间,把能直接运行的步骤告诉大家。

    算法发
  • 人脸识别接口使用笔记

    后付费有八个接口收费,其中人员库管理有多个子接口,仅创建人员和增加人脸收费,两个子接口的调用量合并计入人员库管理的计费。

    算法发
  • php接口创建人员失败问题

    查询错误码:https://cloud.tencent.com/document/product/867/32808

    算法发
  • 点播--获取播放统计数据文件下载地址

    https://cloud.tencent.com/document/product/266/12624

    Mr.Du
  • [IoT迷你赛]基于TencentOS tiny的SmartLight小工具

    本项目基于TencentOS tiny(腾讯物联网操作系统)构建了一款智能灯小工具产品。整个产品架构上分为硬件底层、云平台层和小程序终端层,利用...

    梦to鑫
  • 【IoT迷你赛】我来点个灯

    板子5,6年没玩了,很荣幸有机会参加这次体验,开启不一样的旅程。前几天收到了腾讯云Iot的开发版,还是比较兴奋的。

    七夜安全博客
  • Pooling layers

    版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.n...

    Steve Wang
  • 【DB笔试面试580】在Oracle中,什么是High Version Count?

    一个父游标下对应的子游标个数被称为Version Count,每个子游标对应一个执行计划。对于一个特定的游标有多少个版本(Version Count)就属于高版...

    小麦苗DBA宝典
  • 【52ABP实战教程】0.1-- Devops如何用VSTS持续集成到Github仓库!

    “ 工欲善其事,必先利其器。磨刀不误砍柴工!” 管理工具会VSTS。 代码管理会用GITHUB。 服务器会用Azure。 所有的东西都是利用现有服...

    角落的白板报
  • 一周播报|超级独角兽面试经验,速点!

    首先技术一定要过关。最基本的是在自己职责范围内没有无法解决的。其次是精通某一方面,这是你说的开发。至于架构师那块范围就大了。语言不能仅仅只会JAVA,脚本语言也...

    养码场

扫码关注云+社区

领取腾讯云代金券