打开网页自动弹出QQ对话框的3种方法-js教程-网页制作-壹聚教程网

创建时间:2016/3/16 10:58
来源:http://www.111cn.net/wy/js-ajax/77704.htm


打开网页自动弹出QQ对话框的3种方法

www.111cn.net 编辑:kupeer 来源:转载
我们在打开网页时有时会碰到一些网页弹出加QQ群或QQ聊天的一个对话框了,下面我们一起来看看这种方法的实现步骤.

认真的研究了这些网站的源代码,发现了一个东西,一般现在的网站很少使用框架的,因为搜索引擎不能识别框架,但是这些网站却有一个框架,框架的地址就是一行简单的地址,而且还不是http的地址,例如下面的这个地址:

tencent://message/?uin=1278230143&Site=&menu=yes

这有点像移动开发中的打电话的链接,应该是调用你自己电脑的软件。
通过自动弹出QQ对话框的方法能够实现很高的客户咨询量,相比“左一个、右一个、中间再弹一个”的客服组件,通过“打开网页自动弹出QQ对话框”这种方式来实现提升咨询量无论是用户体验还是效果都要强很多。

 

每个浏览器对于这段代码的实现方法可能略有不同,firefox里面会让你选择什么应用程序来打开这个链接,可能用户也会勾选“记住我对tencent类型链接的选择。(R)”,这样以后都不会弹出选择应用程序的这个对话框。


Firefox里面选择程序打开链接


而IE等浏览器是会直接弹出对话框,不过如果你同时登录了多个QQ,那么他会让你选择一个qq进行聊天。


选择QQ进行聊天


放置了这段代码,可是需要用户点击,这不是我们需要的效果,我们想要用户打开网页的时候就弹出这个对话框,那么如何实现


自动弹出对话框

我们在网页中放置一个框架,然后框架的地址就是上面的那段代码,当网页加载的时候就会自动去访问这个地址,于是就会自动弹出QQ聊天窗口,当然我们需要设置这个框架不显示,不能让用户看到。

<iframe style="display:none;" src="tencent://message/?uin=1278230143&Site=&menu=yes"></iframe>

设置多个客服QQ

针对企业中有多个客服的情况,为了客服直接合理分配接待。刚刚也研究出了一套解决方案就是预设多个客服QQ,然后给访客随机弹出一个客服QQ的对话框!当然这个适合于企业,对于个人站长就没必要了。

<iframe style="display:none;" class="qq_iframe" src=""></iframe>
<script>
$(function(){
    qq_list = new Array('1278230143', '353207542');
    //随机
    qq_i = Math.floor(Math.random()*qq_list.length);
    src = "tencent://message/?uin="+qq_list[qq_i]+"&Site=&menu=yes";
    $('.qq_iframe').attr('src', "tencent://message/?uin="+src+"&Site=&menu=yes")
})
</script>

延时弹出对话框

有不少客户问我如何设置访客打开页面后10秒再弹出,再次研究更新了这个弹出,确实找到的方法可设置10秒后弹出!这样可以一定程度上提升用户体验,同时让访客先看看网站的优质服务能够有效地提升客户对产品的认可度,进而提升客户主动沟通的机会!

<iframe style="display:none;" class="qq_iframe" src=""></iframe>
<script>
$(function(){
    setTimeout(function(){
        qq_list = new Array('1278230143', '353207542');
        //随机
        qq_i = Math.floor(Math.random()*qq_list.length);
        src = "tencent://message/?uin="+qq_list[qq_i]+"&Site=&menu=yes";
   
        $('.qq_iframe').attr('src', "tencent://message/?uin="+src+"&Site=&menu=yes")
    }, 10000)
})
</script>

好了,以上就是三种设置的方法,一个比一个高级的说,希望对你有所帮助。

Express是一个NodeJS的Web框架,在使用Express的时候,要用到session功能,但是在获取session属性值时发现获取不了,折腾了一番后才成功,现在分享经验。

我们首先看Express中session的官方的sample code

// first:
// $ npm install redis
// $ redis-server

var express = require('../..');

var app = express();

app.use(express.logger('dev'));

// Required by session() middleware
// pass the secret for signed cookies
// (required by session())
app.use(express.cookieParser('keyboard cat'));

// Populates req.session
app.use(express.session());

app.get('/', function(req, res){
var body = '';
if (req.session.views) {
++req.session.views;
res.send(body + '<p>viewed <strong>' + req.session.views + '</strong> times.</p>');
} else {
req.session.views = 1;
body += '<p>First time visiting? view this page in several browsers :)</p>';
res.send(body + '<p>viewed <strong>' + req.session.views + '</strong> times.</p>');
}
});

app.listen(3000);
console.log('Express app started on port 3000');

在运行之前,需要了解几点:

草绿色的两行代码是必须的,keyboard cat’是用来加密cookie的密钥。

session需要介质存储存储,express.session()的方式默认存储在内存中。还有一种常用的方法是存储在数据库中,redis是一个Non-SQL的数据库,有NodeJS的插件可以访问他,redis是常用的。不过考虑到太重量了,我没有用。而是存储在内存中。

session提供了regenerate方法,用来将整个session清空,然后可以重新赋值。

我遇到的问题是,在登录请求中,使用session的 regenerate方法创建一个全新的session:

function login(request, response){

request.session.regenerate( function(){
request.session.username = userInfo.username;
console.log("set session username = " + request.session.username);
console.log(request);
response.write(JSON.stringify(loginResult));
response.end();
} );
}

然后,在登录后的其他请求中,判断request.session.username是否存在,但是获取不到,request.session.username is undefined.

这个问题困扰了我3个早上,我排查了各种可能:

我不清楚session存在内存中是否有问题,那时候我还没有跑Express session的官方sample,后来在官方sample的代码中,我得知这个是不会有问题的。在这之前,我尝试过使用redis去存储session,后来我认为使用数据库太重量了不可接受接,所以放弃了。

我怀疑过是否是query的ajax请求方式没有将session中的cookie传递到后台,通过谷歌(感谢谷歌)我发现了cookie属性path,如果设置为了/,那么所有请求都会发送这个cookie,通过抓包也看到了有cookie。

由于client有发送,但是服务端没有接收到,我的逻辑中有请求跳转,是否是跳转后session被重置了?我就开始观察每个请求的session,通过打印出每个请求的session信息,终于观察到了,每次登录后,都是一个空的session将之前产生的session覆盖了:

sessionStore:
{ sessions:
{ 'c+bFzYy2z23b8b3Wa+fV6nCO': '{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"}}',
fk8DJoqGwOyrQ4jiFfWu4hry: '{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"},"username":"Lucy"}',
'sJJycHWSy+JANARqVUw4Jhl0': '{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"}}',

那么可以肯定是请求哪里出问题了,session被覆盖了。通过搜索,发现有一个说法是Express框架中的请求favicon功能导致的,需要通过增加app.use(express.favicon());代码来解决。我尝试了,可是还是不行。

我对request.session.regenerate( function(){方法一直没有底,于是不重新构造session,直接赋值,发现问题解决了。

后来我将app.use(express.favicon());删除之后,还是没问题,这个就比较奇怪了,因为我最开始就有尝试过不使用request.session.regenerate( function(){,但是没生效。但是我认为是缓存的问题,因为浏览器上的favicon自从我使用了app.use(express.favicon());代码之后,就一直没有换过,说明没有去重新更新favicon。

但是我在sample代码中增加了request.session.regenerate( function(){方法,也没有使用app.use(express.favicon());方法,但是也不会有问题。我怀疑是类似多线程问题,如果请求多一些,可能会有问题。

这个问题,我最终的建议是:使用app.use(express.favicon());方法,给session赋值的时候,不要使用request.session.regenerate( function(){方法重建session。

Underscore.js框架中sortBy逆序理解实例

www.111cn.net 编辑:edit02_lz 来源:转载
Underscore一个JavaScript实用库,提供了一整套函数式编程的实用功能,但是没有扩展任何JavaScript内置对象。现在我们来讲讲Underscore.js中sortBy逆序。

Underscore.js中有个sortBy函数,可以支持数组和对象按照某一个字段的排序:

 代码如下 复制代码
var ret = _.sortBy([5, 2, 3, 4, 1],
function(num) {
    return num;
}); >> [1, 2, 3, 4, 5]


但是如果要进行逆序显示的话,underscore.js还没透明的支持reverse操作.这里其实可以借用对要排序的元素取负

 代码如下 复制代码
var ret = _.sortBy([5, 2, 3, 4, 1],
function(num) {
    return - num;
}); >> [5, 4, 3, 2, 1]


这样就可以很方便得实现逆序操作.

sortBy的强大之处在于对于对象其中某个元素的排序,如:

 代码如下 复制代码
var ret = _.sortBy([{
    name: "提",
    index: 2
},
{
    name: "琴",
    index: 1
},
{
    name: "疯",
    index: 4
},
{
    name: "之",
    index: 3
}],
function(data) {
    return - data.index;
}); >> [{
    name: '疯',
    index: 4
},
{
    name: '之',
    index: 3
},
{
    name: '提',
    index: 2
},
{
    name: '琴',
    index: 1
}]


可能我的语言表达能力有限啊,说prototype.js 的 sortBy的时候硬是不知怎么用文字表达为好.
害得大家那么辛苦看我写的解说代码,实在是不好意思!

相关内容

    暂无与此文章相关内容