分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

kbmmw 与extjs 通过JSON Base64 显示图片

发布时间:2023-09-06 01:21责任编辑:沈小雨关键词:js

delphi 官网上开始也来越多的介绍delphi与extjs 结合的例子,今天我就把官方的例子翻版一下。

官方使用C++builder 和webbroker 实现。

我使用kbmmw 来实现一下。

老规矩,先要实现服务器端,这个服务器端也很简单,就是把一个图片文件转换成base64,然后封装成json 输出到浏览器上。

直接代码:

function Twebsrv.getimg: string;var ?mybase64:TBase64Encoding; ?myfs:Tfilestream; ?myss:Tstringstream;begin ???mybase64:=TBase64Encoding.Create(0); ???myfs:=Tfilestream.Create(‘D:\picture\1.jpg‘,fmOpenRead ); ???myss:=Tstringstream.Create; ???try ???mybase64.Encode(myfs,myss ); ???result:=‘[{"img":"data:image/jpeg;base64,‘+myss.DataString+‘"}]‘; ???finally ???????mybase64.Free; ???????myfs.Free; ???????myss.Free; ???end;end;

再处理一下对应的http get 操作

function Twebsrv.Performget(ClientIdent:TkbmMWClientIdentity; const AURL:string; const Args:array of Variant):Variant;var ?mystringstream:Tstringstream; ?MimeType,s,scallback:string; ?Charset,tablename:string; ?qv:TkbmMWHTTPQueryValues; ?dataurl,mysql,swhere:string; ???I: Integer;begin ???qv:=TkbmMWHTTPQueryValues.Create; ???dataurl:=args[0]; ???qv.AsString:=Args[2]; ??if length(Args)<1 then ???????kbmMWRaiseException(KBMMW_ERR_SERVICE_HTTP_URLMISSING,‘Missing URL.‘); ?try ???if args[0]=‘/version‘ then ???begin ???????result:=‘kbmmw 5.03‘; ???????exit; ???end; ???if args[0]=‘/getimg‘ then ?????begin ???????s:=getimg; ???????scallback:=qv.ValueByName[‘callback‘]; ????????????if scallback<>‘‘ ?then ???????????????result:=scallback+‘(‘+s+‘)‘ ?????????????else ???????????????Result:=s; ????????????exit; ?????end; ???...... ?????result:=inherited Performget(ClientIdent,aurl,Args) ; ??finally ???????qv.Free; ?????????end;end;

编译运行,在浏览器里面输入http://localhost/getimg.

输出正常,服务器端搞定,下面设计extjs.

加一个datastore.

设置对应的属性。

在view 里面建立对应的控件

并建立按钮的点击事件

Ext.define(‘MyApp.view.MyFormViewController‘, { ???extend: ‘Ext.app.ViewController‘, ???alias: ‘controller.myform‘, ???onButtonClick: function(button, e, eOpts) { ???????var me = this; ???????var store = Ext.getStore(‘MyJsonPStore‘); ???????store.load({ ???????????callback: function (records) { ???????????????var img = me.lookup(‘xalionimg‘); ???????????????img.setSrc(records[0].get(‘img‘)); ???????????} ???????}); ???}});

ok,发布这个应用。

在浏览器里面输入http://localhost/index.html

点击按钮,就可以显示出来图像了

 ok, 搞定了。

剩下的就是学习extjs 的知识了。

kbmmw 与extjs 通过JSON Base64 显示图片

原文地址:http://www.cnblogs.com/xalion/p/7749876.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved