简体   繁体   中英

Reload tab content in browser

how can I reload specific browser tab content? I search for solution which can not be only in JQuery (I prefer it if there more solution).

I need this:
I have page with a lot of links on another's pages (format of links: http://domain_name.cz/?still_same_text=1_1_1_1_1_1386662409 ; another page has this link: http://domain_name.cz/?still_same_text=1_1_14_1_2_1387231396 etc. everyone links has same format only to 1st number). When I click first time on some link then I load new tab (for this text I say him simply "tab2") if I click again on another link then I reload this "tab2" (= I change url in this "tab2" from current to new => I load new conent in this tab).
Is there some way to do that?

I try solution from this topic but this not work for me and, I mean, I have difficult problem. And I look at solution in this topic, but this is another problem. There is 1 link but I can have more links and there are links in JS but I need generate them in PHP.

I've not done this before, but the question seems interesting. Therefore, if the answers you mentioned did not work then I would try the following concept, it may not be the best, but it's something.

1- Make a tracker on the server (properly in session) to keep track of the pages that the user has opened. So whenever the user open a page, make an ajax request sending the page url with a random generated id number to be stored and checked later. Each tab will get a different id.

2- Add a javascript listener in all pages that keep waiting for commands from the server. Depending on the server response, those listen will do the following:

  • Nothing -> in case the page is opened first time.

  • Close tab -> in case a new tab with same link is opened. So keep the new tab and close the old one. // Or close new one and refresh old one?

  • Update -> update server once tab is opened (directly when the page gets loaded) and just before they get closed , send the page url and current tab id to be check on the server.

  • Keep checking server, if a newer tab with same url is opened, then close current.

I'm not sure if this solution is suitable for you, so I will only write a pseudo code. If it's applicable, then later maybe can improve it a bit.

pseudo code php: tabControl.php

//session array structure 
//when a new tab is added, it will take the following index of current url array. So later we can know which one is 
//$_SESSION["tracker"][ current url  ][ tab id]  newer id will be added to the array in an ascending order, not based on their value, so later we can check which tabId came later. 

$action = $_POST["action"];
$tabId = $_POST["id"];
$tabUrl = $_POST["url"];

if($action === "check")
 { 
    processTab(tabUrl , $tabId);  
 }   
elseif($action === "closing")
 {
    closeTab(tabUrl , $tabId) ; 
 }   

 /*if this a second tab opened with the same url, then echo the previous tab id and command the client to close self. 
  *if this the first tab, then store it in session. 
*/

function  processTab($tabUrl , $tabId)
{
   //if new, then pass it to addTab
  // else, check if there is a newer tab opened, then call closeTab
}

function addTab($tabUrl , $tabId)
{
   // add a new tab associated with tabUrl -> couter -> tabId
}

function  closeTab($tabUrl , $tabId)
{
   //set that $tabUrl with the id to null. 
   //and ask the client to close the tab.  //echo json_encode(array("responce"=>"closeSelf"))
}

And from the client side, you can use something similar to this pseudo code:

//current tab id
var tabId = Math.floor((Math.random()*100)+1); 


    //On exit, just run once before user close the tab/window. 
    $(window).unload(function(){
        $.ajax({
            type: 'POST',
            url: 'tabControl.php',
            async:false,
            data: {"url":window.location.pathname , "action":"closing" , "id":tabId}
        });
    });

// keep checking  periodically 
    function checkTabs()
    {
        //On load, just run once
            $.ajax({
                type: 'POST',
                url: 'tabControl.php',
                data: {"url":window.location.pathname , "action":"check", "id":tabId},
                type:"json",
                success:function(data)  
                        {
                          if(data.responce === "closeSelf")
                               {// if the user detected that there is a newer with this url opened. 
                                  window.close();
                               }
                        }
            }).always(function(){ setTimeout(checkTabs, 1000);});

    }

checkTabs();// to call for the first time. 

Hope this helps.

In fact, this isn't a difficult problem if you use appropriate technology. Controlling specific browser tabs can be done with the browser SDK, which has access to the tab management. JavaScript or PHP themselves cannot access a specific tab because it would be a security breach.

Example for Google Chrome:

Take a look at the chrome.tabs reference. There is many things you can do with tabs including what you are trying to do. For example, a user-friendly way of displaying a link that can control browser tabs would be to use a browser popup (attention, this isn't the same thing as a conventional popup, a browser popup is an "internal" browser-level popup that is suggesting that this specific area may control any part of the browser instead of the current page only ) that contains the links. In that popup, you could have something like this:

Browser popup (HTML):

<a id="myLink" href="http://wwww.google.com">This link will control a new tab</a>

Browser popup (JavaScript):

var tabNumber;
var tabCreated = false;

document.getElementById("myLink").addEventListener("click", function(){
    if (!tabCreated) {
        // create a new tab
        chrome.tabs.create({
            url: this.href
        }, function(tab) {
            tabNumber = tab.id; // return ID of created tab
            tabCreated = true;
        });
    } else {
        // reload the created tab
        chrome.tabs.reload(tabNumber, null);
    }
}, false);

The biggest problem of your specification is that this kind of mechanism must be implemented for each browser separately and requires a plugin installation. If the link is the only browser-level access, you should consider changing its behavior so he can be part of the current page behavior.

Hope this helps! :-)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM