由于项目是基于b/s结构，因为在pc端上是没有客户端这概念只有浏览器，而对于web与移动端的关系，实际上还是类似于C/S结构，因此web端与web端的通信是通过发送HTML5标签来实现，常规的做法中pc端与移动端是通过数据文本、文件来通信来交流信息的而非HTML5标签。
解决方案：
为了解决通信的矛盾，一般有两个思路：（1）后台根据发送目标来匹配发送数据。（2）适配传输内容。
思路一基于现有的条件来说实现难度大，而且不大现实。而思路二，也有一定的实现难度，但较思路一要现实，因此选择思路二。
思路二的具体实现方案有两种，方案一是基于文本发送，前端收到文本信息后再封装成html5标签进行显示，而移动端直接接受显示。方案二是html5标签，web端直接显示，移动端解析显示。
项目需要，选择方案二。
Hpple
hpple，它是一个轻量级的包装框架，可以很好的解决这个问题，尤其是它支持HTML的解析，是其他XML类库所不及的地方，它是用XPath来定位和解析HTML或者XML。githut下载地址
XPath定位原理
Xpath将xml的文档结构视为一个树形结构，元素、属性、文本、注释以及处理指令都是这个树形结构上的节点，对于xml文档中元素、属性、文本、注释以及处理指令的访问实际上是按顺序遍历这棵树，使用Xpath的路径表示法，可以定位到XML文档中的一个节点或者节点集合。
在Xpath中，可以使用相关标识来定位元素以及其属性，这些标识符关键字主要有：child、self、parent、descendant、attribute等。
child为默认标识符，self表示当前节点，parent表示上一级节点。
descendant表示当前子孙节点，attribute表示当前节点的属性。
绝对路径的Xpath表示
绝对路径是从根节点到目标节点所经历的路径。
Xpath详细学习地址：http://www.w3school.com.cn/xpath/xpath_functions.asp
im模块通信常见HTML5标签样式
//--------------------纯文本----------------------------------//
//NSString *testData = @"
哈哈
";
//NSString *testData = @"
ha
";
//NSString *testData = @"
ha ni ha hehe wo
";
//NSString *testData = @"
嘿嘿，你好
";
//NSString
*testData = @"
1 1
1
1
";
//NSString *testData = @"
哈哈
";
//NSString
*testData =
@"
title111222333
77 7555444666
";
//---------------------图文混合-------------------------------//
//NSString *testData = @"
水电费水电费
src=\"http://img.baidu.com/hi/jx2/j_0025.gif\">谁的故事电饭锅
src=\"/dynamic/upload1/image/20150729/1438130709982028464.jpg\"
title=\"1438130709982028464.jpg\" alt=\"14.jpg\">山东省";
//---------------------纯文件---------------------------------//
//NSString *testData = @"
name=\"68477\" target=\"_blank\">2015-07-20_205553.png
class=\"blockspan progress\" style=\"display: none;\">
class=\"blockspan progress-bar\" style=\"width:
100%;\">0%
";
引入TFHpple第三方库效果
集成TFHpple库后，只需要调用以下三行代码，即可完成html5标签的解析。
NSData*data = [testDatadataUsingEncoding:NSUTF8StringEncoding];
TFHpple*xpathParser = [[TFHpplealloc]initWithHTMLData:data];
NSArray*elements = [xpathParsersearchWithXPathQuery:@"//p"];
在对纯文本标签的测试，基本都通过，无任何错误。知道解析
title111222333
77 7555444666
最后得到@[@“666”,@“111”,@“222”,@“555”,@“444”]的结果。
与目标结果@[@“title”,@“111”,@“222”,@“333”,@“444”,@“555”,@“666”]的结果相差甚远。
根据程序实现逻辑可以将标签转成哈夫曼树如下图：
从图可以容易得出，因为每个节点只允许存储一个数值，因此，后面的数值会覆盖之前存储好的数值。
因此TFHpple库未能满足项目的要求。
针对TFHpple库进行优化
针对上述的情况，为了实现不会有数据的丢失，修改TFHpple库的实现逻辑，将数据结构改成NSArray，将所有的数值按照数组的值存储起来。
经过修改的TFHpple库解析后的哈夫曼树图如下：
之时，TFHpple解析出来的结果包含了所有的参数，但是顺序确是换乱。因为Xpath对标签是按照顺序来解析的，而换了NSArray后，存储的顺序规律已经被破坏，因此需要从新为每个数据编定绝对位置。
通过给每个写入结果的参数都添加上［i］，其中i表示写入的顺序。当获得结果后，再经过一个排序即可获得最终结果。
但是，由于还有属性参数已经因为文件、图片类型的标签的存在，因此需要在TFHpple的实现中添加一定的限制条件，只允许文本、img－url、file－href三种关键数据的写入。
因此添加的绝对标签在最重的结果是不完整的，所以要将原本的绝对标签视为相对标签，再将其再转换成绝对标签，最后根据标签顺序整合文本、图片、文件结果。
结果
最终实现了文本、图片、文件三种类型的单独或者混合形式的标签的解析。
网友评论