1. BOM Navigator trong Javascript là gì?

Bom Navigator được dùng để kiểm tra các thông tin về người dùng như trình duyệt đang sư dụng là gì? Hệ điều hành đang sử dụng là gì? Trình duyệt có bật cookie hay không? Hay thậm chí có thể kiểm tra được tên và version của Browser. Navigator cũng là một thuộc tính của window nên nó có cú pháp tương tự như location hay history .

Cú pháp :

window.navigator;
// hoặc
navigator;

Một số thuộc tính của navigator như:

  • appVersion : Trả về phiên bản trình duyệt của người dùng
  • userAgent : Trả về agent , gần giống với appVersion
  • cookieEnabled : Kiểm tra cookie có bật hay không, trả về true hoặc false
  • appName : Trả về tên của trình duyệt
  • appCodeName : Trả về tên mã code của trình duyệt
  • product : Trả về engine của trình duyệt
  • platform : Kiểm tra hệ điều hành
  • language : Kiểm tra ngôn ngữ của trình duyệt

Ta có thể console.log(navigator); để tìm thêm các thuộc tính và phương thức của navigator

2. Kiểm tra cookie với JavaScript

Để kiểm tra trình duyệt có bật Cookie hay không thì ta sử dụng thuộc tính navigator.cookieEnabled . Nó trả về giá trị boolean True nếu cookie được bật và False nếu cookie bị tắt.

Ví dụ:

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
"navigator.cookieEnabled is " + navigator.cookieEnabled;
</script>

3. Kiểm tra tên và phiên bản trình duyệt với JavaScript

Ta có thể sử dụng navigator để kiểm tra nhiều thông tin liên quan đến trình duyệt như:

  • appName – Trả về tên ứng dụng của trình duyệt
  • appCodeName – Trả về tên mã của trình duyệt
  • userAgent – Trả về chuỗi tác nhân người dùng cho trình duyệt hiện tại. Nó bao gồm tất cả thông tin liên quan đến trình duyệt và hệ điều hành
  • product – Trả về tên sản phẩm của công cụ trình duyệt

Ví dụ:

<h2>Sử dụng thuộc tính của Navigator để lấy thông tin trình duyệt.</h2>
<p id="output"></p>
<button onclick="check()">Kiểm tra</button>

<script>
  function check() {
    var appname = navigator.appName;
    var appcodename = navigator.appCodeName;
    var user_agent = navigator.userAgent;
    document.getElementById("output").innerHTML = "Tên ứng dụng : " + appname + "<br> Tên mã ứng dụng : " + appcodename + "<br> Thông tin cá nhân người dùng : "+ user_agent;
  }
</script>

Sử dụng product

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
"navigator.product is " + navigator.product;
</script>

Chú ý

  • Với appName : Netscape là tên ứng dụng cho cả IE11, Chrome, Firefox và Safari.
  • Với appCodeName : Mozilla là tên mã ứng dụng cho cả Chrome, Firefox, IE, Safari và Opera.
  • Với userAgent để kiểm tra phiên bản trình duyệt đôi lúc sẽ trả về kết quả sai lệch, nên việc kiểm tra này được khuyến cáo không nên sử dụng nếu cần độ chính xác tuyệt đối.
  • Với product : Gecko là dạng tên sản phẩm được hầu hết trình duyệt trả về

4. Kiểm tra ngôn ngữ với JavaScript

Để lấy ngôn ngữ của một trang web, ta sử dụng thuộc tính language của đối tượng navigator . Trong khi có một thuộc tính khác là languages trả về giá trị trong mảng.

Ví dụ:

<p id="output"></p>
<button onclick="check()">Check</button>

<script>
  function check() {
    var lang = navigator.language;
    var langs = navigator.languages;
    document.getElementById("output").innerHTML = "navigator.language - " + lang + "<br> navigator.languages : <br>";
    for (let i = 0; i < langs.length; i++) {
      document.getElementById("output").innerHTML += langs[i] + "<br>";
    }
  }
</script>

5. Kiểm tra hệ điều hành và phiên bản trình duyệt với JavaScript

Js cũng có thể xem hệ điều hành mà người dùng đang sử dụng bằng cách sử dụng thuộc tính platform .

Ví dụ:

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
"nền tảng điều hướng là " + navigator.platform;
</script>

Để kiểm tra Version của trình duyệt ta sử dụng thuộc tính appVersion hoặc userAgent

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = navigator.appVersion;
</script>

6. Kiểm tra trực tuyến với JavaScript

Chúng ta có thể kiểm tra trạng thái kết nối internet của trình duyệt và có thể biết trình duyệt đang trực tuyến hay ngoại tuyến. Để kiểm tra trạng thái trực tuyến của việc sử dụng trình duyệt ta sử dụng navigator.online . Nó trả về giá trị boolean . Sẽ là True nếu người dùng trực tuyến và False nếu người dùng ngoại tuyến.

Ví dụ:

<p id="output"></p>
<button onclick="check()">Check</button>

<script>
  function check(){
    var onlineStatus = navigator.onLine;
    if (onlineStatus) {
      document.getElementById("output").innerHTML = "Browser is online";
    }
    else {
      document.getElementById("output").innerHTML = "Browser is offline";
    }
  }
</script>

7. Kiểm tra Java với JavaScript

Phương thức javaEnabled() có tác dụng kiểm tra xem trình duyệt có đang bật java không(ở đây không phải là Js)? Nó sẽ trả về True nếu có, và ngược lại Flase nếu không.

Ví dụ:

<div>Click vào button để xem kết quả</div>
<button type="button" onclick="getInfo()">Click</button>
<p id="results"></p>
<script type="text/javascript">
    function getInfo() {
        var app = navigator.javaEnabled();
        if(app){
            data = 'Trình duyệt có bật java';
        } else {
            data = 'Trình duyệt không bật java';
        }
        document.getElementById('results').innerHTML = data;
    }
</script>