AWTK-WEB快速入门(3)-C语言Http应用程序

原创 ZLG致远电子 2025-01-15 11:35

导读

XMLHttpRequest改变了Web应用与服务器交换数据的方式,fetch是XMLHttpRequest继任者,具有更简洁的语法。本文介绍一下如何使用C语言开发AWTK-WEB应用程序,并用fetch访问远程数据。


用 AWTK Designer 新建一个应用程序

先安装 AWTK Designer:

https://awtk.zlg.cn/web/index.html

1. 新建应用程序

这里假设应用程序的名称为 AwtkApplicationCHttp,后面会用到,如果使用其它名称,后面要做相应修改。

2. 编写代码

2.1 用VSCode打开目录AwtkApplicationCHttp,并打开文件src/pages/home_page.c。

使用其它文本编辑器或 IDE 也可以,推荐使用 VSCode,并开启 Copilot,将大幅提升开发效率。

2.2 添加事件处理函数。可以参考下面的代码:

// C 函数,用于处理接收到的数据void home_page_on_fetch_data(void* ctx, const char* data, uint32_t data_size) {  widget_t* win = WIDGET(ctx);
conf_doc_t* doc = conf_doc_load_json(data, data_size); if (doc != NULL) { const char* city = conf_doc_get_str(doc, "cityInfo.city", "unknown"); const char* shidu = conf_doc_get_str(doc, "data.shidu", "unknown"); const char* wendu = conf_doc_get_str(doc, "data.wendu", "unknown"); const char* quality = conf_doc_get_str(doc, "data.quality", "unknown"); const char* ganmao = conf_doc_get_str(doc, "data.ganmao", "unknown"); double pm25 = conf_doc_get_float(doc, "data.pm25", 0);
widget_set_child_text_utf8(win, "city", city); widget_set_child_text_utf8(win, "shidu", shidu); widget_set_child_text_utf8(win, "wendu", wendu); widget_set_child_text_utf8(win, "quality", quality); widget_set_child_text_utf8(win, "ganmao", ganmao); widget_set_child_text_with_double(win, "pm25", "%.0f", pm25);
conf_doc_destroy(doc); }
printf("Received data (%d bytes): %s\n", data_size, data);}
// C 函数,用于处理错误void home_page_on_fetch_error(void* ctx, const char* error_message) { printf("Error: %s\n", error_message);}
static ret_t on_update(void* ctx, event_t* e) { widget_t* win = WIDGET(ctx); const char* url = "http://localhost:8080/AwtkApplicationCHttp/res/assets/default/raw/data/weather.json"; return_value_if_fail(win != NULL, RET_BAD_PARAMS);
fetch_data(win, "GET", url, home_page_on_fetch_data, home_page_on_fetch_error, NULL);
return RET_OK;}
/** * 初始化窗口 */ret_t home_page_init(widget_t* win, void* ctx) { (void)ctx; return_value_if_fail(win != NULL, RET_BAD_PARAMS);
widget_child_on(win, "update", EVT_CLICK, on_update, win);
return RET_OK;}

注意:控件的名称一定要和 home_page.xml 保持一致。

3. 在 AWTK Designer 中,执行“打包” “编译” “模拟运行”

正常情况下可以看到如下界面:
点击“关闭”按钮,退出应用程序。

编写配置文件

具体格式请参考,特殊平台编译配置:

https://github.com/zlgopen/awtk/blob/master/docs/build_config.md

这里给出一个例子,可以在此基础上进行修改,该文件位于:

examples/AwtkApplicationCHttp/build.json
{  "name": "AwtkApplicationCHttp",  "version": "1.0",  "assets": "res/assets",  "vendor": "zlgopen",  "app_name": "org.zlgopen.AwtkApplicationCHttp",  "copyright": "Guangzhou ZHIYUAN Electronics Co.,Ltd.",  "themes":["default"],  "sources": [     "src/*.c",     "src/common/*.c",     "src/pages/*.c",     "src/*.h",     "src/common/*.h",     "src/pages/*.h"  ],  "web": {    "app_type": "c",    "assets": "design",    "config": {      "fontScale": "0.8",      "defaultFont": "sans"    }  }


编译 WEB 应用程序

进入 awtk-web 目录,不同平台使用不同的脚本编译:
  • Windows 平台
./build_win32.sh examples/AwtkApplicationCHttp/build.json release
  • Linux 平台
./build_linux.sh examples/AwtkApplicationCHttp/build.json release
  • MacOS 平台
./build_mac.sh examples/AwtkApplicationCHttp/build.json release

请根据应用程序所在目录,修改配置文件的路径。


运行

1. 正常启动
./start_web.sh
2. 调试启动
start_web_debug.sh

3. 用浏览器打开 URL:http://localhost:8080/AwtkApplicationCHttp

点击 “更新” 按钮,可以看到数据更新。


图像显示应用芯片ZMP110X

  • 硬件高集成化

  • 丰富的多媒体特性

  • 广泛的应用场景

参考价格:45元起

长按购买



评论
  • RGB灯光无法同步?细致的动态光效设定反而成为产品客诉来源!随着科技的进步和消费者需求变化,电脑接口设备单一功能性已无法满足市场需求,因此在产品上增加「动态光效」的形式便应运而生,藉此吸引消费者目光。这种RGB灯光效果,不仅能增强电脑周边产品的视觉吸引力,还能为用户提供个性化的体验,展现独特自我风格。如今,笔记本电脑、键盘、鼠标、鼠标垫、耳机、显示器等多种电脑接口设备多数已配备动态光效。这些设备的灯光效果会随着音乐节奏、游戏情节或使用者的设置而变化。想象一个画面,当一名游戏玩家,按下电源开关,整
    百佳泰测试实验室 2025-02-27 14:15 113浏览
  • 更多生命体征指标风靡的背后都只有一个原因:更多人将健康排在人生第一顺位!“AGEs,也就是晚期糖基化终末产物,英文名Advanced Glycation End-products,是存在于我们体内的一种代谢产物” 艾迈斯欧司朗亚太区健康监测高级市场经理王亚琴说道,“相信业内的朋友都会有关注,最近该指标的热度很高,它可以用来评估人的生活方式是否健康。”据悉,AGEs是可穿戴健康监测领域的一个“萌新”指标,近来备受关注。如果站在学术角度来理解它,那么AGEs是在非酶促条件下,蛋白质、氨基酸
    艾迈斯欧司朗 2025-02-27 14:50 257浏览
  • 文/郭楚妤编辑/cc孙聪颖‍开年的跨境电商行业像是贸易战疾风暴雨下的漩涡中心。不管是关税政策的频繁调整,还是国际贸易规则的大幅变动,都让企业体会到不可承受之重,后者的命运被特朗普政府攥在手心。2 月 1 日,美国政府宣布以芬太尼等问题为由,对所有中国输美商品加征 10% 关税。紧接着,美国 “最低限度” 关税豁免政策也出现反复。从取消该豁免到恢复豁免,中间仅间隔一周的时间。两项政策的调整,直接冲击了依赖直邮模式的跨境电商行业,行业面临成本飙升与模式转型的双重压力。特朗普低估关税豁免政策的冲击力在
    华尔街科技眼 2025-02-26 17:37 123浏览
  • Matter 协议,原名 CHIP(Connected Home over IP),是由苹果、谷歌、亚马逊和三星等科技巨头联合ZigBee联盟(现连接标准联盟CSA)共同推出的一套基于IP协议的智能家居连接标准,旨在打破智能家居设备之间的 “语言障碍”,实现真正的互联互通。然而,目标与现实之间总有落差,前期阶段的Matter 协议由于设备支持类型有限、设备生态协同滞后以及设备通信协议割裂等原因,并未能彻底消除智能家居中的“设备孤岛”现象,但随着2025年的到来,这些现象都将得到完美的解决。近期,
    华普微HOPERF 2025-02-27 10:32 119浏览
  • 应用趋势与客户需求,AI PC的未来展望随着人工智能(AI)技术的日益成熟,AI PC(人工智能个人电脑)逐渐成为消费者和企业工作中的重要工具。这类产品集成了最新的AI处理器,如NPU、CPU和GPU,并具备许多智能化功能,为用户带来更高效且直观的操作体验。AI PC的目标是提升工作和日常生活的效率,通过深度学习与自然语言处理等技术,实现更流畅的多任务处理、实时翻译、语音助手、图像生成等功能,满足现代用户对生产力和娱乐的双重需求。随着各行各业对数字转型需求的增长,AI PC也开始在各个领域中显示
    百佳泰测试实验室 2025-02-27 14:08 170浏览
  • 请移步 gitee 仓库 https://gitee.com/Newcapec_cn/LiteOS-M_V5.0.2-Release_STM32F103_CubeMX/blob/main/Docs/%E5%9F%BA%E4%BA%8ESTM32F103RCT6%E7%A7%BB%E6%A4%8DLiteOS-M-V5.0.2-Release.md基于STM32F103RCT6移植LiteOS-M-V5.0.2-Release下载源码kernel_liteos_m: OpenHarmon
    逮到一只程序猿 2025-02-27 08:56 171浏览
  • 美国加州CEC能效跟DOE能效有什么区别?CEC/DOE是什么关系?美国加州CEC能效跟DOE能效有什么区别?CEC/DOE是什么关系?‌美国加州CEC能效认证与美国DOE能效认证在多个方面存在显著差异‌。认证范围和适用地区‌CEC能效认证‌:仅适用于在加利福尼亚州销售的电器产品。CEC认证的范围包括制冷设备、房间空调、中央空调、便携式空调、加热器、热水器、游泳池加热器、卫浴配件、光源、应急灯具、交通信号模块、灯具、洗碗机、洗衣机、干衣机、烹饪器具、电机和压缩机、变压器、外置电源、消费类电子设备
    张工nx808593 2025-02-27 18:04 27浏览
  • 构建巨量的驾驶场景时,测试ADAS和AD系统面临着巨大挑战,如传统的实验设计(Design of Experiments, DoE)方法难以有效覆盖识别驾驶边缘场景案例,但这些边缘案例恰恰是进一步提升自动驾驶系统性能的关键。一、传统解决方案:静态DoE标准的DoE方案旨在系统性地探索场景的参数空间,从而确保能够实现完全的测试覆盖范围。但在边缘案例,比如暴露在潜在安全风险的场景或是ADAS系统性能极限场景时,DoE方案通常会失效,让我们看一些常见的DoE方案:1、网格搜索法(Grid)实现原理:将
    康谋 2025-02-27 10:00 141浏览
  • 本文介绍Linux系统主板/开发板(适用Debian10/11、lubuntu系统),安装中文环境和中文输入法。触觉智能EVB3588开发板演示,搭载了瑞芯微RK3588芯片,八核处理器,6T高算力NPU;音视频接口、通信接口等各类接口一应俱全,可帮助企业提高产品开发效率,缩短上市时间,降低成本和设计风险。配置中文环境命令如下:sudo apt-get install locales #安装locales软件包 sudo dpkg-reconfigure locales #配置 locales
    Industio_触觉智能 2025-02-26 18:43 110浏览
  • 近年来,在能源转型的战略驱动下,我国新能源汽车的保有量持续攀升,并直接推动了充电桩市场的快速增长。据中国充电联盟(EVCIPA)统计数据显示,2024全年,我国充电基础设施增量为422.2万台,新能源汽车国内销量1158.2万辆,充电基础设施与新能源汽车继续保持快速增长,桩车增量比约为1:2.7[1]。此外,截至2024年底,我国充电基础设施累计数量为1281.8万台,同比上升49.1%[1],市场前景一片繁荣。然而,随着国际贸易壁垒高企与国内内卷态势加剧,在此繁荣的市场中,充电桩厂商们亦面临着
    华普微HOPERF 2025-02-26 16:26 139浏览
  • 2025年2月26日,广州】全球领先的AIoT服务商机智云正式发布“Gokit5 AI智能体开发板”,该产品作为行业首个全栈式AIoT开发中枢,深度融合火山引擎云原生架构、豆包多模态大模型、扣子智能体平台和机智云Aiot开发平台,首次实现智能体开发全流程工业化生产模式。通过「扣子+机智云」双引擎协同架构与API开放生态,开发者仅需半天即可完成智能体开发、测试、发布到硬件应用的全流程,标志着智能体开发进入分钟级响应时代。一、开发框架零代码部署,构建高效开发生态Gokit5 AI智能体开发板采用 “
    机智云物联网 2025-02-26 19:01 112浏览
  • 本文介绍瑞芯微RK3588主板/开发板Linux系统(Ubuntu20.04/22.04),安装中文环境和中文输入法。触觉智能EVB3588开发板演示,搭载了瑞芯微RK3588芯片,八核处理器,6T高算力NPU;音视频接口、通信接口等各类接口一应俱全,可帮助企业提高产品开发效率,缩短上市时间,降低成本和设计风险。配置中文环境配置前需更新安装列表,否则安装中文时容易遇到报错,命令如下:sudo apt-get update报错示例:1、先点击settings2、点击Manage Installed
    Industio_触觉智能 2025-02-26 18:30 76浏览
  • 国内首款电力级全域操作系统,由南方电网联合开放原子开源基金会重磅发布。基于开源鸿蒙OpenHarmony深度定制,构建起覆盖发、输、变、配、用,全环节的智能神经中枢。通过统一架构打破设备孤岛,实现百万级电力终端毫秒级响应,让每个电力设备都拥有自主思考能力,共同构建数字孪生体。作为鸿蒙生态核心硬件方案商,深圳触觉智能基于瑞芯微RK3568/全志T527,推出了专为电鸿OS及配套生态的核心板、工控主板等硬件解决方案,已完成电鸿系统适配!RK3568核心板:RK3568工控主板:T527核心板:T52
    Industio_触觉智能 2025-02-26 18:14 118浏览
  • 文/郭楚妤编辑/cc孙聪颖‍开年的跨境电商行业像是贸易战疾风暴雨下的漩涡中心。不管是关税政策的频繁调整,还是国际贸易规则的大幅变动,都让企业体会到不可承受之重,后者的命运被特朗普政府攥在手心。2 月 1 日,美国政府宣布以芬太尼等问题为由,对所有中国输美商品加征 10% 关税。紧接着,美国 “最低限度” 关税豁免政策也出现反复。从取消该豁免到恢复豁免,中间仅间隔一周的时间。两项政策的调整,直接冲击了依赖直邮模式的跨境电商行业,行业面临成本飙升与模式转型的双重压力。特朗普低估关税豁免政策的冲击力在
    华尔街科技眼 2025-02-26 17:45 135浏览
  • 触觉智能分享,瑞芯微RK安卓Android主板GPIO按键配置方法,方便大家更好利用空闲IO!由触觉智能Purple Pi OH鸿蒙开发板演示,搭载了瑞芯微RK3566四核处理器,树莓派卡片电脑设计,支持安卓Android、开源鸿蒙OpenHarmony、Linux多系统,适合嵌入式开发入门学习。设备树修改空闲IO选择由下图可得当前IO是主板上一个没有用到的IO,对应的GPIO为:GPIO4_A4。设备树配置在Purple Pi OH官方代码中,设备树:ido-pi-oh3566-core.dt
    Industio_触觉智能 2025-02-26 18:24 56浏览
我要评论
0
点击右上角,分享到朋友圈 我知道啦
请使用浏览器分享功能 我知道啦