Cara Menampilkan Peringkat Alexa Di Website Atau Blogger

Peringkat alexa adalah sebuah web yang berfungsi untuk menampilkan peringkat website kita di seluruh dunia. Kamu bisa mengunjungi situs ini di www.alexa.com/siteinfo. Masukkan nama domainmu lalu tekan 'Run Analysis'. Tapi, kali ini maskoding ingin memberikan sebuah script scrapping peringkat alexa menggunakan javascript. Script ini dapat menampilkan peringkat alexa web tanpa harus mengunjungi situs official alexa tersebut.



Disini maskoding akan membagikan 2 jenis script yang dapat kamu gunakan yaitu script tanpa framework (Pure Javascript) dan Script dengan framework (Jquery). Berikut ini Script tersebut.



Script Scrapping Peringkat Alexa Tanpa Framework (Pure Javascript) :

<script>
var dataHasil = 0;
function checkAlexa(url) {
    fetch(`https://api.allorigins.win/get?url=${encodeURIComponent('https://www.alexa.com/siteinfo/'+url)}`)
        .then(response => {
            if (response.ok) return response.json()
            throw new Error('Network response was not ok.')
        }).then(function (data) {
            if (data.contents.split(`"global": `)[1].split(',')[0] == 'false') {
                dataHasil = 0;
                getDataHasil(dataHasil);
            } else {
                dataHasil = Number(data.contents.split(`"global": `)[1].split(',')[0]);
                getDataHasil(dataHasil);
            };
        });
};
function getDataHasil(dataHasil) {
    //------Masukkan Fungsi Di Sini ----------------------
    alert('Alexa Ranking : ' + dataHasil)
    //----------------------------------------------------
};
</script>



Script Scrapping Peringkat Alexa Dengan Framework (Jquery) :

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js'></script>
<script>
var dataHasil = 0;

function checkAlexa(url) {
    $.ajax({
        url: 'https://api.allorigins.win/get?url=' + encodeURIComponent('https://www.alexa.com/siteinfo/' + url),
        type: 'GET',
        success: function (data) {
            if (data.contents.split(`"global": `)[1].split(',')[0] == 'false') {
                dataHasil = 0;
                getDataHasil(dataHasil);
            } else {
                dataHasil = Number(data.contents.split(`"global": `)[1].split(',')[0]);
                getDataHasil(dataHasil);
            };
        },
        error: function (data) {
            getDataHasil('error')
        },
    });
};

function getDataHasil(dataHasil) {
    //------Masukkan Fungsi Di Sini ----------------------
    alert('Alexa Ranking : ' + dataHasil)
    //----------------------------------------------------
};
</script>


Untuk menjalankan script ini, kamu harus menggunakan code berikut :

checkAlexa('www.maskoding.com');

Untuk mencoba script ini, Silahkan ganti url yang saya beri warna kuning dengan alamat link web kamu dan tunggu beberapa saat.

Bagaimana Cara Kerja Script ini, simak penjelasan berikut.

Cara Kerja Script Scrapping Peringkat Alexa

Mula-mula script ini akan melakukan request url untuk mengambil DOM HTML melalui fungsi Ajax() atau fungsi fech(). Setelah DOM HTML di dapatkan, maka DOM HTML akan di scrap menggunakan fungsi split(). Fungsi split() ini berfungsi untuk mengkikis DOM HTML untuk mendapatkan bagian DOM tertentu, dalam hal ini adalah nilai peringkat alexa tersebut.

Setelah bagian DOM di dapatkan, maka DOM ini akan ditampilkan menggunakan fungsi alert() sehingga akan muncul pop up yang menampilkan nilai peringkat dari web yg kita inginkan. Kamu juga dapat memodifikasi script di atas dengan kreasi kamu sendiri.