MFC中C++如何与HTML进行交互

qq_36198926 2017-01-27 01:51:22
问题描述:
本次项目通过Socket通信获取终端传递的经度和纬度数据,需要通过调用百度地图进行数据的实时标定。然而,百度地图的API调用是在MFC的HTML文件中用java script来编写的一个文件。在js中来进行地图的创建和根据经度和纬度的实时标定。我的问题是:如何将Socket通信方式获取的经度和纬度的数据(这一部分是C++写的)传递到HTML的js中呢?
对于各位的帮助,小弟心怀感激。
...全文
5481 11 打赏 收藏 转发到动态 举报
写回复
用AI写文章
11 条回复
切换为时间正序
请发表友善的回复…
发表回复
qq_28372421 2018-12-15
  • 打赏
  • 举报
回复
sciter看一下
公共马甲0315 2018-12-12
  • 打赏
  • 举报
回复

websocket不是新的协议,其实就是tcp socket,只不过在应用层和传输层加了点儿浅封装协议而已,本质还是TCP,可以参考下通用标准协议
RFC6544

当然,你可以完全不去管这个协议,只要在PHP客户端和你的socket服务器端自定义双方协定的数据传输格式等等,也能实现互相通讯。

另外,还有大量的第三方类库,能够实现websocket消息推送模式,如果不会写服务器端,可以下载现成的,php服务器端需要使用cmd窗口启动服务器进程。
mlqxj35674 2018-02-14
  • 打赏
  • 举报
回复
CDHTMLDialog
mlqxj35674 2018-02-08
  • 打赏
  • 举报
回复
MFC中的CHTMLView在十几年前已经完美的解决了你提出的问题
controstr 2018-02-07
  • 打赏
  • 举报
回复
Baidu地图代码,将这些数据通过上面给你的代码加载到控件,就可以实现baidu的定位,js函数的调用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<style type="text/css">
	body, html,#baiduMaps {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
#r-result{width:100%; font-size:14px;}
	</style>
	<title>异步加载地图</title>
</head>
<body  onload="loadJScript()">
	<div id="baiduMaps"></div>
	<!--div id="r-result">
		经度: <input id="longitude" type="text" style="width:100px; margin-right:10px;" />
		纬度: <input id="latitude" type="text" style="width:100px; margin-right:10px;" />
		<input type="button" value="查询" onclick="theLocation()" />
	</div-->
</body>
</html>

<script type="text/javascript">
	var map;
	//var top_right_navigation; //右上角,仅包含平移和缩放按钮
	/*缩放控件type有四种类型:
	BMAP_NAVIGATION_CONTROL_SMALL:仅包含平移和缩放按钮;
	BMAP_NAVIGATION_CONTROL_PAN:仅包含平移按钮;
	BMAP_NAVIGATION_CONTROL_ZOOM:仅包含缩放按钮*/
	//window.onload = loadJScript;  //异步加载地图
	//百度地图API功能
	function loadJScript() {
		var script = document.createElement("script");
		script.type = "text/javascript";
		script.src = "http://api.map.baidu.com/api?v=2.0&ak=vBRmI1ieQo0HykbZ7O1IIuIMU3c7CBnN&callback=init";
		document.body.appendChild(script);
	}
	
		// 根据当前城市进行定位
	function localCity(result){
		var cityName = result.name;
		map.setCenter(cityName);
		map.setCurrentCity(cityName);        //由于有3D图,需要设置城市哦
		//map.addControl(new BMap.MapTypeControl({anchor: BMAP_ANCHOR_TOP_RIGHT, mapTypes: [BMAP_NORMAL_MAP,BMAP_HYBRID_MAP]})); //添加地图类型控件,右上角的三个控件按钮
		map.addControl(new BMap.MapTypeControl({anchor: BMAP_ANCHOR_TOP_RIGHT})); //添加地图类型控件,右上角的三个控件按钮
	}
	// 初始化地图
	function init() {
		map = new BMap.Map("baiduMaps");            // 创建Map实例
		map.centerAndZoom(new BMap.Point(113.00, 28.21),15); // 初始化地图,设置中心点坐标和地图级别
		map.enableScrollWheelZoom();	//启用滚轮放大缩小
		map.enableInertialDragging();
		map.enableContinuousZoom();		//启用地图惯性拖拽,默认禁用
		map.addControl(new BMap.OverviewMapControl()); // 添加默认缩略地图控件
		map.addControl(new BMap.NavigationControl()); // 左上角,添加默认缩放平移控件
		map.addControl(new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT})); // 左上角,添加比例尺
		
		// 根据当前IP进行定位
		var myCity = new BMap.LocalCity();
		myCity.get(localCity);

		//top_right_navigation = new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL}); //右上角,仅包含平移和缩放按钮
		/*缩放控件type有四种类型:
		BMAP_NAVIGATION_CONTROL_SMALL:仅包含平移和缩放按钮;
		BMAP_NAVIGATION_CONTROL_PAN:仅包含平移按钮;
		BMAP_NAVIGATION_CONTROL_ZOOM:仅包含缩放按钮*/

		// 添加控件和比例尺
		AddControl();
	} 


	    //坐标转换完之后的回调函数
    translateCallback = function (data){
      if(data.status === 0) {
		var mk = new BMap.Marker(data.points[0]);
		map.panTo(data.points[0]);
		map.clearOverlays();
		map.addOverlay(mk);
		
      }
    }

	// 设置中心点坐标,经度,纬度
	function SetCenter(longitude, latitude) {
		/*var point = new BMap.Point(longitude, latitude);
		map.panTo(point);*/
		// 下矶代码实现GPS转百度地图坐标
		var convertor = new BMap.Convertor();
		var gpsPoint = new BMap.Point(longitude, latitude);
		var pointArr = [];
		pointArr.push(gpsPoint);
		convertor.translate(pointArr, 1, 5, translateCallback);
	}
	
	// 设置中心点图标,经度,纬度
	function SetMarker(longitude, latitude) {
		var point = new BMap.Point(longitude, latitude);
		var mk = new BMap.Marker(point);
		map.clearOverlays();
		map.addOverlay(mk);
	}

	function RemoveMarker() {
	    map.clearOverlays();
	}

	function SetZoom(zoom) {
		map.setZoom(zoom);
	}
	
	/*

	function theLocation(){
		if(document.getElementById("longitude").value != "" && document.getElementById("latitude").value != ""){
		//SetCenter(document.getElementById("longitude").value,document.getElementById("latitude").value);
		//SetMarker(document.getElementById("longitude").value,document.getElementById("latitude").value);
		SetCenter(document.getElementById("longitude").value,document.getElementById("latitude").value);
		}
	}*/
</script>
controstr 2018-02-07
  • 打赏
  • 举报
回复
http://bbs.csdn.net/topics/392320388 给的代码,直接COPY下来保存
controstr 2018-02-07
  • 打赏
  • 举报
回复
http://bbs.csdn.net/topics/392320388

    CWebBrowser20   m_WebBrowser;
    IHTMLDocument2*	  m_pIHTMLDoc;
    m_WebBrowser.Navigate2(&CComVariant(_T("about:blank")), NULL, NULL, NULL, NULL);
    m_WebBrowser.put_Silent(TRUE);

LoadHTML("html代码”, 长度);
// 获取Document指钟
    CComPtr<IDispatch> pDocument = m_WebBrowser.get_Document();
    if ( pDocument )
    {
        if ( m_pIHTMLDoc )
        {
            m_pIHTMLDoc->Release();
            m_pIHTMLDoc = NULL;
        }

        pDocument->QueryInterface(IID_IHTMLDocument2, (void**)&m_pIHTMLDoc);
    }

// 调用JS函数
    if ( m_pIHTMLDoc )
    {
        CComPtr<IHTMLWindow2> pHTMLWindow = NULL;
        if ( S_OK == m_pIHTMLDoc->get_parentWindow(&pHTMLWindow) && pHTMLWindow )
        {
            VARIANT ret;
            pHTMLWindow->execScript(CComBSTR("JS函数"), CComBSTR("JScript"), &ret);
        }
    }

//================================================
// 加载html代码到组件

void LoadHTML(LPVOID pData, int nLen)
{
    CComPtr<IDispatch> spDoc(m_WebBrowser.get_Document());
    if ( NULL == spDoc || NULL == pData )
    {
        return;
    }

    //得到IPersistStreamInit指针
    CComQIPtr<IPersistStreamInit, &IID_IPersistStreamInit> spPSI(spDoc);
    if ( NULL == spPSI )
    {
        return;
    }

    //申请内存, 复制HTML字符串
    LPSTR lpMemory = (LPSTR)::GlobalAlloc(GPTR, nLen + 1);
    ZeroMemory(lpMemory, nLen + 1);
    memcpy(lpMemory, pData, nLen);

    //转换内存为流对象指针
    CComPtr<IStream> spStream;
    HRESULT hr = CreateStreamOnHGlobal(lpMemory, TRUE, &spStream);
    if ( FAILED(hr) || !spStream )
    {
        return;
    }

    //初始化后,装载显示
    hr = spPSI->InitNew();
    if ( FAILED(hr) )
    {
        return;
    }

    hr = spPSI->Load(spStream);
    if ( FAILED(hr) )
    {
        return;
    }
}
oyljerry 2017-01-31
  • 打赏
  • 举报
回复
通过webbrowser来-传递数据给js
psp7456 2017-01-30
  • 打赏
  • 举报
回复
客户端插入ie控件,访问百度地图,直接调用百度地图api。
firebolt2002 2017-01-29
  • 打赏
  • 举报
回复
我不知道你想从服务端加还是想从客户端加,不过这两种方式我都用过,服务端我是通过把经纬度和设备ID用一行字符串写入共享文件,然后服务端后台定时读取这个文件得到最新的GPS数据。客户端传递数据是通过一个com组件发消息给客户端,参数是包含经纬度和设备ID字符串。前几天还帮朋友做了个程序,替换客户端IE界面的文字和图片,我是通过BHO实现的,你可以通过BHO调用当前IE文档的javascript。希望能帮到你。

3,055

社区成员

发帖
与我相关
我的任务
社区描述
VC/MFC HTML/XML
社区管理员
  • HTML/XML社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧