12306发起正晚点查询请求

以2018年1月25日G73次列车到达长沙南站的正晚点时间查询为例

第一步，去12306官网找到正晚点查询的入口

第二步，Chrome浏览器下F12打开控制台

第三步，按要求填写需要的参数，发起一次请求

第四步，F12控制台的Network分类下有这次发起请求的记录

第五步，双击就可以查询了，看起来那个验证码是前端做的验证

扩展：

下面来解析一下这个请求吧

http://dynamic.12306.cn/mapping/kfxt/zwdcx/LCZWD/cx.jsp?cz=%B3%A4%C9%B3%C4%CF&cc=g73&cxlx=0&rq=2018-01-25&czEn=-E9-95-BF-E6-B2-99-E5-8D-97&tp=1516868331709

可以看到包含以下几个参数：

1.  cz=车站   .....（吐槽一句，我以为这种巨型系统会脱离我这种菜鸟才会用的命名法的）.....

我知道这一串 %B3%A4%C9%B3%C4%CF 是 长沙南 的意思，但不知道是哪种编码，我就去站长之家找，UTF-8、Unicode、URL一个个试过去，最后确定是URL编码，解析地址是URL编码解码-站长工具。需要注意的是，这个下拉列表框里选中gb2312。

2. cc=车次   

3. cxlx=0  查询路线？我也不知道，但是试了一下，只有为0或者1才能查到数据，不然就是

4. rq=日期 格式为 2018-01-25

5.czEn=-E9-95-BF-E6-B2-99-E5-8D-97  车站编码？我也不知道，但是这个参数删了会报错

 （2018-01-26更新）测试发现这个参数必须填的，但是各种解码方式都无法解析，顿时感觉人生都灰暗了，我以为是

12306自己的数据字典，就去查看了12306网页的源码，一步一步往下走：

html: 

 <inputtype="button"tabindex="6"class="btn1"value=" 查 询" name="chaxunBtn"id="chaxunBtnId"onClick="chaxunFun()" />

js:

function chaxunFun(){//查询按钮的事件处理

	var resultJsp = document.getElementById("resultJsp");

	showResult(0,1);

	resultJsp.innerHTML = "";

	

	var chezhanInput = document.getElementById("chezhanInId");

	if(chezhanInput.disabled==false){

		if(chezhanInput.value==""){

			alert("错误提示：\n\n请输入车站信息！");

			chezhanInput.focus();

			return;

		}else{

			chezhanInput.value = chezhanInput.value.replace(/\s+/g,"");

		}

	}

	var chechiInput = document.getElementById("chechiInId");

	if(chechiInput.value==""){

		alert("错误提示：\n\n请输入车次信息！");

		chechiInput.focus();

		return;

	}else{

		chechiInput.value = chechiInput.value.replace(/\s+/g,"");

	}



//**** add by hjl 2008-12-23

	var rightcode="";

  for(var i=0;i<spans.length;i++){

     rightcode+=spans[i].innerHTML;               

  }       

  if(document.getElementById("yzm").value!=rightcode){

//stono 90302 start	  



    alert("验证码不正确，请重新输入!");

	document.getElementById("yzm").focus();

    return false;



//stono 90302 end

  }

//************************************************************



	document.getElementById("resultJsp").innerHTML="正在查询，请稍候...";

	//checkCZ();

	fromtoFun();

	

}

function fromtoFun(){//检测车站车次

	var cz=document.getElementById("chezhanInId").value.replace(/\s+/g,"");

	var cc=document.getElementById("chechiInId").value.replace(/\s+/g,"");

	var czEn = encodeURI(cz);//stono 90302

	czEn = czEn.replace(/%/g,"-"); //stono 90302

	var cxlx =0;

	var cxlx0 = document.getElementById("cxlx0");

	if(!cxlx0.checked) cxlx=1;

	var rq= document.getElementById("txt2").value;

	if(cc==""){

		document.getElementById("from2Id").innerHTML="";

		return ;

	}

//	alert('from2.jsp?cz='+cz+'&cc='+cc+'&cxlx='+cxlx+'&rq='+rq+'&czEn='+czEn);

	var tp = new Date().getTime();

	var from2 = new net.ContentLoader('from2.jsp?cz='+cz+'&cc='+cc+'&cxlx='+cxlx+'&rq='+rq+'&czEn='+czEn+'&tp='+tp,fromtoCall);

	

}

var cz=document.getElementById("chezhanInId").value.replace(/\s+/g,"");

var czEn = encodeURI(cz);

核心代码就是这两句啦，但是令我非常不理解的是， 在“cz”这个参数这里，编码格式是GB2312，具体过程是“长沙南”-->以GB2312的格式Urlcode编码-->“%b3%a4%c9%b3%c4%cf”，而在“czEn”这个参数里，编码格式是utf-8，具体过程是“长沙南”-->以utf-8的格式进行Urlcode编码 -->“%e9%95%bf%e6%b2%99%e5%8d%97”-->将“%”替换为“-” 。

6. tp=timestamp  时间戳，至于为什么取前后两个字母，大概是心情命名法吧，这里也有转码地址时间戳转换地址-站长工具。

这个参数乱填一个数字甚至不填也可以请求到，应该是用于统计分析？

那么要发起一个正晚点查询的请求只要在URL地址   http://dynamic.12306.cn/mapping/kfxt/zwdcx/LCZWD/cx.jsp?    后面拼接需要的参数就行了，至于用途，大概就是有时候列车晚点的时候能方便一点查询到晚点信息而不用每次去12306输验证码查询了吧

总结：学到了什么

1. JS encodeURI      replace 函数的使用

2.  从F12的控制台可以获取到很多信息，比如这篇文章用到的网路请求地址，参数

3. 看起来很厉害的网站其实慢慢看下去也能看懂

4. 命名真的要规范化，不然就会像12306这样，查询=chaxun()

5. 学点东西心情会变好

6. 感兴趣的事值得深究

扩展练习：写一个简单的html页面，要求包含12306正晚点查询的功能