Как отображать в адресной строке табы bootstrap?

if (location.hash !== '') {
    $('.nav-tabs a[href="' + location.hash.replace('tab_','') + '"]').tab('show');
} else {
    $('.nav-tabs a:first').tab('show');
}

$('.nav-tabs a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
      window.location.hash = 'tab_'+  e.target.hash.substr(1) ; 
      return false;
});

// Расширяем JQuery для получения GET параметров с URL
$.extend({
    getUrlVars: function(){
        var vars = [], hash;
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
        for(var i = 0; i < hashes.length; i++)
        {
            hash = hashes[i].split('=');
            vars.push(hash[0]);
            vars[hash[0]] = hash[1];
        }
        return vars;
    },
    getUrlVar: function(name){
        return $.getUrlVars()[name];
    }
});

// Если присутствует $_GET['act'] активируем вкладку с нужным идентификатором
$(function () {
    if (typeof $.getUrlVar('act') != 'undefined')
        if (typeof $('a[href="#' + $.getUrlVar('act') + '"]') != 'undefined')
            $('a[href="#' + $.getUrlVar('act') + '"]').tab('show');
});

<div class="btn-group-lg" >
                    <button type="button" class="btn btn-success">
                        <a href="#one" data-toggle="tab"> Первый</a>
                    </button>
                   <button type="button" class="btn btn-success">
                        <a href="#two" data-toggle="tab"> Второй</a>
                    </button>
<div>

<div class="tab-pane active" id="one">Текст 1 вкладки</div> 
<div class="tab-pane" id="two">Текст 2 вкладки</div>

if (location.hash === '#nav-profile') {
                $('#nav-profile-tab').tab('show');
            }
            $('.nav-tabs .nav-link').on('shown.bs.tab', function (e) {
                window.location.hash = $(this).data('bs-target');
            })