2014-09-18 14 views
5

Tôi gặp sự cố với tab trùng lặp trên Chrome (công cụ của phiên) và tôi muốn tránh hành động sao chép các tab (hoặc thiếu các tab trùng lặp). Tôi đang mở tab vì nó là một cửa sổ bật lên, không có thanh địa chỉ, không có thanh trạng thái và không có gì, chỉ là cửa sổ. Không có cách nào để sao chép một tab (được mở dưới dạng cửa sổ bật lên) trong IE và Firefox (ít nhất là tôi đã tìm thấy một tab), nhưng trong chrome vẫn có thể.Cách nhận biết khi tab trình duyệt bị trùng lặp

I also know I'm not able to programmatically check if there's an already open duplicated tab

Bất kỳ ý tưởng nào để tiếp cận điều này?

cảm ơn!

Trả lời

8

Goal

Chỉ cần làm rõ: Mục đích là để là để phát hiện (và đóng) một tab đó đã được mở thông qua Chrome "Duplicate" tùy chọn menu chuột phải.

Trước tiên hãy thử

Các tab "Duplicate" hành động công trình gần như chính xác như khi tải lại trang sau khi người dùng đã nhấp "Back", sau đó "Forward", vì vậy bạn về cơ bản thực hiện một phiên bản của this question:

function onLoad() 
{ 
    if ($('#myStateInput').val() === '') // Load with no state. 
     $('#myStateInput').val('already loaded'); // Set state 
    else 
     alert("Loaded with state. (Duplicate tab or Back + Forward)"); 
} 

Thats tuyệt vời và tất cả, nhưng bạn chỉ muốn phát hiện khi bạn "tab trùng lặp". Để thực hiện việc này, chúng tôi có thể xóa trạng thái trong onbeforeunload. Điều này hoạt động vì onbeforeunload chỉ được gọi khi người dùng nhấp vào "Quay lại" hoặc "Chuyển tiếp" nhưng không được gọi khi nhân đôi tab.

Second thử

function onLoad() 
{ 
    if ($('#myStateInput').val() === '') // Load with no state. 
     $('#myStateInput').val('already loaded'); // Set state 
    else 
     alert("Duplicate tab! Do something."); 

    $(window).on('beforeunload', function() // Back or Forward buttons 
    { 
     $('#myStateInput').val(''); // Blank the state out. 
    }); 
} 
+0

cảm ơn, đã hoạt động! – robert

+0

Xin chào @JosiahDaniels, điều này dường như làm việc tuyệt vời với Chrome, nhưng khi tôi đã thử nghiệm nó trong IE10 cảnh báo đã không xuất hiện, bạn có biết nếu có một workaround cho IE? Tôi sẽ tiếp tục làm việc, trong trường hợp tôi giải quyết nó, tôi sẽ trả lời ở đây, liên quan đến – maxivis

+2

@maxivis Nút sao chép của IE thực hiện tương đương với việc sao chép url, mở một tab mới và dán. Không có dữ liệu biểu mẫu nào được giữ nguyên. Khác với hack thực sự xấu xí bằng cách sử dụng cookie, tôi không thấy một cách tốt để xử lý này. – JosiahDaniels

1

Ứng dụng của tôi đòi hỏi mà người dùng chỉ có thể đăng ký vào một lần vì vậy tôi có thể sử dụng như localStorage hồ sơ đáng tin cậy cache. Ký hiệu này sử dụng các cờ localStorage để thực thi yêu cầu này và sử dụng window.name để biết người dùng nào sở hữu tab.

Vấn đề ở chỗ là cơ sở tab trùng lặp của trình duyệt đã làm sai lệch việc thực thi. Mã bên dưới buộc trang đăng nhập xuất hiện trong tab trùng lặp nếu chúng trùng lặp với phiên đã ký.

Giải pháp này đã được thử nghiệm trong Chrome. Nó sử dụng thực tế là một tab trùng lặp không có tên. Đặc tính này có thể không tồn tại trong tất cả các trình duyệt.

Chức năng ngăn chặnDuplicateTab được gọi rất sớm trong chuỗi tải trang.

/* This prevents users from duplicating the tab. If they do it 
* triggers the start page which checks for duplicate userid 
*/ 
function preventDuplicateTab() { 
    if (sessionStorage.createTS) { 
    // Chrome at least has a blank window.name and we can use this 
    // signal this is a duplicated tab. 
    console.log("Existing sessionStorage "+sessionStorage.createTS+" 
       w.name="+window.name); 
    if (!window.name) { 
     window.name = "*ukn*"; 
     sessionStorage.createTS = Date.now(); // treat as new 
     window.location = "/res/Frame.htm?page=start.htm"; // force to 
                   signon screen 
    } 
    } else { 
    sessionStorage.createTS = Date.now(); 
    console.log("Create sessionStorage "+sessionStorage.createTS+" 
            w.name="+window.name); 
    } 
} 
0

Nếu bạn muốn ngăn chặn nhiều tab (lặp lại hay không), bạn có thể sử dụng một sự kết hợp của các câu trả lời được chấp nhận ở đây, và một trong những giải pháp cho câu hỏi này: https://stackoverflow.com/a/11008432/1257546

Tôi biết rằng tôi giải pháp, với lưu trữ cục bộ và phiên làm việc cho tôi :-)

Nếu bạn phải phát hiện phiên trong nhiều trình duyệt, bạn sẽ cần giải pháp phía máy chủ.

Các vấn đề liên quan