一个ChromeAPP 包含以下内容:
1. 清单文件 manifest.json,列出应用的一些基本信息例如:如何启动应用,应用的权限等等。
2. 事件处理页面也就是我们常说的后台脚本(background script),这个文件管理APP的整个活动周期,这个也是你处理一些事件的监听的地方比如如何启动,关闭应用的窗体。
3.所有的代码文件都必须打包成一个ChromeAPP,包含HTML,CSS,JS和本地模板
4.其他文件,例如图片文件也得打包至ChromeAPP
 
下面来创建一个APP
第一步: 创建 manifest.json
{
"manifest_version": 2,
"name": "Codelab",
"version": "1",
"icons": {
"128": "icon_128.png"
},
"permissions": [],
"app": {
"background": {
"scripts": ["background.js"]
}
},
"minimum_chrome_version": "28"}
这里需要注意的是 第一行 “manifest_version":2 这个必须要加
permissions 如何是访问网站则需要添加在这里
background 就是我们要处理的后台脚本
icons  需要提供一个正方形图片(这个会显示在ChromeAPP的应用列表中),大小就是 第一个参数(px)
 
2. 添加一个图片也就是icons里的图片,注意大小要与前面的一致,例如128×128
 
3.创建backgroud.js
/**
* Listens for the app launching then creates the window
*
* @see http://developer.chrome.com/apps/app.window.html
*/
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('index.html', {
id: 'main',
bounds: { width: 620, height: 500 }
});});
这个函数的意思就是在应用启动的时候,添加一个监听,打开index.html这个网站(下一步我们会创建这个)
 
第四步创建index.html
<!DOCTYPE html><html><head>
<meta charset="utf-8"></head><body>
<h1>Hello, let's code!</h1></body></html>
完成上面的步骤之后,就基本完成了一个ChromeAPP的相关文件了。 下一步就是运行了。
 
运行程序
在Chrome的地址栏输入chrome://extensions/  就可以打开扩展程序列表,勾选"开发者模式",点击"加载正在开发的扩展程序" 打开ChromeAPP文件包就可以看到你的应用出现在列表中了。点击应用下方的“启动”就可以查看效果了。
 
 
 
 
 
 
 
 
 

如何创建ChromeApp的更多相关文章

  1. In-Memory:在内存中创建临时表和表变量

    在Disk-Base数据库中,由于临时表和表变量的数据存储在tempdb中,如果系统频繁地创建和更新临时表和表变量,大量的IO操作集中在tempdb中,tempdb很可能成为系统性能的瓶颈.在SQL ...

  2. 创建 OVS flat network - 每天5分钟玩转 OpenStack(134)

    上一节完成了 flat 的配置工作,今天创建 OVS flat network.Admin -> Networks,点击 "Create Network" 按钮. 显示创建页 ...

  3. ASP.NET MVC with Entity Framework and CSS一书翻译系列文章之第二章:利用模型类创建视图、控制器和数据库

    在这一章中,我们将直接进入项目,并且为产品和分类添加一些基本的模型类.我们将在Entity Framework的代码优先模式下,利用这些模型类创建一个数据库.我们还将学习如何在代码中创建数据库上下文类 ...

  4. ABP入门系列(2)——通过模板创建MAP版本项目

    一.从官网创建模板项目 进入官网下载模板项目 依次按下图选择: 输入验证码开始下载 下载提示: 二.启动项目 使用VS2015打开项目,还原Nuget包: 设置以Web结尾的项目,设置为启动项目: 打 ...

  5. 记一次tomcat线程创建异常调优:unable to create new native thread

    测试在进行一次性能测试的时候发现并发300个请求时出现了下面的异常: HTTP Status 500 - Handler processing failed; nested exception is ...

  6. 在WPF中使用依赖注入的方式创建视图

    在WPF中使用依赖注入的方式创建视图 0x00 问题的产生 互联网时代桌面开发真是越来越少了,很多应用都转到了浏览器端和移动智能终端,相应的软件开发上的新技术应用到桌面开发的文章也很少.我之前主要做W ...

  7. 在一个空ASP.NET Web项目上创建一个ASP.NET Web API 2.0应用

    由于ASP.NET Web API具有与ASP.NET MVC类似的编程方式,再加上目前市面上专门介绍ASP.NET Web API 的书籍少之又少(我们看到的相关内容往往是某本介绍ASP.NET M ...

  8. TODO:GitHub创建组织的步骤

    TODO:GitHub创建组织的步骤 使用GitHub进行团队合作,写这个步骤主要作用是为了OneTODO作为一个团队组织进行代码的分享,让更多人来参与. 使用帐号.密码登录GitHub 2.右上角加 ...

  9. java Web项目创建之一(普通java web项目的创建与发布)

    1.创建新的web项目 file->new_>Dynamic Web Project(如图) 或file->new->Project->Web->Dynamic W ...

随机推荐

  1. token:NLP之词形还原

    已迁移到我新博客,阅读体验更佳token:NLP之词形还原 完整代码实现放在我的github上:click me 一.任务描述 形态还原算法: 输入一个单词 如果词典里有该词,输出该词及其属性,转4, ...

  2. Go:学习笔记兼吐槽(3)

    Go:学习笔记兼吐槽(1) Go:学习笔记兼吐槽(2) Go:学习笔记兼吐槽(3) 数组 Golang 中,数组是值类型. 数组的声明 var arr [10]int 数组的初始化 var arr1  ...

  3. Spring Boot 2.X 如何快速集成单元测试?

    本文将详细介绍下使用Spring Boot 2.X 集成单元测试,对API(Controller)测试的过程. 一.实现原理 使用MockMvc发起请求,然后执行API中相应的代码,在执行的过程中使m ...

  4. AI2(App Inventor 2)离线版服务器单机版

    注意:每次退出前导出自己的项目到本地做备份. 单机版特点: 1.同步官方最新版本,没有对java源代码进行修改,仅修改war\login.jsp及\war\WEB-INF\appengine-web. ...

  5. git入门手册:git的基本安装,本地库管理,远程上传

    前言: git是分布式的版本库控制系统,它能方便你将自己的代码寄存于远程服务器上,从而实现集体合作开发.git有GUI 图形界面,然而使用终端命令仍是主流.以下基于Ubuntu系统操作git(其方式也 ...

  6. 个人整理的 Windows 下 .NET 开发必装的软件

    注: 最后更新时间:2019-03-15 一..NET 开发 1. 必装 软件名称 说明 下载地址 JetBrains Toolbox JetBrins 全家桶管理工具. 下载地址 JetBrains ...

  7. Maven项目pom文件设置JDK版本

    maven项目创建之后有时候默认设定了java的低版本,每次导入项目或者更新maven的时候可能或出现一些报错,在pom.xml设定版本免除这个问题 <build> <finalNa ...

  8. Swashbuckle.AspNetCore3.0的二次封装与使用

    关于 Swashbuckle.AspNetCore3.0 一个使用 ASP.NET Core 构建的 API 的 Swagger 工具.直接从您的路由,控制器和模型生成漂亮的 API 文档,包括用于探 ...

  9. 常用Latex公式

    注意: 1 在博客中书写Latex公式时,需在公式两侧用$包括 2 大括号{ }在Latex有本身的含义,如果要输出为普通字符需要使用\{...\} 符号 公式 说明 $ \in $ \in 包含 $ ...

  10. 用ASP.NET Core 2.1 建立规范的 REST API -- HATEOAS

    本文所需的一些预备知识可以看这里: http://www.cnblogs.com/cgzl/p/9010978.html 和 http://www.cnblogs.com/cgzl/p/9019314 ...