Question

我有一个网络应用程序，使用jQuery AJAX GET请求从我的服务器注入基于服务器的myjavascriptfile.js文件。目前，每次客户访问https://www.google.co.uk时都会调用此GET请求。

但是我希望能够将mysecondjavascriptfile.js文件发送到客户端，如果客户端已经超过https://www.google.co.uk 10次。

你有什么方法可以做到这一点吗？

Answer 1

首先要做的是坚持客户对网站的点击。我认为SessionStorage可以在这里提供帮助：

sessionStorage.counter = ++(sessionStorage.counter) || 0;

var sources = {
    lessThanTen : 'http://yourscript.com/lessthan10hits.js',
    moreThanTen : 'http://yourscript.com/morethan10hits.js'
}
var script = document.createElement('script');

if(sessionStorage.counter >= 10){
    script.src = sources.moreThanTen;
} else {
    script.src = sources.lessThanTen;
}

document.getElementsByTagName('head')[0].appendChild(script);

这当然是对该命中的客户端验证。您可以通过AJAX实现服务器端验证，或者仅在10个请求后提供稍微不同的HTML标记。您需要使用会话（或只是普通的cookie）将它们保存在服务器端。

AJAX验证：

var xhr = new XMLHttpRequest();
xhr.addEventListener('load', function(){
    var script = document.createElement('script');
    script.src = xhr.response;
    document.getElementsByTagName('head')[0].appendChild(script);
});
xhr.open('POST', 'http://www.urltocheckhits.com/hits');
xhr.send('url=' + encodeURIComponent(window.location.hostname));

然后从Node.js（使用body-parser和express-session）：

var sources = {
    lessThanTen : 'http://yourscript.com/lessthan10hits.js',
    moreThanTen : 'http://yourscript.com/morethan10hits.js'
}
app.post('/hits', urlEncoded, function(req, res){
    if(req.body){
        var url = req.body.url;
        if(!req.session.views){
           req.session.views = { };
        }
        if(req.session.views[url]){
            req.session.views[url]++;
        } else {
            req.session.views[url] = 1; 
        }

        if(req.session.views[url] > 10){
            res.send(sources.moreThanTen);
        } else {
            res.send(sources.lessThanTen);
        }
    }
});

我建议您查看Jon Saffron和express-session的文档。

请注意，您需要为此添加CORS标头（您可以轻松地使用JSONP而不是使用XHR）。

如果您只是提供JS文件而不是执行AJAX调用然后包含返回的脚本，那么可能会更容易。那么你可以只是：

<script src="http://onesingleurl.com/hits">

缓存会像这样表现得很奇怪，这就是为什么我喜欢其他方法。

根据客户端访问URL的次数，从服务器提供不同的JS文件？

1 个答案: