当前位置: 首页 > 编程日记 > 正文

面向JavaScript开发人员的Adobe AIR与Dreamweaver

入门教程,非常详细,CS4里面应该可以省略前面几步直接开发了。

Adobe AIR对于HTML/JavaScript应用程序与桌面的集成有着出色的支持,但除了所有附加功能之外,还需要一些其他工具和技术。这篇文章探讨了使用HTML/JavaScriptWeb开发与使用同样工具的应用程序开发之间的差异。

需求

为了更好地学习本文,您需要以下软件和文件:

Adobe AIR

  • 下载

Dreamweaver CS3

  • 试用

  • 购买

Adobe AIR Extension for Dreamweaver CS3

  • 下载

范例文件

  • exercise_files_for_js.zip (ZIP, 308K)

必备知识

本教程要求理解Dreamweaver CS3的工作原理,并掌握JavaScript的中级知识。

AIR设置Dreamweaver

要开始进行AIR开发,最简单的方法之一就是安装Adobe AIR Extension for Dreamweaver CS3

安装必备项

请安装本文简介页面提到的AIR运行时。这将使您能够按照本教程中展示的范例逐步操作。

此外,还必须安装Adobe AIR Extension for Dreamweaver CS3。这一扩展使您能够在Dreamweaver内构建、测试和部署AIR应用程序。下载本扩展后,双击它。这将打开Adobe Extension Manager。如果此前您安装过任何用于Dreamweaver CS3AIR扩展,将提示您本操作将覆盖某些文件。由于正在安装的是最新版本的扩展,因此覆盖旧文件不会造成问题。

Dreamweaver AIR工作流

AIR扩展的安装不会立即改变Dreamweaver的布局。可以从菜单栏中选择Commands项,确认安装已成功完成。您应看到新增了两个选项:AIR Applications SettingsCreate AIR File。如果您使用的是Windows机器,则应看到如图1所示的菜单。

 

                                      1. Dreamweaver CS3中的Site菜单

验证安装之后,可以开始构建您的第一个AIR应用程序。尽管这项任务初看起来可能有些令人畏缩,但很快您就会发现,Dreamweaver会替您完成大多数配置。

AIR应用程序设置

Web应用程序和桌面应用程序之间的一个主要差异就在于配置。对于桌面应用程序来说,有一些必须解答的新问题。这个应用程序应该有多大?窗口看起来应该是怎样的?它应该定位在屏幕的什么位置?程序图标应该是什么样子?有许多类似的问题需要回答,之后才能打包应用程序并将其发送给用户。

AIR中,这些配置项均由一个称为应用程序描述符文件的XML文件处理。下面是一个简单的应用程序描述符文件:

可以看到,您必须回答的许多问题都在这个短短的文件中得到了解答。例如,应用程序的宽度和高度以及应用程序主窗口有关的其他属性都是在<initialWindow>标记内定义的。完整的应用程序描述符文件要比这长得多,包含用于自定义程序图标、窗口定位和自定义文件类型的选项。

为您开发的每一个AIR应用程序创建一个这样的文件看上去有些繁琐,但Dreamweaver使您可以轻松创建应用程序描述符文件。如果您有一个在Dreamweaver CS3上开放的站点,可以单击Command菜单中的AIR Application Settings项。这将打开图2所示窗口。

2. Dreamweaver CS3中的AIR Application and Installer Settings对话框

其中许多设置都可保留默认值,但必须为各AIR项目更改IDName值。ID是用于将您的应用程序与其他AIR应用程序区分开来的惟一值——即便它们具有相同的名称。许多开发人员都为其ID使用反向域名解析(reverse-dns的形式。例如,我的域是davidtucker.net,我可能会为应用程序选择net.davidtucker.SampleApplication这样的ID。如果开发人员运用此惯例,就能够最大程度地消除应用程序ID重复的可能性。

对于应用程序的发布和更新来说,ID尤为重要。在稍后的部分中,您将了解更多内容。有必要了解,在创建应用程序时应设置ID,而且在此后不应再更改。如果更改,就无法在Adobe AIR内使用更新框架等功能。

创建AIR应用程序

既然已经完成了准备工作,就可以将一个Web应用程序置入Adobe AIR,查看其运行方式。为在Dreamweaver内完成此任务,首先需要为您的项目创建一个新站点。在本文附带的练习文件中,您可以看到一个名为Sample Application Template的文件夹。将所有这四个文件都放到site文件夹中。

接下来,选择Site > AIR Application and Installer Settings。确保四个文件都出现在本对话框的Incluede Files部分(如图3所示)。如果其中某些文件未出现在此列表中,可以单击加号并选择缺少的文件添加它们。

                    

                     3. 使用Dreamweaver CS3包含AIR应用程序中的文件

完成此任务之后,单击Preview按钮。祝贺您,您刚刚在Dreamweaver CS3中测试了您的第一个AIR应用程序。还有一个地方必须在打包和部署此应用程序之前进行检查,也就是安全性。

AIR中的安全性

对于Web开发人员来说,思维方面的一项重大改变就是要认识到,他们在AIR中开发的是桌面应用程序,而不是Web应用程序。桌面应用程序有一些Web应用程序没有的特殊许可,例如文件系统交互。出于此原因,必须给予特别关注,确保AIR应用程序未受任何外部源的威胁,同时确保您的AIR应用程序来自预计的正确发布者。因此,您会发现AIR内部的证书和安全性沙箱。

备注:如需进一步了解AIR中的安全性,请参见Lucas Adamski的文章Introducing the Adobe AIR security model

自签证书

由于桌面应用程序可能会给用户的计算机造成风险,因此有必要找到某种方法,验证AIR应用程序发布者的身份。与其他一些桌面应用程序平台类似,Adobe AIR也要求您的应用程序具备证书。但这并不表示您必须使用商业证书。Adobe实际上也允许开发人员使用自签证书。在Dreamweaver中,您可以单击AIR Application and Installation窗口中Digital Signature字段旁边的Set按钮,为您的应用程序创建证书。此操作将打开一个窗口,您需要单击Create按钮。接下来出现的窗口允许您填写关于您和您的组织的信息(参见图4)。完成此步骤之后,Dreamweaver就会通知您证书是否已正确创建。

备注:如需进一步了解签名应用程序的基本原理,请参见Todd Prekaski的文章Digitally signing Adobe AIR applications中的Why sign an application

                    图4. Dreamweaver CS3中的证书创建窗口

现在,您可以在AIR Application Settings窗口中设置数字签名。您需要确认并牢记创建证书时所用的密码,每次创建.air文件时都必须输入此密码。

商业签名证书

商业签名证书为应用程序的最终用户确认您的身份。这非常重要,在用户安装自签AIR应用程序和商业签名应用程序时,所出现的安装屏幕是不同的。图5和图6展示了这种差别。

             

                           图5. 自签证书应用程序的安装窗口

                         图6. 商业签名证书应用程序的安装窗口

商业签名证书由Thawte等企业提供。不同于创建自签证书的过程,商业证书的发行者会处理证书创建过程。

安全性沙箱

沙箱为一个页面或应用程序中的资产分配一个具体的权限组。应用程序描述符文件中引用的根HTML文件将自动置于应用程序沙箱中。应用程序的根文件将位于应用程序沙箱中。

应用程序沙箱提供了最广泛的功能。实际上,对于应用程序沙箱中的内容,只有一项约束:eval方法的使用受严格限制。Eval方法仍然可以计算字面值,但函数调用无法通过JSON传递。由于这是桌面应用程序而非Web应用程序,核心AIR API调用需要受到保护。如果远程服务器收到威胁,发送以下JSON语句会怎样?

{ air.NativeApplication.nativeApplication.exit() }

这将导致应用程序在未发出警报的前提下退出。许多JavaScript开发人员都不会将此编写到他们的代码中,但许多JavaScript框架都实现了这种功能。在这种情况下,开发人员可以使用远程沙箱,使用parentSandboxBridgechildSandboxBridge在两种不同的沙箱之间通信。

使用高级模板创建apProject

用于在不同的沙箱之间进行处理的功能可能令人迷惑,因此Adobe提供了一种模板,专门处理此类应用程序。可在本文附带的练习文件中找到此模板。此模板是将现有Web应用程序与AIR相集成的理想起点。

掌握细节

AIR中的沙箱是一个复杂的主题。对于许多应用程序来说,这种基本的应用/非应用沙箱方法都足以应对,但在数据从多个数据源动态加载时,就需要对AIR内的安全性模型有更加透彻的理解。在Developing AIR Applications with HTML and Ajax 中,您会看到有整整一章的内容专门介绍安全性模型。Lucas Adamski最近还撰写了一篇文章,介绍了AIR安全性模型及其背后的基本原理。

调试应用程序

调试是Ajax开发的重要部分。有许多调试工具可用,但许多开发人员都单纯依靠FirebugJoe Hewitt开发的一种Firefox插件)之类的插件。如何调试AIR Ajax应用程序?Firebug不是理想选择,那么开发人员应该做些什么?Adobe在为AIR开发人员设计工具时考虑了这方面的问题,提供了两种选择。

简单调试

简单调试是获得某部分信息的简单方法。在很多情况下,如果调试单个的代码块,只需采用这种方法即可。在AIR中,有许多方法可实现简单调试,但常用的方法有两种:调用alert方法,使用AIR内的跟踪功能。Alert方法的功能与它在标准JavaScript Web应用程序中的功能相同,但air.traceAIR API独有的。Air.trace方法允许开发人员通过ADLAIR Debug Lanuncher)发送跟踪语句。Dreamweaver不支持此方法,因此您往往需要考虑复杂的调试解决方案——Introspector

使用AIR introspector实现复杂调试

对于几乎所有情况,AIR Introspector都提供了比前述任何方法更高、更具体的调试级别。Introspector提供了Firebug之类的标准工具中的大多数功能。Introspector包含五个选项卡(参见图7):

·         Console:控制台将接收来自AIR的错误、警告和通知以及由用户发送的自定义消息。开发人员可以使用五种不同的方法向控制台发送数据。

    • o air.Introspector.Console.log('Sample Log Item')

    • o air.Introspector.Console.warn('Sample Warning Item')

    • o air.Introspector.Console.info('Sample Info Item')

    • o air.Introspector.Console.error('Sample Error Item')

    • o air.Introspector.Console.dump( object )

  • HTMLHTML选项卡提供了一种方法,可以使用树型布局查看HTML并查看XML中某个节点的DOM属性和computed style元素。将鼠标移动到一个XML节点上时,应用程序中的对应内容将突出显示。

  • DOMDOM选项卡提供了窗口的所有DOM属性的列表。

  • AssetsAssets选项卡提供了一种方法,可查看您的应用程序中使用的所有文件,包括图像、JavaScript文件和CSS文件。

  • Sourcesource选项卡不仅使您能够查看应用程序的实际源代码(以及JavaScript文件、CSS文件和应用程序描述符文件的源代码),还允许您查看解析后的源代码。

XHRXHR选项卡允许您查看所有XMLHTTPRequests、其响应XML及其响应报头。

7. AIR Introspector

Introspector还提供了一种可视化的方法,用于检查应用程序中的元素。使用Introspector时,您可以按F11键来打开和关闭此模式。图8展示了此功能的一个示例。

8. AIR IntrospectorInspect模式

最后,另外一项有用的特性就是,可以使用Introspector右上角的Refresh Active Window按钮来刷新应用程序中的某个窗口。

使用范例应用程序

在本文附带的练习文件中,有一个范例应用程序(及其源代码),名为Debugging Sample。安装并启动此应用程序时,Introspector窗口应默认显示。此应用程序包含一些可与控制台和范例XMLHTTPRequest交互的按钮。

发布AIR应用程序

AIRWeb开发人员引入了一组全新的挑战。要发布一个Web应用程序,只需将其放在Web服务器上,发出URL即可。对于在Adobe AIR上运行的桌面应用程序,事情并不是这么简单。

使用在线安装

在线安装(install badge)允许用户在不离开Web站点的前提下安装您的应用程序和Adobe AIR运行时。我为Adobe Developer Center编写了一篇文章,介绍了使用自动安装无缝地部署AIR应用程序的整个过程。

使用范例应用程序

本文附带的练习文件包含一个AIR内更新功能的示例。其中包括AIR应用程序和源代码。应用程序不依赖于任何框架,因此大多数代码都可在您的应用程序中重用。图9展示了此应用程序。

                              图9. Update Sample应用程序

通过执行以下步骤来使用此应用程序:

  1. 确定您要更新的应用程序的URL和版本号(有许多方法可完成此任务)。

  2. 创建一个URLStream类的实例,为其传递一个URLRequest类的实例(指向步骤1中的URL)。由于URLStream.load方法是异步的,您将需要添加一个事件侦听器,侦听URLStream何时完成。

  3. 下载完成中,您将URLStream的内容读入一个ByteArray

  4. 现在,您要在应用程序的存储目录中创建一个新的File对象。还要创建一个新的FileStream对象,将ByteArray的内容读入File对象。由于这是一个异步过程,还需要创建一个事件侦听器,侦听此流程在何时完成。

  5. 最后,创建Updater类的实例,为其传递File对象和最新的版本。AIR会完成其他工作。

此流程最初看起来比较复杂,但只要将它拆分成较小的部分,就非常简单了。同样,只要编码了应用流程,您很有可能在未来的应用程序中重用大部分信息(由于核心流程不会有太大的变动)。社区开发人员还创建了一些类,使更新流程更加简单。

加深理解

尽管这篇文章简单介绍了Web开发和AIR开发之间的差异,但并未涵盖此主题的方方面面。要加深对AIRAjax的认识,请参考Adobe AIR Developer for HTML and Ajax Developers,进一步了解可以在AIR中实现的目标。

来自:http://blog.csdn.net/chengyongli/archive/2008/09/18/2948212.aspx

相关文章:

在数据显示页面增加按姓名查询功能

在上一章内容《将数据库中表格信息输出到页面上》的基础上&#xff0c;增加按姓名查询功能。 问&#xff1a;怎么在显示学生信息的页面增加按照姓名查询的功能&#xff1f; 答&#xff1a;在显示学生信息的页面&#xff0c;使用<form>标签为用户创建表单&#xff0c;表单…

Spring AOP的一些概念

切面&#xff08;Aspect&#xff09;&#xff1a; 一个关注点的模块化&#xff0c;这个关注点可能会横切多个对象。事务管理是J2EE应用中一个关于横切关注点的很好的例子。 在Spring AOP中&#xff0c;切面可以使用通用类&#xff08;基于模式的风格&#xff09; 或者在普通类中…

有关于Matlab的regionprops函数的PixelIdxList和PixelList的一点解释

上一篇文章&#xff08;点击这里&#xff09;的最后一点说到了regionprops的相关参数的意思&#xff0c;但是总感觉不够明确 现在重新对PixelIdxList和PixelList的内容经过实验之后得到了点启发 1.首先用excel建立了一个如下的表格&#xff0c;然后用mat保存为mat的方式进行加载…

windows 系统无法启动windows event log 服务

windows 系统无法启动windows event log 服务 关键词&#xff1a;无法启动系统事件日志 尝试解决步骤 【1】权限&#xff1a;把如图中logsfile文件等都给local service 【2】把C:\Windows\System32\winevt\Logs下面的文件全部移走到其他文件夹&#xff0c;再启动服务试试看 【…

移动互联网漫谈(3)

1.1WIFI WIFI是无线局域网的一种&#xff0c;全称Wireless Fidelity&#xff0c;又称802.11b标准&#xff0c;它的最大优点就是传输速度较高&#xff0c;可以达到11Mbps&#xff0c;另外它的有效距离也很长&#xff0c;同时也与已有的各种802.11 DSSS设备兼容。今夏最流行的笔…

实现对学生表的删除操作

在上一章内容《数据显示页面》的基础上&#xff0c;增加删除超链接&#xff0c;实现删除功能&#xff1b; 修改内容&#xff1a; 在数据显示页面的表格中&#xff0c;增加一列&#xff0c;列名为“删除”&#xff0c;用来显示删除超链接&#xff1b;为表格的行标签&#xff08…

FRAME与IFRAME

FRAME与IFRAME框架概念 &#xff1a; 所谓框架便是网页画面分成几个框窗&#xff0c;同时取得多个 URL。只需要转载于:https://www.cnblogs.com/vibratea/archive/2009/07/24/1530098.html

react实现全选、取消全选和个别选择

react里面实现全选和取消全选&#xff0c;个别选择等操作&#xff0c;效果如下 代码&#xff1a; import React, {Component} from react export default class Demo extends React.Component{constructor(props,context){super(props,context);this.state {checklist:[{name:…

PAT1036:Boys vs Girls

1036. Boys vs Girls (25) 时间限制400 ms内存限制65536 kB代码长度限制16000 B判题程序Standard作者CHEN, YueThis time you are asked to tell the difference between the lowest grade of all the male students and the highest grade of all the female students. Input …

NERO7光雕功能

找到NERO 7 PREMIUM的这个版本&#xff1a;Nero-7.10.1.0_chs_trial.exe百度中搜这个文件就找到了&#xff0c;用下面的序列号&#xff1a;1C80-0000-19E5-MA2X-4004-9268-7320&#xff0c;再装上最新版的官方光雕程序&#xff08;集成了加深标签的插件&#xff09;&#xff1a…

hive函数 get_json_object的使用

hive提供了json的解析函数&#xff1a;get_json_object 使用方法 对于jsonArray&#xff08;json数组&#xff09;&#xff0c;如person表的xjson字段有数据&#xff1a; [{"name":"王二狗","sex":"男","age":"25"…

实现对学生信息的增加操作

上一篇博客&#xff1a;《实现对学生表的删除操作》返回目录&#xff1a;《学生信息管理系统&#xff08;JavaJSP&#xff09;》本篇博客将介绍如何实现学生表中学生信息的增加操作。 1、在test1模块的web目录下&#xff0c;新建一个stuAddForm.jsp文件&#xff08;文件内容如…

【BZOJ 3879】SvT

【链接】h在这里写链接 【题意】 给你一个长度为n的字符串以及m个询问。 每个询问询问你所给的一些后缀,所有任意两个后缀之间的lcp的总和; n<5*10^5 ∑t<3*10^6【题解】 按照这些后缀的rank值升序排 ->利用Sa数组 即输入一个x,x--; sort(a1,…

快速计算表达式树

前言 .NET 3.5中新增的表达式树&#xff08;Expression Tree&#xff09;特性&#xff0c;第一次在.NET平台中引入了“逻辑即数据”的概念。也就是说&#xff0c;我们可以在代码里使用高级语言的形式编写一段逻辑&#xff0c;但是这段逻辑最终会被保存为数据。正因为如此&#…

随手拈来尽是折劲额事体

昨天中午&#xff0c;justina同学请我去港丽吃饭&#xff0c;世界顿时美好了&#xff01; 猛地发现&#xff0c;港丽的酸菜鱼竟然非常好吃&#xff0c;除了价钱贵&#xff0c;基本没有缺点了。 吃饭的时候&#xff0c;看到两件有劲的事情&#xff0c;一件比一件更折劲&#xff…

06 面向对象之:反射,双下方法

一、反射 反射的概念是由Smith在1982年首次提出的&#xff0c;主要是指程序可以访问、检测和修改它本身状态或行为的一种能力&#xff08;自省&#xff09;。这一概念的提出很快引发了计算机科学领域关于应用反射性的研究。它首先被程序语言的设计领域所采用,并在Lisp和面向对象…

实现对学生信息的修改操作

返回目录&#xff1a;《学生信息管理系统&#xff08;JavaJSP&#xff09;》 本篇博客主要实现对学生信息的修改操作&#xff1b; 步骤1、在学生信息的显示页面&#xff08;即student.jsp页面&#xff09;中&#xff0c;在表格最后增加一列“修改”超链接&#xff0c;在<tr&…

UML用例图概要(转)

用例图主要用来图示化系统的主事件流程&#xff0c;它主要用来描述客户的需求&#xff0c;即用户希望系统具备的完成一定功能的动作&#xff0c;通俗地理解用例就是软件的功能模块&#xff0c;所以是设计系统分析阶段的起点&#xff0c;设计人员根据客户的需求来创建和解释用例…

Python之迭代器,生成器与装饰器

1》迭代器原理及使用&#xff1a; 1>原理&#xff1a; 迭代器是访问集合元素的一种方式&#xff0c;迭代器对象从集合的第一个元素开始访问&#xff0c;直到所有的元素被访问完结束&#xff1b;迭代器只能往前不会后退&#xff0c;不过这也没什 么&a…

像乔布斯一样演讲

当苹果公司CEO史蒂夫-乔布斯开始今年&#xff08;2008年1月&#xff09;的Macworld时&#xff0c;我们看到他的商业演讲&#xff08;以下简称&#xff1a;演讲&#xff09;水平更上了一层楼。所有人都希 望能够在演讲中能更加简明扼要&#xff0c;乔布斯做到了&#xff0c;并且…

UNICODE使用的一些知识和技巧

UNICODE宏和_UNICODE宏的关系 在windows编程中,经常要编译Unicode版本的程序,方法是工程文件的配置中加上UNICODE或者_UNICODE编译条件,那么到底是用哪一个呢? Jeffrey Richter在《Windows核心编程》中说,_UNICODE宏用于C运行期头文件,而UNICODE宏则用于Windows头文件.当编译源…

编程学习网站收集

目录 1. 菜鸟教程 1.1 Java 教程 1.2 HTML 教程 1.3 CSS 教程 1.4 JavaScript 教程 1.5 JSP 教程 1.6 Servlet 教程 1.7 jQuery 教程 1.8 AJAX 教程 1.9 MySQL 教程 2. 易百教程 3. w3school 在线教程 1. 菜鸟教程 菜鸟教程 (www.runoob.com) 提供了编程的基础技术…

js短路表达式

今天碰见个题目&#xff0c;感觉短路表达式很好用。 题目&#xff1a; 定义一个计算圆面积的函数area_of_circle()&#xff0c;它有两个参数&#xff1a;r: 表示圆的半径&#xff1b;pi: 表示π的值&#xff0c;如果不传&#xff0c;则默认3.14function area_of_circle(r, pi) …

51nod 1065 最小正字段和 解决办法:set存前缀和,二分插入和二分查找

题目&#xff1a; 这题要求大于0的最小字段和&#xff0c;常规O&#xff08;n&#xff09;求最大字段和的方法肯定是没法解的。 我的解法是&#xff1a;用sum[i]存前i项的和&#xff0c;也就是前缀和。 这题就变成了求sum[j]-sum[i]的大于0的最小值( j > i )。 我们可以看到…

著名作者网站论文下载

http://www.cs.wright.edu/~agoshtas/ardyCV.htmlhttp://www.cse.msu.edu/~stockman/http://www.dkfz.de/tbi/people/homepages/rohr/转载于:https://www.cnblogs.com/stoneresearch/archive/2008/11/06/4336753.html

内存与进程管理

这一节的内容有点杂&#xff0c;只能自己手动输入了 1.uname命令用于打印当前系统相关信息&#xff08;内核版本号、硬件架构、主机名称和操作系统类型等&#xff09;。 uname -a显示全部信息 2.cat /etc/redhat-release 查看当前系统版本 3.free -m / -g 查看内存使用状况&…

Python的闭包和装饰器

什么是闭包 python中函数名是一个特殊的变量&#xff0c;它可以作为另一个函数的返回值&#xff0c;而闭包就是一个函数返回另一个函数后&#xff0c;其内部的局部变量还被另一个函数引用。 闭包的作用就是让一个变量能够常驻内存。 def count():fs []for i in range(1, 4):de…

用@Data注解的形式替代类中的setter、getter方法

目录 1. 封装 2. Data注解介绍 3. Lombok的使用 1. 封装 在类中&#xff0c;为了增强数据的安全性和隐蔽性&#xff0c;通常会对数据和与数据有关的方法进行封装&#xff1b; 封装的步骤&#xff1a; 1、将类中的属性设置为private(私有的)&#xff0c;只能本类才能访问&…

note-在VisualStudio中使用正则表达式

前言&#xff1a;本来昨天已经写了&#xff0c;但由于意外给搞丢失了&#xff0c;由于刚刚看了这篇文章知道了一些真相&#xff1b;现在的心理状态已经和昨天不一样了&#xff0c;昨天是满心的高兴&#xff0c;对VisualSduio很有好感&#xff0c;当时自认为是没有把正则学好&am…

AS 发展小计

2000 -- 2003: ActionScript 1.0, 和 Flash 5.0 一起发布&#xff1b;变成可文本编辑&#xff08;以前是从对话框和下拉菜单中选择&#xff0c;当然&#xff0c;那个时候不叫AS&#xff09;添加 switch 语句和strict equality 操作&#xff1b;2003 -- 2006: ActionScript 2.0 …