项目中,很多应用均需要到导出图形和数据, 例如到到excel中,这是最常用的, 及word中,总结遇到情况,以便笨脑子查询,具体如下:
1,前端处理逻辑
首先,网页的加载过程为: 请求->加载->解析->渲染->显示, 其中遇到图片资源就发送请求获取,随着页面逻辑,图片会很多, 就会生成很多http请求, 从而影响页面的加载, 及时是异步情况。
其次, 为避免上述情况, 做法是将多张图片合并到一起,这样在打开页面的时候只需要一次http请求就可以加载多张图片,然后通过设置图片的背景偏移量来正确的显示。 但是这种通过偏移量显示,会遇到浏览器的兼容性问题。
前辈,总是孜孜不倦的,精益求精的探寻最优的解决方案, 于是有了如下方案:
通过将图片转转成base64编码,直接写在html页面或者css里面,这样就避免请求,同时避免无聊的兼容性问题;
通过将图片转换为base64文件,可以扩展更好的应用, 如将网页中数据和图形,直接导入到excel中, 便于用户即可查看图形,同时也可以看数据。
以此引出导出功能, 前端可以通过将页面数据和图片,按照一定的json格式,传给服务端,服务端通过后台页面逻辑,生成excel兼容的xml文件。
然后将该文件下载到本地,保存为excel格式文件,直接打开即可;
至此一个导出图片和数据完毕。
2,客户端处理, 获取数据,及生产excel至此的xml等,不做讲解,主要讲解c++客户端将图片的base64文件转换为本地的文件, 具体如下:
1,将前端给的json数据,解析处理图片的base数据;
2, 解析banse数据,注意此处可能涉及字符的转换,比如用到WideCharToMultiByte;
3,核心来如下:
HGLOBAL hGlobal = GlobalAlloc(GMEM_MOVEABLE, nLen) ; /// nLen 长度
void* pData= GlobalLock(hGlobal );
memcpy(pData, buffer, nlen);
GlobalUnlock(hGlobal );
IStream* pStream = NULL;
if(S_OK == CreateStreamOnHGlobal(hGlobal, TRUE, &pStream))
{
CImag imData;
if(SUCCEEDEN(imData.Load(pStream)))
{
CClientDC dc(this);
imData.Draw(dc.m_hDC, 0, 0, nWidth, nHeight);
imData.Save(strPath, ImageFormatBMP); /// strPath 文件路径,ImageFormatBMP 文件格式,
/// 也可以为ImageFormatPNG等等
}
pStream->Release();
}
GlobalFree(hGlobal );
至此一张BMP的图片已经保存到制定path下面, 后续进行相关操作!