Câu hỏi Cách phát hiện xem trình duyệt có hỗ trợ Bộ nhớ cục bộ HTML5 không


Các cảnh báo mã sau ls exist trong IE7:

if(window.localStorage) {
    alert('ls exists');
} else {
    alert('ls does not exist');
}

IE7 không thực sự hỗ trợ lưu trữ cục bộ nhưng điều này vẫn cảnh báo nó. Có lẽ điều này là do tôi đang sử dụng IE9 trong trình duyệt IE7 và các chế độ tài liệu bằng cách sử dụng công cụ phát triển IE9. Hoặc có lẽ đây chỉ là cách sai để kiểm tra xem LS có được hỗ trợ hay không. Cách đúng là gì?

Ngoài ra tôi không muốn sử dụng Modernizr vì tôi chỉ sử dụng một vài tính năng HTML5 và tải một tập lệnh lớn không đáng để phát hiện hỗ trợ cho vài thứ đó.


76
2018-06-26 19:14


gốc


Có thể trùng lặp Kiểm tra HTML 5 localStorage - BuZZ-dEE


Các câu trả lời:


Bạn không cần phải sử dụng modernizr, nhưng bạn có thể sử dụng phương pháp của họ để phát hiện localStorage được hỗ trợ

modernizr tại github
kiểm tra cho localStorage

// In FF4, if disabled, window.localStorage should === null.

// Normally, we could not test that directly and need to do a
//   `('localStorage' in window) && ` test first because otherwise Firefox will
//   throw bugzil.la/365772 if cookies are disabled

// Also in iOS5 & Safari Private Browsing mode, attempting to use localStorage.setItem
// will throw the exception:
//   QUOTA_EXCEEDED_ERRROR DOM Exception 22.
// Peculiarly, getItem and removeItem calls do not throw.

// Because we are forced to try/catch this, we'll go aggressive.

// Just FWIW: IE8 Compat mode supports these features completely:
//   www.quirksmode.org/dom/html5.html
// But IE8 doesn't support either with local files

Modernizr.addTest('localstorage', function() {
    var mod = 'modernizr';
    try {
        localStorage.setItem(mod, mod);
        localStorage.removeItem(mod);
        return true;
    } catch(e) {
        return false;
    }
});

cập nhật với mã nguồn hiện tại


88
2018-06-26 19:18



Thêm vào var mod = "test"; trước khối try-catch, nếu không thì điều này sẽ luôn thất bại vì mod không được xác định ở đó. - Mahn
Bạn đúng. Tôi vừa sao chép nguồn từ modernizr và dựa vào tính chính xác của nó ... - Andreas
điều này có thể thất bại nếu không còn chỗ trống trong localstorage. - Patrick
@Patrick cách để được rằng anh chàng ...: P - contactmatt
Thành thật mà nói, đây không phải là thử nghiệm tốt nhất bởi vì nếu bộ nhớ cục bộ vừa đầy? localStorage có thể được hỗ trợ, nhưng chỉ trong trạng thái mà bạn không thể thêm vào. - DemiImp


if(typeof Storage !== "undefined")
  {
  // Yes! localStorage and sessionStorage support!
  // Some code.....
  }
else
  {
  // Sorry! No web storage support..
  }

36
2018-06-26 19:15



typeof(Storage) !== void(0) là giải pháp tốt hơn - Petja Touru
@petjato nó thực sự nên là if (Storage !== void(0)) - Andrew Anthony Gerst
typeof không phải là một hàm, một toán tử ngôn ngữ của nó. tại sao dấu ngoặc đơn? - r3wt
Đây dường như là một biến thể nhỏ của những gì được tìm thấy trên W3Schools trang mạng. Nó cũng có vẻ không hoạt động. - fujiiface
Chế độ duyệt web riêng tư trong Safari không hỗ trợ ghi vào localStorage, nhưng kiểm tra này trả về true cho trường hợp đó. Giải pháp của Andreas xử lý trường hợp này. - Deepak Joy


Ngoài ra tôi không muốn sử dụng Modernizr vì tôi chỉ sử dụng một vài HTML5   các tính năng và tải một tập lệnh lớn không đáng để phát hiện   hỗ trợ cho vài điều đó.

Để giảm kích thước tệp Modernizr, hãy tùy chỉnh tệp tại http://modernizr.com/download/ để phù hợp với nhu cầu của bạn. Phiên bản ModernStorage chỉ của Modernizr có giá trị 1,55KB.


15
2018-04-01 14:16



Xin chào, chào mừng bạn đến với Stack Overflow! Điều này thực sự có vẻ giống như nó phải là một bình luận chứ không phải là câu trả lời với câu hỏi ban đầu. Tôi nhận ra bạn chưa thể bình luận, nhưng đạt tới 50 đại diện không khó hay tốn thời gian. - Jesse
bạn có thể làm điều đó - chỉ có thêm 9 đại diện nữa! ok Tôi upvoted vì vậy bây giờ bạn có 51 - Simon_Weaver
Tôi nhận ra 1.55kb là không có gì, nhưng nó vẫn có vẻ như overkill chỉ để kiểm tra hỗ trợ localStorage. - Tyler Biscoe


Chức năng này hoạt động tốt:

function supports_html5_storage(){
    try {
        return 'localStorage' in window && window['localStorage'] !== null;
    } catch(e) {
        return false;
    }
}

Nguồn: www.diveintohtml5.info


13
2017-08-15 10:02



Nó đã qua một thời gian dài. và tôi biết, đó là câu trả lời hay nhất kể từ khi tôi đọc cuốn sách. Bởi câu hỏi của tôi là lý do tại sao chúng tôi đang kiểm tra một điều hai lần để được NULL? - Ali Saberi
Tôi nghĩ là người đầu tiên 'localStorage' in window kiểm tra xem thuộc tính có tồn tại trong đối tượng cửa sổ (không phải là 'không xác định') hay không và thuộc tính thứ hai window['localStorage'] !== null kiểm tra xem thuộc tính đó có phải là NULL không. - juanra
Điều đó không thể đạt được bằng cách thực hiện kiểm tra bình đẳng không nghiêm ngặt của cửa sổ ['localStorage'] == null? Điều đó bao gồm cả kiểm tra không xác định và null. - Triynko
Tôi đoán vậy. Nếu bạn kiểm tra ´window ['something'] == null ', kết quả là "true", ngay cả khi nó không được xác định. Tuy nhiên tôi sẽ chọn phương pháp đầu tiên vì mục đích rõ ràng. - juanra


Thử window.localStorage!==undefined:

if(window.localStorage!==undefined){
    //Do something
}else{
    alert('Your browser is outdated!');
}

Bạn cũng có thể dùng typeof window.localStorage!=="undefined", nhưng tuyên bố ở trên đã làm điều đó


8
2018-06-26 19:15



Safari có thể có localStorage nhưng truyền một lỗi nếu ở chế độ riêng tư (QuotaExceededError) để tr / catch là lựa chọn tốt nhất IMHO - Endless
Hm, tôi không biết điều đó. Nhưng nó chỉ ném lỗi khi cố gắng viết những thứ, đúng không? - Danilo Valente
Đúng vậy - Endless
Trên thực tế, việc kiểm tra đơn thuần thuộc tính window.localStorage (như trong ví dụ này) sẽ gây ra lỗi khi Safari được thiết lập để chặn cookie và dữ liệu trang web. Đặc biệt: SecurityError: DOM Exception 18: An attempt was made to break through the security policy of the user agent. - Aaronius
Chế độ duyệt web riêng tư trong Safari không hỗ trợ ghi vào localStorage, nhưng kiểm tra này trả về true cho trường hợp đó. Giải pháp của Andreas xử lý trường hợp này. - Deepak Joy


Tôi không thấy nó trong các câu trả lời, nhưng tôi nghĩ rằng bạn có thể dễ dàng sử dụng vani JS hoặc jQuery cho các bài kiểm tra đơn giản như vậy, và trong khi Modernizr giúp rất nhiều, có những giải pháp sạch sẽ mà không có nó.

Nếu bạn dùng jQuery, bạn có thể làm:

var _supportsLocalStorage = !!window.localStorage
    && $.isFunction(localStorage.getItem)
    && $.isFunction(localStorage.setItem)
    && $.isFunction(localStorage.removeItem);

Hoặc, với Vanilla nguyên chất JavaScript:

var _supportsLocalStorage = !!window.localStorage
    && typeof localStorage.getItem === 'function'
    && typeof localStorage.setItem === 'function'
    && typeof localStorage.removeItem === 'function';

Sau đó, bạn chỉ cần làm một IF để kiểm tra sự hỗ trợ:

if (_supportsLocalStorage) {
    console.log('ls is supported');
    alert('ls is supported');
}

Vì vậy, toàn bộ ý tưởng là bất cứ khi nào bạn cần các tính năng JavaScript, trước tiên bạn sẽ kiểm tra đối tượng cha mẹ và sau đó là các phương thức mà mã của bạn sử dụng.


6
2017-07-26 20:52





Hãy thử bắt sẽ thực hiện công việc:

    try{
       localStorage.setItem("name",name.value);
       localStorage.setItem("post",post.value);
       }
    catch(e){
       alert(e.message);    
       }

3
2017-08-10 09:02





Thử:

if(typeof window.localStorage != 'undefined') {
}

1
2018-06-26 19:16





if (window.localStorage){

   alert('localStorage is supported');
   window.localStorage.setItem("whatever", "string value");

}

1
2017-08-13 08:44



Câu trả lời hay nhất ở đây bằng nhảy vọt - alex bennett