tnblog
首页
视频
资源
登录

electron-vue调用 C# dll 闲谈NanUI

12257人阅读 2020/8/9 0:32 总访问:47188 评论:1 收藏:0 手机
分类: Vue

        闲谈!闲谈!闲谈!重要的事情说三遍。
        工作之余偶尔看到NanUI,根据介绍说是在winform中使用html和css,刚好想写一个客户端数据库链接工具,觉得有意思就去了解一下,对我们搞web开发的来说客户端的东西总有莫名的吸引力,毕竟同样的东西web四五千,客户端的话至少1万起步。
        先说作者林选臣,特地去gitee上看了一下,开发者就只有他一个人,感到佩服之余又觉得可悲,这么多的C#开发居然没人参与这个项目...,可惜自己技术不够,提供不了技术支持。
        下班回去大概看了下文档就开搞,首先就是写样式来说,真香,写过丢丢wcf,对客户端都惧怕了,布局等等简直要初学者的命,然后就是后端的各种线程问题,现在想想都头大。页面写完之后就开始了解如何用js去调后台的方法,跟着文档的demo去写,当调通的时候整个人都兴奋了,脑袋闪过各种想法,然后继续撸,后面的过程让我放弃使用NanUI了。
        1、返回时间,根据文档说的大概需要5秒左右接受到后端返回来的数据,UI线程会卡住,也许是我不会用,经过几个晚上的努力也没能解决这个问题。
        2、社区不活跃的问题了,使用NanUI的人很少,遇到问题度娘也没办法。
        3、文档不够详细,很多都是简单的说明,稍微一点业务需求在文档上找不到解决方案。
        4、写法非常复杂繁琐,注册js方法,简单的一个业务要比web开发多出至少两倍的代码。
        5、体积庞大,NanUI是基于cef写的,这是通病,打包后至少一百近两百M的体积。
        5、我在gitee给作者留言,然而却没收到回复,这是压死骆驼的最后一根稻草,果断放弃了。
        条条大路通罗马,我又去了解electron,发现它可以调用C#dll,瞬间又来劲了,因为自己已经习惯写vue了,而且又找到electron-vue,上手就简单多了,作为前端的三大框架之一,不管是发展前景,市场需求,都还是值得一试,看文档,看视频,还是很容易就把一个窗体跑了起来,至于什么主进程,渲染进程这些文档比我说的清楚,我也就不说了。
        期间也是遇到过不少坑,好在解决了,然后就是下载element-ui依赖了,删掉项目里无用的vue页面文件等,配置路由,总算是看到自己写的页面了,这一步解决了剩下的还是问题吗?接下来一路畅通,根据自己css,html基础,一个我想要的页面就有了,布局,色彩搭配基本上我是满意了,放张图欣赏一下

对了这里说一下有个坑,下次大家碰到就很快解决掉,那就是element table,所有element 组件都能正常使用,唯独table不行,引用没问题,写法也没问题,都要抓狂了,讲真的我是搞了有点时间最后度娘帮我解决的

把这个地方改一下就OK了,至于原因忘球了。
    现在完事具备只欠东风了,先去把自己的要的dll写好,复制过来放到static文件里,然后 yarn add electron-edge-js 
安装这个js,下面直接看代码,懒得多说了

  1. //你的页面,我这里是home.vue
  2. const { ipcRenderer: ipc } = require("electron");
  3. var path = require("path");
  4. var edge = require("electron-edge-js");
  5. let testLink = edge.func({
  6.   assemblyFile: path.join(__static, "AutoEntity.Core.dll"),//dll地址
  7.   typeName: "AutoEntity.Core.SqlServerHelper",//dll里的那个类
  8.   methodName: "TestLink",//SqlServerHelper类的TestLink方法
  9. });
  10. //electron-edge规定.net暴露给它的方法必须是Func<object,Task<object>>,返回的类型是obj,我试过返回其他的类型,结果报错,哈哈,搞不懂搞不懂
  11. public async Task<object> Add(object input)
  12. {
  13.      return await Task.Run(() =>
  14.             {
  15.                 var link = JsonConvert.DeserializeObject<LinkDto>(input.ToString());
  16.                 var conn = new SqlConnection(link.ConnectionString);
  17.                 try
  18.                 {
  19.                     conn.Open();
  20.                     if (conn.State == ConnectionState.Open)
  21.                     {
  22.                         conn.Close();
  23.                         conn.Dispose();
  24.                         return new JsonResultFormat(true"连接成功");
  25.                     }
  26.                     return new JsonResultFormat(false"连接失败");
  27.                 }
  28.                 catch (Exception ex)
  29.                 {
  30.                     conn.Close();
  31.                     return new JsonResultFormat(false, ex.Message);
  32.                 }
  33.             });
  34. }

测试链接成,链接成功,查询库,库下面的表都没问题,然后就是我抓狂的地方,TMD这些都可以,查询库同样的是执行sql,偏偏我写个SELECT * FROM [dbo].[AccountInfo]就是不行,我vs断点调试返回是正常的,dll拿出来让electron调用就不行,然后我又在vs里附加进程,electron调试dll,也是正常的,但是这边接收返回值就是有问题

晚上加班12点回来我有继续查,搞了几个晚上都解决不了,眼看什么都准备好了,偏偏这临门一脚就是不让你踩进去,好气哦。希望各位大哥有知道的评论帮我解决,谢谢。
不说了,我要冷静冷静。

评价

饰心

2020/8/18 17:54:53

NanUI这个东西的初衷就是减少后端开发人员的代码量,让后端人员不用写cs界面样式,类似网易云,原理就是在谷歌浏览器内核的壳子下面再套一个自己前端样式的壳子,其他掉接口的方法还是应该由API接口调用。样式应该在前端调好之后再打包嵌入到NanUI项目中去,避免繁琐的去点嵌入式

vs2017 对 COM 组件的调用返回了错误 HRESULT E_FAIL

vs2017添加引用报错 对 COM 组件的调用返回了错误 HRESULT E_FAIL 1.以管理员身份打开vs2017开发人员命令指示符 2...

微信开发三 使用反射根据消息类型自动调用不同方法

微信只会向我们一个地方推送消息,如果全部逻辑都写到一起,代码会非常多。所以我们可以考虑通过消息类型,来实现不同的消...

AJAX调用webapi上传图片或文件。设置token,设置Authorization Bearer

AJAX调用webapi上传图片或文件,并返回刚上传的文件名。废话不多说直接贴代码吧html相关:&lt;!DOCTYPEhtml&gt; &lt;html&...

当浏览器调用第三方设备时必须要用到PWA

说白了,调用页面要引用两个文件下面地址进行下载,默认第一个https://www.pwabuilder.com/serviceworker如想对PWA有过多了...

封装调用api接口的通用方法(抱含存调用接口日志)

protectedstaticreadonlylog4net.ILog_log=log4net.LogManager.GetLogger(System.Reflection.MethodBase.GetCurrentMethod(...

后台调用菜单接口+自定义菜单

假如有一天你喝醉了,一个人走在街头,会歇斯底里的喊出谁的名字?时光如流水般逝去,站在青春的末稍,扭过头,观望曾经走...

WebAPI调用post传值

创建core项目在项目中创建文件夹。在文件夹中创建webapi控制器,定义好路由。在页面上引入js文件。通过ajax调用api后台方法...

WebAPI调用Put传值

创建core项目在项目中创建文件夹。在文件夹中创建webapi控制器,定义好路由。在页面上引入js文件。通过ajax调用api后台方法...

WebAPI调用Delete传值

结合之前post,put方式,综上所述。首先路由传id。在方法里面定义参数在前台使用ajax传值调试进去则成功了不使用路由直接传...

.net core发布gRPC项目和远程调用

发布gRPC项目的过程和其他项目一样,右键发布即可发布出来后会看到有个.exe的程序然后直接丢到服务器双击运行即可不放到iis...

c调用百度AI通用物体和场景识别

publicclassAdvancedGeneral { //通用物体和场景识别 publicstaticAdvancedGeneralModeladvancedGeneral(stringtoken) ...

c调用百度AI银行卡识别

code:publicclassBankCard { //银行卡识别 publicstaticBankCardModelbankCard(stringtoken) { stringhost=&quot;http...

c调用百度AI手写文字识别

封装调用接口代码:publicclassBaiduAIBase64Tool { publicstaticstringInvoke(stringurl,stringimgurl) { //stringhos...

c调用百度AI新闻摘要接口

代码如下:publicclassNewsSummaryTools { publicstaticJObjectGetNewsSummary(stringtoken) { HttpClienthttpClient=n...

c调用百度AI文章标签识别

code:publicclassArticleTag { ///&lt;summary&gt; ///访问文章标签接口 ///&lt;/summary&gt; ///&lt;paramname=&quot...
世上本无事,庸人自扰之
排名
48
文章
6
粉丝
4
评论
5
vue脚手架搭建
庸人 : eslint不建议我们这样的新手安装,会严&#26684;要求测试等等
vue脚手架搭建
剑轩 : 加油加油,前后端通吃的全才
vue+element之表单验证
剑轩 : 这个还是比较方便,最近也有遇到这类问题
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:50010702506256
欢迎加群交流技术
寒夜客来茶当酒,竹炉汤沸火初红。