Tạo ứng dụng đầu tiên

Hướng dẫn này sẽ chỉ cho bạn cách tạo Ứng dụng Chrome đầu tiên. Ứng dụng Chrome có cấu trúc tương tự nhau vào tiện ích để các nhà phát triển hiện tại nhận ra tệp kê khai và phương thức đóng gói. Khi bạn hoàn tất, bạn chỉ cần tạo một tệp zip chứa mã và nội dung để xuất bản .

Ứng dụng Chrome chứa các thành phần sau:

  • Tệp kê khai cho Chrome biết về ứng dụng của bạn, nội dung của ứng dụng, cách chạy ứng dụng đó và thông tin bổ sung các quyền mà ứng dụng yêu cầu.
  • Tập lệnh nền được dùng để tạo trang sự kiện chịu trách nhiệm quản lý vòng đời ứng dụng chu kỳ.
  • Tất cả mã phải được bao gồm trong gói Ứng dụng Chrome. Điều này bao gồm HTML, JS, CSS và Native Client các mô-đun.
  • Tất cả biểu tượng và các thành phần khác cũng phải có trong gói.

Bước 1: Tạo tệp kê khai

Trước tiên, hãy tạo tệp manifest.json (Formats: Manifest Files (Định dạng: Tệp kê khai) mô tả tệp kê khai này bằng chi tiết):

{
  "name": "Hello World!",
  "description": "My first Chrome App.",
  "version": "0.1",
  "manifest_version": 2,
  "app": {
    "background": {
      "scripts": ["background.js"]
    }
  },
  "icons": { "16": "calculator-16.png", "128": "calculator-128.png" }
}

Bước 2: Tạo tập lệnh nền

Tiếp theo, hãy tạo một tệp mới có tên là background.js với nội dung sau:

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create('window.html', {
    'outerBounds': {
      'width': 400,
      'height': 500
    }
  });
});

Trong mã mẫu ở trên, sự kiện onLaunched sẽ được kích hoạt khi người dùng khởi động ứng dụng. Nó thì ngay lập tức mở ra một cửa sổ cho ứng dụng có chiều rộng và chiều cao được chỉ định. Lý lịch của bạn tập lệnh có thể chứa trình nghe bổ sung, cửa sổ, thông báo bài đăng và dữ liệu khởi chạy, tất cả đều mà trang sự kiện sử dụng để quản lý ứng dụng.

Bước 3: Tạo trang cửa sổ

Tạo tệp window.html:

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div>Hello, world!</div>
  </body>
</html>

Bước 4: Tạo biểu tượng

Sao chép các biểu tượng sau vào thư mục ứng dụng:

Bước 5: Chạy ứng dụng

Bật cờ

Nhiều API của Ứng dụng Chrome vẫn đang trong giai đoạn thử nghiệm, vì vậy bạn nên bật API thử nghiệm để bạn có thể dùng thử:

  • Truy cập vào chrome://flags.
  • Tìm "API Tiện ích thử nghiệm" và nhấp vào "Bật" .
  • Khởi động lại Chrome.

Tải ứng dụng

Để tải ứng dụng của bạn, hãy hiển thị trang quản lý ứng dụng và tiện ích bằng cách nhấp vào biểu tượng cài đặt Chrome và chọn Công cụ > Tiện ích.

Đảm bảo bạn đã chọn hộp đánh dấu Chế độ nhà phát triển.

Nhấp vào nút Tải tiện ích đã giải nén, điều hướng đến thư mục của ứng dụng rồi nhấp vào OK.

Mở thẻ mới và khởi chạy

Khi bạn đã tải ứng dụng của mình, hãy mở trang Tab mới và nhấp vào biểu tượng ứng dụng mới.

Hoặc tải và khởi chạy từ dòng lệnh

Các tuỳ chọn dòng lệnh này đối với Chrome có thể giúp bạn lặp lại:

  • --load-and-launch-app=/path/to/app/ cài đặt ứng dụng đã giải nén từ đường dẫn nhất định, và sẽ khởi chạy ứng dụng đó. Nếu ứng dụng đang chạy thì ứng dụng sẽ được tải lại với nội dung cập nhật.
  • --app-id=ajjhbohkjpincjgiieeomimlgnll sẽ chạy một ứng dụng đã được tải vào Chrome. Cách này không khởi động lại mọi ứng dụng đã chạy trước đó, nhưng sẽ khởi chạy ứng dụng mới với mọi nội dung cập nhật.