jwchat源码分析-数据交互部分

最新推荐文章于 2021-09-01 15:42:24 发布

絮絮不休

最新推荐文章于 2021-09-01 15:42:24 发布

阅读量898

点赞数

分类专栏： XMPP 文章标签： input class function table 服务器 token

本文链接：https://blog.csdn.net/duanml61/article/details/7850233

版权

XMPP 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

这个部分，focus到vcard.html文件，操作界面如图：

静态页源码：

<form>
    <fieldset>
      <legend>Name</legend>
      <table>
          <tr><th nowrap>Full Name:</th><td width="100%"><input type=text id="FN" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Family Name:</th><td width="100%"><input type=text id="N.FAMILY" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Given Name:</th><td width="100%"><input type=text id="N.GIVEN" class="vcardBoxEditable"></td></tr>
      </table>
    </fieldset>
    
    <fieldset>
      <legend>Information</legend>
      <table>
          <tr><th nowrap>E-mail:</th><td width="100%"><input type=text id="EMAIL" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Web Site:</th><td width="100%"><input type=text id="URL" class="vcardBoxEditable"></td></tr>
      </table>
    </fieldset>
    
    <fieldset>
      <legend>Address</legend>
      <table>
          <tr><th nowrap>Address:</th><td width="100%"><input type=text id="ADR.STREET" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Address2:</th><td width="100%"><input type=text id="ADR.EXTADD" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>City:</th><td width="100%"><input type=text id="ADR.LOCALITY" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Province:</th><td width="100%"><input type=text id="ADR.REGION" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Postal Code:</th><td width="100%"><input type=text id="ADR.PCODE" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Country:</th><td width="100%"><input type=text id="ADR.CTRY" class="vcardBoxEditable"></td></tr>
      </table>
    </fieldset>

    <fieldset>
      <legend>Organization</legend>
      <table>
          <tr><th nowrap>Name:</th><td width="100%"><input type=text id="ORG.ORGNAME" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Unit:</th><td width="100%"><input type=text id="ORG.ORGUNIT" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Title:</th><td width="100%"><input type=text id="TITLE" class="vcardBoxEditable"></td></tr>
          <tr><th nowrap>Role:</th><td width="100%"><input type=text id="ROLE" class="vcardBoxEditable"></td></tr>
      </table>
    </fieldset>

    <fieldset>
      <legend>About</legend>
      <table width="100%">
          <tr><th>Birthday:</th><td width="100%"><input type=text id="BDAY" class="vcardBoxEditable"></td></tr>
		<tr><td colspan=2> </td></tr>
          <tr><th>Description:</th><td width="100%"> </td></tr>
          <tr><td colspan=2 width="100%"><textarea id="DESC" class="vcardBoxEditable" style="width:100%;" rows=4 wrap=virtual></textarea></td></tr>
      </table>
    </fieldset>
    <div id="savebox">
		<hr noshade size="1" size="100%">
		<div align="right">
			<button onClick="window.close();">Cancel</button> <button onClick="return sendSub();">Save</button>
		</div>
      </div>
    </form>

查询信息由如下代码实现：

function init() {
	srcW = opener.top;

	getArgs();

	jid = passedArgs['jid'];
	document.title += jid;

	// request vcard
	var iq = new JSJaCIQ();
	iq.setType('get');
	if (cutResource(jid) != srcW.cutResource(srcW.jid)) // not me
		iq.setTo(jid);
	var vCard = iq.getNode().appendChild(iq.getDoc().createElement('vCard'));
	vCard.setAttribute('xmlns', 'vcard-temp');
	me = this;
	srcW.con.send(iq, me.handleVCard);
}

function handleVCard(iq) {
	if (!iq) {
		srcW.Debug.log('got empty iq result', 1);
		return;
	}

	srcW.Debug.log(iq.getDoc().xml, 3);

	if (iq.getNode().getElementsByTagName('vCard').item(0)) {
		for ( var i = 0; i < iq.getNode().getElementsByTagName('vCard').item(0).childNodes.length; i++) {
			var token = iq.getNode().getElementsByTagName('vCard').item(0).childNodes
					.item(i);
			tokenname = token.nodeName;
			if (token.firstChild && token.firstChild.nodeType != 3) { // found
																		// a
																		// container
				for ( var j = 0; j < token.childNodes.length; j++) {
					if (typeof (document.forms[0].elements[tokenname + "."
							+ token.childNodes.item(j).nodeName]) != 'undefined'
							&& token.childNodes.item(j).firstChild)
						document.forms[0].elements[tokenname + "."
								+ token.childNodes.item(j).nodeName].value = token.childNodes
								.item(j).firstChild.nodeValue;
				}

			} else if (typeof (document.forms[0].elements[tokenname]) != 'undefined'
					&& token.firstChild)
				document.forms[0].elements[tokenname].value = token.firstChild.nodeValue;
		}
	}
}

上面代码执行之后，会从openfire服务器接受如下信息：

[2] inQueue:
[2] sending response [468651]:
<body xmlns="http://jabber.org/protocol/httpbind" />
[2] inQueue:
<iq type="result" id="JSJaCID_2" to="13312345678@xjtu/jwchat">
	<vCard xmlns="vcard-temp">
		<FN>james boocher</FN>
		<N>
			<FAMILY>boocher</FAMILY>
			<GIVEN>james</GIVEN>
		</N>
		<EMAIL>284771818@qq.com</EMAIL>
		<URL>xjtu.com</URL>
		<ORG>
			<ORGUNIT>dev</ORGUNIT>
		</ORG>
	</vCard>
</iq>
[2] sending response [468652]:
<body xmlns="http://jabber.org/protocol/httpbind">
	<iq xmlns="jabber:client" id="JSJaCID_2" to="13312345678@xjtu/jwchat"
		type="result">
		<vCard xmlns="vcard-temp">
			<FN>james boocher</FN>
			<N>
				<FAMILY>boocher</FAMILY>
				<GIVEN>james</GIVEN>
			</N>
			<EMAIL>284771818@qq.com</EMAIL>
			<URL>xjtu.com</URL>
			<ORG>
				<ORGUNIT>dev</ORGUNIT>
			</ORG>
		</vCard>
	</iq>
</body>

以上为查询部分，下面是信息修改部分，相关源码如下：

function sendSub() {
	var iq = new JSJaCIQ();
	iq.setType('set');

	var vCard = iq.getNode().appendChild(iq.getDoc().createElement('vCard'));
	vCard.setAttribute('xmlns', 'vcard-temp');

	for ( var i = 0; i < document.forms[0].elements.length; i++) {
		var item = document.forms[0].elements[i];
		if (item.id == '')
			continue;
		if (item.value == '')
			continue;
		if (item.id.indexOf('.') != -1) {
			var tagname = item.id.substring(0, item.id.indexOf('.'));
			var aNode;
			if (vCard.getElementsByTagName(tagname).length > 0)
				aNode = vCard.getElementsByTagName(tagname).item(0);
			else
				aNode = vCard.appendChild(iq.getDoc().createElement(tagname));
			aNode.appendChild(
					iq.getDoc().createElement(
							item.id.substring(item.id.indexOf('.') + 1)))
					.appendChild(iq.getDoc().createTextNode(item.value));
		} else {
			vCard.appendChild(iq.getDoc().createElement(item.id)).appendChild(
					iq.getDoc().createTextNode(item.value));
		}
	}
	srcW.Debug.log(iq.getDoc().xml, 3);
	
	srcW.con.send(iq);
	window.close();
}

执行之后，会向openfire服务器发送如下信息：

[2] inQueue:
[2] sending response [468653]:
<body xmlns="http://jabber.org/protocol/httpbind" />
[2] inQueue:
<iq type="result" to="13312345678@xjtu/jwchat" />
[2] sending response [468654]:
<body xmlns="http://jabber.org/protocol/httpbind">
	<iq xmlns="jabber:client" to="13312345678@xjtu/jwchat"
		type="result" />
</body>

该操作之后，数据持久到DB中

----------------------------------------------------------源码分析-----------------------------------------------------

数据交互核心方法是jsjac中JSJaCIQ，相关源码如下：

function JSJaCIQ() {
    this.base = JSJaCPacket;
    this.base('iq');
}

又看到了this.base语句，这个需要好好理解

function JSJaCPacket(name) {
    this.name = name;
    if (typeof(JSJACPACKET_USE_XMLNS) != 'undefined' && JSJACPACKET_USE_XMLNS) this.doc = XmlDocument.create(name, 'jabber:client');
    else this.doc = XmlDocument.create(name, '');
}

以上看懂的就可以了，使用过程中，只需实例化自己的对象就行了

var iq = new JSJaCIQ();
	iq.setType('set');//update
	iq.setType('get');//query

按照协议规范，创建所需文本内容，之后

srcW.con.send(iq);

其中，srcW=openr.top，也就是jwchat.html中 top属性

--------------------------------------------------------数据交互部分结束-----------------------------------------------------

絮絮不休

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jwchat源码分析-数据交互部分

这个部分，focus到vcard.html文件，操作界面如图：静态页源码： Name Full Name: Family Name: Given Name: Information E-mail
复制链接

扫一扫