第82篇 webrtc一对一研究（十）及php

关键词：GetQueryString, 老师端传参数及学生端传参, substr_count, parse_url,urlencode

一、webrtc

1.1  老师端传参数及学生端传参

老师端：

https://www.xq.com:9001/?room_id=333

学生端：

https://www.xq.com:9001/#333

注：老师端需要传一个room_id进去，打开房间，建立完房间之后，学生才可以进去。代码支持如下：

打开房间：

a) 用按钮打开房间

<buttonid="open-room" style="width:110px;font-size:18px;">打开房间</button></span>

按钮单击事件：

b) 传参数打开房间

         function GetQueryString(name){

                             var reg = new RegExp("(^|&)"+name +"=([^&]*)(&|$)");

                             var r =window.location.search.substr(1).match(reg);

                             if(r!=null)return  decodeURI(r[2]); return null;

                   }

                   var_room_id = GetQueryString('room_id');

        var _from = GetQueryString('from');

        var _pu = GetQueryString('pu');

        var _name = GetQueryString('name');

  接收参数后，会根据room_id的值进行模拟单击按钮的操作，如下：

1.2  分析一个正则表达式函数GetQueryString

                   functionGetQueryString(name){

                             var reg = new RegExp("(^|&)"+name +"=([^&]*)(&|$)");

                             var r =window.location.search.substr(1).match(reg);

                             if(r!=null)return  decodeURI(r[2]); return null;

                   }

  a) 函数名为：GetQueryString()，需要传一个参数name，这是一个js写法

  b) var reg = new RegExp("(^|&)"+ name+"=([^&]*)(&|$)");

   RegExp 的构造函数创建了一个正则表达式对象，用模式来匹配文本。

  正则表达式规则：

模式/ab*c/匹配了一个单独的 'a' 后面跟了零个或者多个 'b'（*的意思是前面一项出现了零个或者多个），即：b可以出现一次，也可以出现多次。看个例子：

注：exec方法只能找到第一个，并返回。

(^|&)"+ name+"=([^&]*)(&|$)

这个正则表达式的意思是:以&号或其他开头，中间传过来一个变量name，后面

(^|&)   ：^匹配字符串开头,&就是&字符，(^|&)匹配字符串开头或者&字符，如果其后还有正则，那么必须出现在字符串开始或&字符之后

name   ：变量

([^&]*)  ：[^&]表示匹配不包含&的内容 *表示可以重复0或N次

(&|$)   ：表示&结束或直到结尾

 c) var r = window.location.search.substr(1).match(reg);

window.location.search方法是截取当前url中“?”后面的字符串

比方说：https://www.xq.com:9001/?room_id=333将输出：?room_id=333;

substr(1):是截取字符串，从第1个输出（字符串从0开始记）：

window.location.search.substr(1)

上面这句，对https://www.xq.com:9001/?room_id=333，将输出：room_id=333;

window.location.search.substr(1).match，match将对前面window.location.search.substr(1)截取的字符串进行按reg匹配，因为reg中有四部分，所以将匹配4个部分，如下：

分析： https://www.xq.com:9001/?room_id=333

主要对room_id=333进行匹配，

一、((^|&)"+ name +"=([^&]*)(&|$))是整体匹配，整体匹配，匹配到了：room_id=333

二、(^|&)   ：匹配到了空，因为不是以&开头的。

三、 ([^&]*)  ：前面有个等号，就是等号后面的，不包含&，所以匹配到了333.

四、(&|$)：表示跟在前面匹配到的字符后面必须是&或$，所以匹配到了空。

再看个例子：

注：这个函数可以进行匹配，但它只找等号（name=）旁边的，

第一次匹配room_id时：

room_id=1234&name=刘德华

它找的是从开始到room_id=后面的，非&的，最后是&号之前的，恰好为1234；

第二次匹配时from时：

room_id=1234&name=刘德华

它找的是&开始，接着是name=之后，非&号字符，直到碰到&，如果一直没碰到，就直到结束为止。

 

d) if(r!=null)return decodeURI(r[2]);

return null;

这两句话的意思是：如果r不是空的话，就返回解码后的r[2](room_id=333,就返回333)，否则，就返回空。

decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。看个例子，在本例中，我们将使用 decodeURI() 对一个编码后的 URI 进行解码：

1.3 清屏按钮同时清空学生端

 清屏函数：

        function cleanAll(){

                   designer.undo('all');-------------函数1

        }

 上述函数用到了：designer.undo('all')，对它进行追踪如下：

    designer.undo = function(index) {

        if (!designer.iframe) return;

 

        designer.postMessage({-----------------------函数2

            undo: true,

            index: index ||designer.pointsLength - 1 || -1

        });

};

上述函数中，有一个designer.postMessage()函数，很重要，对它进行追踪如下：

   designer.postMessage = function(message) {

       if (!designer.iframe) return;

 

       message.uid = designer.uid;

       designer.iframe.contentWindow.postMessage(message, '*');

    };

这个目前的思路有两个：

  1） 同步：清屏之后，不等铅笔写新字，立马同步；

  2） 消息机制：老师端点清屏按钮时，向学生端发一条消息，学生端也立刻执行清屏函数。

 

二、php

2.1字符串统计函数substr_count()

在一个字符串中统计一个子字符串出现的次数，看个例子：

注：从程序运行结果可以看出，这个函数substr_count()在统计时是区分大小写的。另外，还可以指定第三个参数、第四个参数，第三个参数表示从哪个位置起始，第四个参数表示查找几个字符，看个例子：

注：从上述两个输出，可以看到均为0次。第一个good超过第9个字符了，所以查找不到；第二个day虽然没超过第9个字符，但因为只查了一个字符，所以也不可能查到。

2.2 parse_url()

 上述函数是url解析函数，能对url进行解析，返回一个数组，看个例子：

注：从结果可以看出，会返回一些参数并且有对应的值，因此，我们可以请求部分值，看个例子：

注：由上述返回的结果可知，我们在开发项目是，可以根据需要取出相应的值，而不是全部。

2.3 urlencode

 urlencode()函数用于对url进行编码。先看一个明文传输的例子：

点击上图的超链接，结果如下：

可以看出，url中没有进行编码，用的是明文传输，这样是不安全的。

2016年10月28日星期五