开启辅助访问 切换到宽版

精易论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

用微信号发送消息登录论坛

新人指南 邀请好友注册 - 我关注人的新帖 教你赚取精币 - 每日签到


求职/招聘- 论坛接单- 开发者大厅

论坛版规 总版规 - 建议/投诉 - 应聘版主 - 精华帖总集 积分说明 - 禁言标准 - 有奖举报

查看: 31806|回复: 236
收起左侧

[易源码分享] 【WebUI】最适合web开发者的易语言自绘方案

    [复制链接]
回帖奖励 470 枚 精币 回复本帖可获得 10 枚 精币奖励! 每人限 1 次(中奖概率 30 %)
结帖率:95% (35/37)
发表于 2024-9-28 20:57:28 | 显示全部楼层 |阅读模式   湖南省长沙市
分享源码
界面截图: -
是否带模块: -
备注说明: -
本帖最后由 大兔崽子 于 2024-10-6 15:42 编辑

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

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

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

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

整个程序操作起来 也是异常的流畅,而且 界面开发 可以使用 css 效果也是出类拔萃, 下面请看VCR
1727525096578[00h00m00s-00h00m18s].gif


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

VX截图_20240928203217.png


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

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

VX截图_20240928203315.png


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


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

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

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



  呐!废话一大堆,  最后来看成果吧

游客,如果您要查看本帖隐藏内容请回复



现阶段, 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-9-30 09:21
我这几天 看了另一个浏览器EdgeView,兼容性强了很多 https://bbs.125.la/forum.php?mod=viewthread&tid=14805846&highlight=edgeview   湖南省长沙市  发表于 2024-9-30 09:19
套壳cef就变得更electron一样,所以可以直接上electron (手动滑稽)   广东省揭阳市  发表于 2024-9-30 04:57
套壳cef比较好。性能更好。缺点:体积大   湖北省咸宁市  发表于 2024-9-28 21:09

评分

参与人数 37好评 +8 精币 +49 收起 理由
wzp1995 + 1 感谢分享,很给力!~
pipi9 + 1 + 2 YYDS~!
种植 + 1 感谢分享,很给力!~
3266167 + 1 感谢分享,很给力!~
guojiaobin + 1 感谢分享,很给力!~
mandxy + 1 感谢分享,很给力!~
kyo9766 + 1 + 1 感谢分享,很给力!~
风雨3137 + 1 感谢分享,很给力!~
南黎 + 1 感谢分享,很给力!~
qiyuer + 1 感谢分享,很给力!~
浮梦 + 1 感谢分享,很给力!~
jc520hll + 1 感谢分享,很给力!~
ewake + 1 感谢分享,很给力!~
Zźh926 + 1 感谢分享,很给力!~
ican8 + 1 感谢分享,很给力!~
huangdi956 + 1 感谢分享,很给力!~
坤坤大魔王 + 1 感谢分享,很给力!~
jing3 + 1 感谢分享,很给力!~
光影魔术 + 2 新技能已get√
xhping + 1 感谢分享,很给力!~
罗大大 + 1 感谢分享,很给力!~
t176 + 1 感谢分享,很给力!~
vcx + 1 感谢分享,很给力!~
sinewtec + 1 + 3 开源精神必须支持~
huangdi9569 + 1 感谢分享,很给力!~
w589321 + 1 + 2 支持开源~!感谢分享
zjbin1989 + 1 感谢分享,很给力!~
bear22 + 1 感谢分享,很给力!~
文西哥 + 1 感谢分享,很给力!~
booms + 1 感谢分享,很给力!~
望尘莫及 + 1 感谢分享,很给力!~
扶南 + 1 感谢分享,很给力!~
inat + 1 + 2 支持开源~!感谢分享
YzZA + 1 感谢分享,很给力!~
鼠标疯了 + 1 + 2 YYDS~!
阿龙 + 1 + 5
王不饿 + 1 + 2 YYDS~!

查看全部评分


本帖被以下淘专辑推荐:

结帖率:95% (35/37)

签到天数: 7 天

 楼主| 发表于 3 天前 | 显示全部楼层   湖南省长沙市
鬼炙 发表于 2024-10-6 11:54
.版本 2

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

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

333.png
回复 支持 反对

使用道具 举报

结帖率:89% (8/9)

签到天数: 2 天

发表于 昨天 18:50 | 显示全部楼层   山西省大同市

回帖奖励 +10 枚 精币


谢谢分享
回复 支持 反对

使用道具 举报

签到天数: 1 天

发表于 昨天 12:29 | 显示全部楼层   广东省广州市
谢谢分享
回复 支持 反对

使用道具 举报

结帖率:94% (16/17)

签到天数: 7 天

发表于 3 天前 | 显示全部楼层   福建省三明市
学习学习
回复 支持 反对

使用道具 举报

结帖率:58% (14/24)

签到天数: 3 天

发表于 3 天前 | 显示全部楼层   山西省大同市
大兔崽子 发表于 2024-10-6 15:41
非常感谢, 确实是可行的  不过 跟 先取出cookie 并没有太多关系  
主要还是 要把cookie的参数都填写完整 ...

回复 支持 反对

使用道具 举报

结帖率:50% (1/2)

签到天数: 5 天

发表于 3 天前 | 显示全部楼层   广东省揭阳市

回帖奖励 +10 枚 精币

学习学习
回复 支持 反对

使用道具 举报

结帖率:58% (14/24)

签到天数: 3 天

发表于 3 天前 | 显示全部楼层   山西省大同市
鬼炙 发表于 2024-10-6 11:54
.版本 2

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

我都是写全才能成功,就是那个过期时间不会写 直接读取现成的过期时间写入
回复 支持 反对

使用道具 举报

结帖率:58% (14/24)

签到天数: 3 天

发表于 3 天前 | 显示全部楼层   山西省大同市
大兔崽子 发表于 2024-10-5 18:06
我试试去....还得这样嘛

.版本 2

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


.如果真 (是否已创建 (窗口_浏览器) = 假)
    载入 (窗口_浏览器, , 假)
    浏览器配置 ()
    全局_浏览器.载入网址 (网址)
    全局_COOKIE管理器 = 全局_浏览器.取Cookie管理器 ()
    全局_元素操作.绑定 (全局_浏览器)

.如果真结束
.如果真 (cookies ≠ “”)
    全局_COOKIE管理器.取Cookies (“https://jlive.jd.com/”, COOKIE数据)

    .如果真 (取数组成员数 (精易Cookie数组) > 0)
        time = COOKIE数据 [1].过期时间

    .如果真结束
    全局_COOKIE管理器.删除Cookies (“”, “”)


    ' ’重定义数组 (EdgeViewCOOKIE数据, 假, 取数组成员数 (精易Cookie数组))

    .计次循环首 (取数组成员数 (精易Cookie数组), I)
        EdgeViewCOOKIE数据.名称 = 精易Cookie数组 [I].健
        EdgeViewCOOKIE数据.数值 = 精易Cookie数组 [I].值
        EdgeViewCOOKIE数据.过期时间 = time
        EdgeViewCOOKIE数据.域名 = “.jd.com”
        EdgeViewCOOKIE数据.路径 = “/”
        EdgeViewCOOKIE数据.相同站点 = #EdgeView_相同站点_无
        EdgeViewCOOKIE数据.是否Session = 真

        EdgeViewCOOKIE数据.是否安全 = 真
        EdgeViewCOOKIE数据.仅HTTP = 真



        全局_COOKIE管理器.置Cookie (EdgeViewCOOKIE数据)
    .计次循环尾 ()


回复 支持 反对

使用道具 举报

结帖率:0% (0/1)
发表于 3 天前 | 显示全部楼层   河北省石家庄市
牛牛牛,看着介绍很好。先下载了再说
回复 支持 反对

使用道具 举报

结帖率:0% (0/1)

签到天数: 2 天

发表于 3 天前 | 显示全部楼层   广东省汕头市
感谢大神分享~!
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则 致发广告者

发布主题 收藏帖子 返回列表

sitemap| 易语言源码| 易语言教程| 易语言论坛| 易语言模块| 手机版| 广告投放| 精易论坛
拒绝任何人以任何形式在本论坛发表与中华人民共和国法律相抵触的言论,本站内容均为会员发表,并不代表精易立场!
论坛帖子内容仅用于技术交流学习和研究的目的,严禁用于非法目的,否则造成一切后果自负!如帖子内容侵害到你的权益,请联系我们!
防范网络诈骗,远离网络犯罪 违法和不良信息举报电话0663-3422125,QQ: 793400750,邮箱:wp@125.la
Powered by Discuz! X3.4 揭阳市揭东区精易科技有限公司 ( 粤ICP备12094385号-1) 粤公网安备 44522102000125 增值电信业务经营许可证 粤B2-20192173

快速回复 返回顶部 返回列表