Changes between Version 3 and Version 4 of jazz/Chrome_Apps

Timestamp:

Mar 12, 2012, 8:53:46 AM (14 years ago)

Author:

jazz

Comment:

--

jazz/Chrome_Apps

@@ -21 +21 @@
 
  * DEBUG: 在 Firefox 常用 Firebug 進行除錯，在 Google Chrome 上的話，就可以用[http://code.google.com/intl/zh-TW/chrome/devtools/docs/overview.html Google Chrome Developer Tools]，最好學一下它的使用方法。
+
+== 2012-03-11 ==
+
+ * [參考] [http://www.vikitech.com/2398/create-chrome-web-apps How To Create Your Own Chrome Web Apps]
+ * [小目標] 嘗試做一個 hadoop.nchc.org.tw 的 Chrome App，根據定位應該比較偏向「[http://code.google.com/chrome/apps/docs/developers_guide.html 線上網頁應用程式（Hosted App）]」。
+ * 首先，準備一個 128x128 的圖檔 128.png 當 logo
+ * [[Image(jazz/12-03-11:128.png)]]
+ * 接著，產生一個 manifest.json
+{{{
+~$ mkdir hadoop.tw
+~$ cd hadoop.tw
+~/hadoop.tw$ cat >> manifest.json << EOF
+{
+  "name": "Hadoop 實驗叢集",
+  "description": "提供使用者一個連上 hadoop.nchc.org.tw 的 Chrome Hosted App",
+  "version": "0.0.1",
+  "icons": { "128": "128.png" },
+  "app": {
+    "urls": [
+      "https://hadoop.nchc.org.tw/"
+    ],
+    "launch": {
+      "web_url": "https://hadoop.nchc.org.tw/",
+      "container": "tab"
+    }
+  }
+}
+EOF
+}}}
+ * 開啟 Chrome 瀏覽器的「工具」->「擴充功能」，勾選「開發人員模式」，選擇剛剛建立的 hadoop.tw 目錄，就會看到類似底下的結果：
+ * [[Image(jazz/12-03-11:hadoop_chrome_app.png)]]
+ * 開啟一個新的分頁，就能看到剛新增的「擴充功能」：
+ * [[Image(jazz/12-03-11:new-tab.png)]]
+ * 在 chrome://settings/extensions 分頁，點選「封裝擴充功能」，就可以得到 hadoop.tw.crx （供別人下載或上傳 Chrome Web Store）以及 hadoop.tw.pem 金鑰。
+ * [[Image(jazz/12-03-11:chrome_crx.png)]]