اولین برنامه خود را ایجاد کنید

این آموزش شما را در ایجاد اولین برنامه Chrome خود راهنمایی می کند. برنامه‌های Chrome مشابه برنامه‌های افزودنی ساختار یافته‌اند، بنابراین توسعه‌دهندگان فعلی روش‌های مانیفست و بسته‌بندی را تشخیص می‌دهند. وقتی کارتان تمام شد، فقط باید یک فایل زیپ از کد و دارایی های خود تهیه کنید تا برنامه خود را منتشر کنید .

یک برنامه Chrome حاوی این اجزا است:

  • مانیفست به Chrome درباره برنامه شما، چیستی، نحوه راه‌اندازی و مجوزهای اضافی که نیاز دارد، می‌گوید.
  • اسکریپت پس‌زمینه برای ایجاد صفحه رویداد مسئول مدیریت چرخه حیات برنامه استفاده می‌شود.
  • همه کدها باید در بسته برنامه Chrome گنجانده شوند. این شامل ماژول های HTML، JS، CSS و Native Client است.
  • تمام نمادها و سایر دارایی ها نیز باید در بسته گنجانده شوند.

مرحله 1: مانیفست را ایجاد کنید

ابتدا فایل manifest.json خود را ایجاد کنید ( فرمت‌ها: Manifest Files این مانیفست را با جزئیات شرح می‌دهد):

{
  "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" }
}

مرحله 2: اسکریپت پس زمینه را ایجاد کنید

سپس یک فایل جدید به نام background.js با محتوای زیر ایجاد کنید:

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

در کد نمونه بالا، رویداد onLaunched زمانی که کاربر برنامه را راه اندازی می کند فعال می شود. سپس بلافاصله پنجره ای را برای برنامه با عرض و ارتفاع مشخص باز می کند. اسکریپت پس‌زمینه شما ممکن است شامل شنونده‌ها، پنجره‌ها، پیام‌های پست و داده‌های راه‌اندازی اضافی باشد که همگی توسط صفحه رویداد برای مدیریت برنامه استفاده می‌شوند.

مرحله 3: یک صفحه پنجره ایجاد کنید

فایل window.html خود را بسازید:

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

مرحله 4: آیکون ها را ایجاد کنید

این نمادها را در پوشه برنامه خود کپی کنید:

مرحله 5: برنامه خود را راه اندازی کنید

فعال کردن پرچم ها

بسیاری از APIهای Chrome Apps هنوز آزمایشی هستند، بنابراین باید APIهای آزمایشی را فعال کنید تا بتوانید آنها را امتحان کنید:

  • به chrome://flags بروید.
  • «APIs Experimental Extension» را پیدا کنید و روی پیوند «فعال کردن» آن کلیک کنید.
  • کروم را مجددا راه اندازی کنید.

برنامه خود را بارگیری کنید

برای بارگیری برنامه، صفحه مدیریت برنامه‌ها و برنامه‌های افزودنی را با کلیک کردن روی نماد تنظیمات Chrome و انتخاب ابزارها > برنامه‌های افزودنی باز کنید.

مطمئن شوید که چک باکس Developer mode انتخاب شده است.

روی دکمه Load unpacked extension کلیک کنید، به پوشه برنامه خود بروید و OK را کلیک کنید.

تب جدید را باز کنید و راه اندازی کنید

هنگامی که برنامه خود را بارگیری کردید، یک صفحه برگه جدید باز کنید و روی نماد برنامه جدید خود کلیک کنید.

یا از خط فرمان بارگیری و راه اندازی شود

این گزینه‌های خط فرمان در Chrome ممکن است به شما در تکرار کردن کمک کند:

  • --load-and-launch-app=/path/to/app/ برنامه unpacked را از مسیر داده شده نصب و راه اندازی می کند. اگر برنامه از قبل در حال اجرا باشد، با محتوای به روز شده مجدداً بارگیری می شود.
  • --app-id=ajjhbohkjpincjgiieeomimlgnll برنامه ای را راه اندازی می کند که قبلاً در Chrome بارگذاری شده است. هیچ برنامه‌ای که قبلاً در حال اجرا بود را مجدداً راه‌اندازی نمی‌کند، اما برنامه جدید را با محتوای به‌روزرسانی شده راه‌اندازی می‌کند.