I have to create a web tracking pixel like facebook pixel, glami pixel etc

Question

I need to create a web tracking pixel like Facebook pixel, glami pixel, etc

Tried cross-domain connection and worked:

• laravel domain1: header('Access-Control-Allow-Origin', '*')
• laravel fake shop: js XMLHttpRequest

So far I have:

<script>

let request = obj => {
    return new Promise((resolve, reject) => {
        // ajax code found on internet
    });
};

function test() {
    request({url: 'http://localhost/pixel/test'})
        .then(r => {
            console.log(r); // works
        });
}

</script>

And I want something like:

<!-- {Foo} piXel for {domainName}-->
<script>
(function(p, a, r, a, m, s) {f['FooTrackerObject'] = i;
f[i]=f[i]||function(){(f[i].q=f[i].q||[]).push(arguments)};o=a.createElement(s),
n=a.getElementsByTagName(s)[0];o.async=1;o.src=h;n.parentNode.insertBefore(o,n)
})(window, document, 'script', 'foohost/js/compiled/pt.js', 'foo');

foo('create', 'RandomStringGeneratedForUsers', 'ro');
foo('track', 'PageView');
</script>
<!-- End Foo piXel -->

Also is this link helpful?: https://github.com/dockwa/openpixel

Answer 1

Solved my own problem:

    /**
     * @test track('PageView', {foo: 'bar'});
     */
    !function(a, u, d, i, o, t, e, k) {t='PixelTrack';o=[];
        a['track']=(...f)=>{o.push(f)};e=u.createElement('script');
        e.async=true;e.src = d;u.getElementsByTagName('head')[0].appendChild(e);
        e.onload=()=>{a[t](i);o.forEach((item)=>{a[t](item)})};
    }(window, document, 'http://www.domain.cr/js/pixel.js', 'INSERT_YOUR_API_KEY_HERE');

//    (function(a, u, d, i, o, t, e, k) {
//        e = 'PixelTrack';
//        t = [];
//        a['track'] = function(...f){
//            t.push(f);
//        };
//
//        k = document.createElement(d);
//        k.async = true;
//        k.src = i;
//
//        k.onload = function() {
//            a[e](o);
//            t.forEach((item) => {
//                a[e](item)
//            })
//        };
//
//        u.getElementsByTagName("head")[0].appendChild(k);
//
//    })(window, document, 'script', 'http://www.domain.cr/js/pixel.js', 'INSERT_YOUR_API_KEY_HERE');

And in pixel.js is laravel mix of something like:

window.PixelTrack = function(params){ console.log('do stuff') }