Chrome Extensions: Pierwsze kroki

Posted on by admin

Oto moje pierwsze rozszerzenie do Google Chrome. API stworzone przez Google jest bardzo proste, daje dostęp do interfejsu przeglądarki, jak i przeglądanej strony. Konfiguracja naszego rozszerzenia “siedzi” w manifest.json, a reszta właściwie sprowadza się do pisania kodu w HTML i JavaScript. Prościutkie rozszerzenie poniżej ściąga aktualny wykres indeksu WIG20 z zewnętrznej witryny w postaci obrazka i wyświetla jako popup.

manifes.json:

{
  "name": "Wig20",
  "version": "1.0.1",
  "description": "Dzienny wykres indeksu WIG20",
  "browser_action": {
    "default_icon": "images/icon.png",
    "default_title": "Wig20",
    "popup": "popup.html"
  }
}

popup.html:

1
2
3
4
5
6
7
8
9

<body>
<script type="text/javascript">
var now = new Date();
var d = now.getTime();
var img = document.createElement("img");
img.src = "http://static1.money.pl/i/c/wig20_online_b.png?dummy="+d;
document.body.appendChild(img);
</script>
</body>

Kod tego rozrzerzenia to zaledwie te 2 pliki plus jeden obrazek – ikonka.

Rozszerzenie Wig20 dostępne tutaj. Więcej na ten temat tworzenia rozszerzeń do przeglądarki Chrome tutaj.

Leave a Reply