【WebUI】最适合web开发者的易语言自绘方案

大兔崽子

老规矩 先贴来源，感谢大佬的源码奉献  

未闻花名webUI 验证页面 miniblink
https://bbs.125.la/forum.php?mod=viewthread&tid=14768919
(出处: 精易论坛)


书接上回，未闻花名 的这个WebUI 的交互写法很不方便。易语言 这边要想控制界面的变化。 会需要写非常多的  原生JS ，
众所周知，原生JS 又臭又长。所以 开发起来效率非常的不友好

于是乎，我在这个版本的基础上，进行了些许改进，  将易语言这边 作为程序的后端，只用来做 逻辑的处理
vue 这边 则专注于 前端的界面的开发，  这样 就实现了 前后的分离的开发模式

整个程序操作起来 也是异常的流畅，而且 界面开发 可以使用 css 效果也是出类拔萃， 下面请看VCR



代码方面，我将 webUI视图的载入  和  HP 服务器的功能  均分包塞进了  一个程序集里面去，  大多数的情况下
这俩个程序集 我们都不需要 有太多的修改了
业务部分的功能    只需要单独去操作  接口业务程序集即可




这儿程序集里面的 每个方法 就相当于是  提供给前端调用的 接口了，
接口方法  需要接收一个文本型参数，  以及 返回 json 格式的 文本型数据
接收的文本型参数  则是接口传递过来的参数  参数例如：  name=123&pwd=123   或者  {"name":"123","pwd":"123"}

接口方法 书写完毕后，  还需要在  业务路由绑定  方法中  ，将接口方法 给添加进路由中，暴露给服务器访问。
路由中可以设置 请求类型，以及 接口是否需要鉴权   如果是需要鉴权的情况下，  
在调用接口方法之前，  程序会先调用一下  登录权限认证   认证会比对登录时候的生成的token  如果不相等 则返回 401  
通知前端去前往登录页面




大体上介绍就是这样啦。   易语言这边  就只需要 专心关注  业务逻辑  而不需要 关心  界面的呈现
vue 这边 也可以做到跟类似其它语言做配合一样的交互开发


========================以上是优点=====================================
========================以下是缺点=====================================

似乎是  miniblink  模块的兼容性问题。   在vue 的实际开发途中，  我就发现  无法使用 axios 包 ，以及  element-plus  无法全量导入，
（在浏览器上访问 是正常的，用易语言启动的时候  就显示不正常，窗口无法显示出来，似乎有报错，但是 我没有找到这个模块的 输出报错的功能，这对开发相当的不友好）

不过  无法使用axios  也不是什么大问题。   已经使用 fetch  进行替代了，但是 不能使用 element-ui  等 这些 常见的 ui 框架的话，  就意味着页面都要手搓样式了。
这还是有点小小的遗憾  （现在用的UI框架是 vant  常用于移动端的开发）



  呐！废话一大堆，  最后来看成果吧

https://gitee.com/tubaibai/easy-language-web-ui.git


现阶段， vue 与易语言的 直接交互  就只有 窗口 顶部的那几个  控制按钮了， （最大，最小化，关闭）  所以 如果  miniblink 的兼容性如果是真的不行的话，
那只需要替换  这部分的 web浏览器载体即可，这个就有待有缘人来尝试了。

2024-9-30更新  
对兼容性有要求的童鞋  可以试试这个浏览器

【更新开源】EdgeView模块 易语言WebView2浏览框
https://bbs.125.la/forum.php?mod=viewthread&tid=14805846
(出处: 精易论坛)


我昨晚上 简单的测试了一下，   用了 axios 模块的 vue 项目 是可以正常打开的。  兼容和稳定性看起来强了不少。
只需要将 本项目里面的  hp服务器部分的代码  搬迁过去 即可实现  前后端分离交互了~~  
这就是  把某个功能性代码  塞进一个程序集的好处啦
2024-10-5 更新
如果有cookie 置入操作的话，  EdgeView 浏览器框架要慎用， 起码 我是没有用它成功置入cookie的
置入完全无效果
2024-10-6 更新
EdgeView 浏览器框架  也可以置入cookie
只是他需要将 要置入的cookie 的参数 都正确的填写完整。  
代码可以参考楼下我置顶的代码

大兔崽子

鬼炙 发表于 2024-10-6 11:54
.版本 2

Cookie操作.Cookie解析 (cookies, 精易Cookie数组, )

非常感谢， 确实是可行的  不过 跟 先取出cookie 并没有太多关系  
主要还是 要把cookie的参数都填写完整
我后面把代码 这样调整后 ， 就可以成功置入cookie了

borea

感谢分享，很给力！~

A1652302901

jiang910615

学习学习

angelaleeahngi

感谢分享，很给力！~

yiwai2012

最适合web开发者的易语言自绘方案

zhanfengshare

美美哉

huozhi

看起来很漂亮q

huozhi

看起来很漂亮

huozhi

看起来很漂亮

515667395

不错，看起来很漂亮