SCMLife.com

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

查看: 5273|回复: 5

[推荐] 使用 WebSphere Portal 和 IBM Worklight 交付出色的移动 Web 体验

[复制链接]
发表于 2013-3-12 17:33:51 | 显示全部楼层 |阅读模式
本帖最后由 技术狂人 于 2013-3-12 17:56 编辑 1 }! W. V' g! T# F* ~0 D  o9 n

/ k7 h: i4 A) F( a! u# `# f简介
: s; K: S/ `! e2 V. d
* ~4 W! a! A1 x移动渠道已成为销售、营销等许多行业的一个重要战略渠道。随着越来越多的企业通过网站来管理他们其品牌,常见的难题就变成了如何向移动设备提供内容和应用程序。  H3 a- M. o) B( b) g$ E) Y
在查看 IBM WebSphere Portal 与 IBM Worklight 的重叠区域之前,了解网站与应用程序之间的差别很重要:% g, L$ i  n# _8 V
  • 网站将 Web 内容和多个 Web 应用程序聚合为一种单一的用途体验,可跨多种渠道运行,包括桌面浏览器、信息亭、智能电话和平板电脑。我们将使用您最喜欢的航空公司的网站作为一个简单的示例。这些网站可能也有一个移动网站,并且支持电话和平板电脑。WebSphere Portal 是构建网站的绝佳平台。
  • Web 应用程序是自定义的,通常适用于特定的任务。例如,您最喜欢的航空公司应用程序来自一个应用程序商店,并且支持您预定航班或座位,这就是一个 Web 应用程序示例。它通常包含网站功能的一个子集,适用于您可在设备上实际执行的操作。IBM WebSphere Application Server 是提供独立的 Web 应用程序的不二选择。IBM Worklight 提供了创建原生和混合应用程序的能力,您可以使用 WebSphere Application Server 作为后端(如果创建混合应用程序),也可以使用 WebSphere Portal 作为后端(如果创建混合网站)。
    $ o" [" O6 \( E7 O- K$ w
然后您要做出的选择是开发一个原生应用程序、混合应用程序还是 Web 应用程序。但还有两个问题需要回答,这两个问题可能会影响到您的移动渠道技术决策:
% v; h! U& Q+ L8 g
  • 您需要支持哪些设备?
  • 您的应用程序将执行何种操作?% ]- J4 @5 m  m* V6 A' j- B
帮助您回答这些问题的基本考虑因素包括:您有哪些用例?您的应用程序是否需要特定的设备功能,比如 GPS 或照相机?应用程序是否需要高保真的屏幕视图,或者移动浏览器是否够用?这些问题的答案对此决策至关重要,原生、混合和纯 Web 应用程序的优缺点也很重要:
4 L$ B: x/ j/ ]
  • 原生应用程序适用于企业移动应用程序,拥有很高的成本,拥有与纯原生开发有关的很长的时间线。能够开发 100% 原生应用程序的熟练人员很难找到,而且聘请费用可能很高昂。复杂的原生应用程序可能需要多个技术专家,而且跨平台的问题可能会进一步增加成本。除了初步开发,持续的操作系统更新需要持续的应用程序更新,必须重新提交这些更新来批准使用它们,然后才能在应用程序商店中让它们重新上线。
  • 相反,基于 HTML5、CSS3 和 JavaScript™ 的,或者使用 Dojo 和 jQuery 等客户端框架的完整的 Web 应用程序提供了一种创建移动友好的网站的简单方法。开发成本通常低得多,因为很容易找到拥有常用 Web UI 技能的人员。对设备操作系统的更新通常不会影响移动网站,移动网站的开发方法使它们能够跨供应商设备工作。使用这些通用 Web 标准构建的 Web 应用程序还支持跨各种设备重用代码,这减少了维护和总体拥有成本。此外,您无需担忧应用程序商店的审核过程,也无需担心限制会延迟或停止更新。    此方法的两个主要缺点包括:
    $ u# G2 J' `0 }" X/ c
    • 您只能访问浏览器为您提供的原生功能。例如,在 iOS 设备上,您可以访问电位计 (potentiometer)、加速计和 GPS,但不能访问照相机。
    • 您只能以图形方式实现 HTML/CSS/JavaScript 中可实现的功能。结果,一些在原生领域中可用的保真度和 UI 功能无法在浏览器领域中使用。, f; ]! L0 u' s3 D7 }- r2 C6 j
  • 混合应用程序 结合了两家之长。您既能获得使用 HTML/CSS/JavaScript 进行开发的简单性,又能使用原生服务放大这一简单性,为应用程序商店生成一个应用程序。使用 Apache Cordova(Worklight 在使用和发布)等技术,您可以使用 JavaScript 从 Web 标记调用原生功能。例如,您可以使用一行简单的 JavaScript 代码调用照相机,比如:navigator.camera.takeSnapshot。: p- X, Y* d. P2 Q" `( ]; F


$ a5 o. `' h- w
示例解决方案
本文将介绍构建一个示例解决方案,通过一个混合应用程序来集成 Worklight 5.0 与 WebSphere Portal 8.0 的步骤。本节将介绍此解决方案中涉及的组件,以及您执行这些步骤所需的相关前提条件。
( B8 {- A2 S+ o* ^6 z4 F+ I组件
# Z' P! \7 }1 L) V) S) `
  • WorklightWorklight 平台 包含一组组件,它们使您能够管理原生、混合和 Web 应用程序的完整生命周期,这些组件可提供给多个移动平台,其中包括 iOS、Android、BlackBerry 和 Windows® Phone。IBM Worklight Developer Edition 5.0 是一个强大且灵活的移动集成开发环境,您可以 免费下载和使用 它。这里使用了 Worklight Developer Edition 来构建访问 WebSphere Portal 的示例应用程序。
  • WebSphere Portal WebSphere                Portal 是为桌面和移动设备提供网站框架方面的市场领袖。WebSphere Portal 提供了站点导航和品牌,所以您可针对您的企业定制自己的站点。该框架提供了有针对性的内容,通过分析来度量您站点的有效性。基于角色的访问和上下文驱动的内容也是重要的功能。WebSphere Portal 的优势源于它的 WebSphere Application Server 基础。WebSphere Portal 有丰富的功能,包括安全性、集成的 Web 内容管理、内容目标、虚拟门户等。WebSphere Portal 最大的价值在于能够将拥有这些功能背景的应用程序聚合在您的站点上。
  • 响应式 Web 设计对于如今的企业,创建已针对多种设备而进行优化的出色的 Web 体验至关重要。用户现在期望在智能电话上上网就像在桌面计算机上上网一样轻松。但是,目标移动设备的确定通常始于有关原生应用程序的对话。前面已经提到过,这些应用程序拥有高昂的拥有成本且代码重用率有限。另一个解决方案是专门为一个移动设备创建一个备用网站,这不是一个特别实用的解决方案,因为您最终可能有许多代码资源要维护。
    * T1 c8 K' P* v+ s* ]9 f响应式 Web 设计(参阅 参考资料)是一种实用的解决方案,它通过创建灵活、流畅和自适应的网站来摆脱设备和屏幕大小的限制。使用响应式 Web 设计概念,用户界面能够自动针对屏幕分辨率、方向或富 Web 应用程序和混合应用程序的功能而优化。这可以保证您发挥 Web 设计工作的最大价值。
  • 拓扑结构选择在计划 Worklight 和 WebSphere Portal 部署时,您会遇到一些服务器拓扑结构选项。IBM Worklight Server 需要使用一个代理来访问 WebSphere Portal。此示例将 WebSphere Portal 和 Worklight 服务器放在同一个开发机器上进行了测试;清单 3 表明,WebSphere Portal URL 中的 IP 地址被用于访问初始页面。在服务器位于不同系统上时,您需要使用一个代理来部署此示例。IBM Worklight 入门 文档中的模块 45 探讨了如何使用一个远程网站,比如一个托管在 WebSphere Portal 服务器上的网站。7 M" l+ H1 O, i( W
其他 IBM 产品也能满足您构建 Web 或混合应用程序的需求。例如,IBM Rational® Application Developer 和 IBM Web Experience Factory 是也可以用于开发应用程序。: [9 N5 g- S+ G$ U4 `. D4 I( G
先决条件/ d5 C" S" R+ Z0 w7 x
要构建这里提到的示例移动混合应用程序,则必须正确安装以下软件产品和功能并使它们正常运行:
* z/ Q# r' t* ^) x  {
  • WebSphere Portal 8.0参阅 WebSphere Portal 文档,了解安装说明。
  • Eclipse 下载 Eclipse。此示例基于 Eclipse 3.7.2 (Indigo),已使用 Eclipse IDE for Java™ EE Developers 进行了测试。(Eclipse Classic 和 Eclipse IDE for Java Developers 可能也很有用,但是没有在此示例中测试过它们。); G# ^# n3 G* P
请注意,这里介绍的应用程序仅适用于 Android 设备。本系列的后续部分将介绍 Worklight 与 Android 和 iOS 操作系统的集成。
/ c( f( |1 w  t4 q" |
/ X7 j% f/ ^, g5 d7 S$ l8 I
  • Android SDK安装 Eclipse 后,下一步是添加 Android SDK。此示例已使用 Android SDK 2.3.3 (API 10) 进行了测试。
    $ i. m: f3 p: u$ DOracle Java JRE 是使用 Android SDK 的前提条件。一旦完成安装,您就可以导航到 Window > Preferences > Java > Installed JREs,配置 Eclipse 实例来使用 JRE(图 1)。: t" B9 e+ M. j: Y
    3 [3 Q& _! B- Q* j8 [. k5 H

    9 q3 @- Q, M) a  e图 1. 在 Eclipse 中设置 Oracle JRE$ |5 A. h4 F/ X+ K$ V4 z$ h
  • Worklight 此示例需要安装 IBM Worklight 5.0 或更高版本,不适用于早期版本。您可以免费 下载 IBM Worklight Developer Edition 5.0,使用它们进行开发。有关如何使用该插件更新 Eclipse 的详细信息,可在 IBM Worklight 入门 文档中的 “设置” 模块中找到。( x) L1 D- ?# H; w3 R
    Worklight 将服务器安装为 Eclipse 的一部分。您可能需要更新 eclipse.ini,以便将端口从 8080 更改为另一个值,比如 8085。启动 Eclipse 时,Worklight 服务器会自动启动。清单 1 显示了一个 eclipse.ini 文件内容示例,其中设置了 -Dworklight_port。' ^" Z5 n$ ]" S4 S# A4 H/ K

    - \: A% L$ L6 k2 d) m" y& h. M  k7 O/ h9 o
    清单 1.  eclipse.ini
  • -startup
    : I/ M* a3 h# i- v( eplugins/org.eclipse.equinox.launcher_1.2.0.v20110502.jar1 ?) |8 Z* y. O- f: `4 X5 z  k
    --launcher.library: d& I3 n4 F+ e5 |/ q
    plugins/org.eclipse.equinox.launcher.win32.win32.x86_64_1.1.100.v20110502" n. J& U( V; D+ @/ N. _0 d7 e8 n
    -showsplash
    * T7 x/ k: w# r4 Torg.eclipse.platform4 T9 v2 r! X) x3 r1 N
    --launcher.XXMaxPermSize' q# M4 {) f+ z) ?* l  \5 x8 V
    256m
    ) |3 ~! g  z7 ^, e9 s--launcher.defaultAction
    . E4 j$ I; P4 {& Q1 U# DopenFile
    * H* \% K5 C1 Y% X-vmargs * `' ?: T5 ?8 P' A) M* {. ]
    -Dworklight.port=8085
    8 D7 m* s  i/ n( r-Xms40m
    - V, X2 I$ \! _-Xmx384m
    ! {' U2 [" N9 U9 A
  • WebDAV 客户端要使用 Worklight JavaScript 更新 WebSphere Portal 主题,则需要有一个 WebDAV 客户端。此示例是使用 AnyClient 开发的。您可使用 WebSphere Portal 支持的任何 WebDAV 客户端。请参阅 Connecting to the Portal WebDAV with 8.0,了解有关的详细信息。
  • 定制主题在将 Worklight JavaScript 应用于您的主题之前,您需要创建自己的定制主题。复制 WebSphere Portal 主题可确保您的主题包含它正常运行所需的所有元素,确保您的更改不会被修复包所覆盖。不要直接修改 WebSphere Portal 主题,因为它可能由服务修复包更新。相反,遵照 本文中创建主题副本的说明
    . m9 [5 W  x3 H! b" W

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
 楼主| 发表于 2013-3-12 17:46:20 | 显示全部楼层
本帖最后由 技术狂人 于 2013-3-12 18:00 编辑 : `3 ]5 ?9 j- {( |

5 D  n! I9 e2 S) r1 T) D创建 Worklight 应用程序
0 l/ ^  M" |: @" i* y% a* w- m% K
  • 启动 Eclipse。在 Worklight 控制台中可以注意到服务器已启动(图 2)。                                                                5 O! {9 I+ L! I$ \9 i( r, R
    ' s" \' z& Y- Y4 ?4 z0 t
    图 2. Worklight 服务器已启动" Z+ ~) t) [' H, m4 u5 [9 u4 W- r
  • 要开始构建应用程序,则需要创建一个新的 Worklight 项目。在 Eclipse 中,导航到 New > Other > Worklight Project 并单击 Next(图 3)。                                                ) Z6 P7 h* o9 Q( t

    2 @% `4 L% z7 V0 D图 3. 创建一个新的 Worklight 项目7 x4 h0 |* U; r. h4 ?. f- F. i/ ?
  • 为您的项目命名。在图 4 中,该项目被命名为 WLPortal。保留 Hybrid Application 的默认值并单击 Next。                                                                9 R2 s/ a) i3 W( V

    1 M" _/ `! {; f7 b& {" u& [7 r图 4. 为您的 Worklight 项目命名
    4 \5 I  {& I; V" Y  I, X7 g
  • 为 Worklight 项目中的混合应用程序命名,在本例中命名为 WLPortalApp。此示例中没有 JavaScript 包,但您可以在此面板上选择添加一个(图 5)。                                                                  7 S/ h8 m* z6 F9 k. j

    9 \9 {7 }8 u/ c( l/ ^, W. G; ^图 5. 为混合应用程序命名9 @$ U) }1 y/ P2 ^
  • 单击 Finish。项目和应用程序工件已创建。这可能会花费几分钟的时间。在完成创建后,系统可能要求您切换到 Design 透视图,并在项目资源管理器中查看项目(图 6)。                                                                1 n) I2 A+ [: F; Y4 G

    : ^+ ^" J$ Y1 q/ L' Z/ \) R0 K" u图 6. Eclipse 中显示的项目+ {; s+ ^6 B* r
  • 接下来,您可能希望创建一个 Worklight 环境来构建混合应用程序。右键单击应用程序文件夹中的 WLPortalApp,选择 New > Worklight Environment(图 7)。                                                               
    * g$ g, b7 `0 k! l; O, M# L, ~8 P. E) h5 k% d2 G
    图 7. 创建一个新 Worklight 环境, V7 V5 W9 I' V& j" ?' [
  • New Worklight Environment 面板将显示(图 8)。因为这个具体的实例仅适用于混合 Android 应用程序,所以可以选择 Android phones and tablets。如果需要为其他设备操作系统创建环境,也可以在此面板中指定其他选项。单击 Finish。                                                               
    & I) T7 V% Y6 y
    * [8 B) A4 @# Q6 U& Q图 8. Eclipse 中显示的 Worklight 环境
    & t& }% k# f: L1 Z! K0 z
  • Worklight Studio 使用一个原生应用程序构建并更新该项目(图 9)。原生项目名为 Worklight Project/WorklightApplication/Platform。Worklight Studio 管理此应用程序的生命周期,您不应对它执行任何更改。当构建和部署您最初在项目创建的 Web 应用程序时,原生应用程序将被所有应用程序更改覆盖。                                                                 3 `$ H; u! z3 A( [6 p1 A4 M' }2 m- j# \
    5 O9 D1 m% [1 [6 p& l( ]6 P- R
    图 9. 构建原生应用程序
    " A- a1 G# K. X  D
  • 现在您已经设置了应用程序,请确认将会构建和部署它。可以在图 10 中看到,Build All and Deploy 命令表示将基于 Web 应用程序更改来重新部署原生应用程序。要执行 Build All and Deploy 命令,可右键单击应用程序并选择 Run As > Build All and Deploy。                                                                4 D: J: q5 y$ C  D9 |* A

    " [* {; R% k# \- z7 Y- X图 10. 选择构建并部署; r5 b* T  ~! Y3 D4 k
    . R/ g1 Z& _8 M$ B* q% F

    # n" N% X. ]3 b3 {0 I开始构建过程之后,可以在 Eclipse 右下角的状态栏中查看进度。当该过程完成时,您应在 Worklight 控制台中看到消息 Application 'YourApp' deployed successfully with all environments(图 11)。
    9 @- f: _8 N& s6 {6 A$ m
    - v9 g  u! y0 i! `9 e
    ' D# I# @9 ~# }5 W  }$ f( {' U8 r' f8 `图 11. 日志中显示了成功的消息- F: A" b# s  j9 Y$ }

    * G  b; Q9 ?+ s' ?
在尝试运行新的 Android 应用程序之前,请创建一个 Android 虚拟设备。参阅 介绍使用硬件设备的文章,了解 AVD 的详细信息。
/ `/ S* B+ f8 e
2 G4 B3 ~8 z3 F/ P
  • 要运行 Android 应用程序,请右键单击项目资源管理器中的 WLPortalWLPortalAppAndroid 项目并选择 Run As > Android Application。这会启动 Android 模拟器(如果还未运行)并加载一个新应用程序实例。您可能需要打开最初的模拟器屏幕才能看到应用程序。图 12 显示了您构建的应用程序的一个视图。                                                               
    $ N7 r3 }3 k. Z1 i
    * @& m  Y% ?2 f% ?图 12. 模拟器中呈现的应用程序
    - K" T2 m% ?" x6 h1 i+ w+ M
    8 L6 I2 n1 a" _# j8 D) _3 i2 V
接下来,将代码添加到您应用程序中,以便调用一个 WebSphere Portal 页面。
! ]4 j; s- j4 [

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 支持 反对

使用道具 举报

 楼主| 发表于 2013-3-12 18:02:53 | 显示全部楼层
本帖最后由 技术狂人 于 2013-3-12 20:34 编辑
# i3 C4 a) B8 ^8 M+ a# ^' ~, \' ^5 W7 K5 y: g& t, Q
使用 Worklight JavaScript 更新 WebSphere Portal 主题6 \2 f" p' h- ~, m
  • 将 WebSphere Portal 与 Worklight 集成的第一步是在 Android 应用程序中显示该门户。为此,需要创建一个混合应用程序,以便连接到原生包装器中的 WebSphere Portal。在 Eclipse 中,打开初始化应用程序的 Java 类(清单 2),该类位于 \WLPortal\apps\WLPortalApp\android\native\src\com\WLPortalApp\WLPortalApp.java。            , k! l& x5 _# t" p
    # O* {) ~  t4 t% S. u0 @; w
    清单 2. WLPortalApp.java
  • package com.WLPortalApp;
    ! X, @! I+ ~$ Z9 q* o
    . h" ]& C% y. T8 _; Jimport android.os.Bundle;; p! e$ j( ~, r1 Y
    ! e! v& W! ~) }! g/ ~
    import com.worklight.androidgap.WLDroidGap;, j# ]0 q/ V- r& ]/ }* T" R

    $ l% V' ?% Z8 m; Ipublic class WLPortalApp extends WLDroidGap {) A- l* Y; N6 K; q
            @Override5 a1 h- t; f$ w0 a& N
            public void onCreate(Bundle savedInstanceState) {
    2 E* R' }3 T1 J2 v$ [0 r9 q           super.onCreate(savedInstanceState);) H. o  z, {2 w2 `/ e- i9 }
               //DeviceAuthManager.getInstance().setProvisioningDelegate(
    . S$ e! F1 p' t           <Use default ProvisioningDelegateImpl class or replace # c8 U& I, U* \0 [3 S) N" m. \
               with your IProvisioningDelegate implementation>);
    * d, q1 P8 B  j$ ?           super.loadUrl(getWebMainFilePath());
    / y% h0 |( S1 |        }               
    2 x0 S5 i- @" i8 h- ~5 ]}

      E; e6 v/ g  b& i. m3 }
    1 K! p9 W9 m, F3 ^
本示例中的 IP 地址应是您希望在混合应用程序中呈现的 WebSphere Portal 服务器的地址。请参阅 示例解决方案组件 一节,了解安装 Worklight 和 WebSphere Portal 的更多信息。
9 f, s& N' }$ X5 C/ \' P4 |- U1 `7 l" ?7 \( V- c) b; s8 D1 b4 {1 \
  • 该应用程序使用清单 2 中所示的类将控制权转移到位于 \WLPortal\apps\WLPortalApp\common\WLPortalApp.html 的 HTML 页面。您需要更改此文件,以便它能前进到 WebSphere Portal IP 地址和端口。为此,可以更改 onCreate 方法来加载 WebSphere Portal URL 并利用 cookie 管理器(清单 3)。
      V. B' l9 T# u7 t& y& ?( N2 J. d# }4 D$ @
    清单 3. 利用 WebSphere Portal URL 的 onCreate 方法
  • public void onCreate(Bundle savedInstanceState) {- x: M; r2 H5 `; f  ~+ t% ]
               super.onCreate(savedInstanceState);  i& y7 O$ O$ P# w- v  w
               CookieSyncManager.createInstance(appView.getContext());
    ; U( {7 s% i6 n2 O* F1 I1 Y           CookieManager.getInstance().removeSessionCookie();
    4 @2 m0 t, \' L# c           super.loadUrl("http://9.99.999.999:10039/wps/portal",false);
    1 Q" d& E1 F1 z           }
    ' [( {' b% }7 B; @+ i# X6 N1 H
  • 确保添加了 CookieSyncManager 和 CookieManager 的导入依赖关系,如清单 4 所示。               
    ! l) q4 R" q2 F& M4 }, f2 x5 s/ Z
    0 ]- `1 e+ ]( o( }$ t, \' X清单 4. CookieSyncManager 和 CookieManager 依赖关系
  •                                                 ; A) p  l  u% u& T' v$ ^, L) G# J
    import android.webkit.CookieSyncManager;
    + P' H9 w; P, z7 Ximport android.webkit.CookieManager;

    : n' u$ R. U; H
  • 由于进行了重定向,所以您需要定义另一个方法,让经过验证的页面正常工作,如清单 5 所示。这些更新的结果如清单 6 所示。                $ T9 E7 H3 @, K2 i/ `6 L$ J  `; s
    . ~2 |8 s6 s4 I$ C
    清单 5. 添加这个 loadUrl 方法
  • public void loadUrl(String url) {
    * E$ U+ q6 }6 R, c# t0 Z8 d        loadUrl(url,false);
      m' {& Q( z! I- j- A: _2 ~        }
    . Y. N! U" x9 L4 \, ~' p/ i
    清单 6. WLPortalApp.java 的最终内容
  • package com.WLPortalApp;
    ; o! d& `: m5 y! R4 [9 Q% q
    $ G8 r  h' e4 V$ u+ wimport android.os.Bundle;! g" n3 t! E! [3 w5 R
    import android.webkit.CookieSyncManager;
    4 k% @1 ?0 w! V+ Z3 y  W+ rimport android.webkit.CookieManager;% f; c" S6 P0 O% l5 ^
    4 T6 n) a, n2 _$ B$ R0 t
    import com.worklight.androidgap.WLDroidGap;+ D1 l; q& d4 Q  t5 n
    * X- M" p; w$ @" E
    public class WLPortalApp extends WLDroidGap {( O1 i; }" r3 e: t3 N4 P3 d
            @Override
    4 H# C8 c0 x2 c' g4 e. f' M        public void onCreate(Bundle savedInstanceState) {8 [- _, \7 x" Q$ K7 w- a9 z
                       super.onCreate(savedInstanceState);. @7 T2 a& Z) t
                       CookieSyncManager.createInstance(appView.getContext());
    ; ?4 w1 G2 h0 f                   CookieManager.getInstance().removeSessionCookie();
    ' `9 _) f4 n: S* a' {8 E                   super.loadUrl("http://9.99.999.999:10039/wps/portal",false);
    ( J; X: C' e$ P        }        
    - S$ g8 x# D7 G( `        % A$ p7 Y/ G% F" @
            public void loadUrl(String url) {: @: e# |9 y$ X% c* T) J0 f6 j& z. A
                    loadUrl(url,false);
    ( a& x3 V; ]) E" M; a        }" G9 {- O( F8 v5 {* k
    }

    0 G) o6 @  N  N2 [+ {
  • 要确保所有链接都使用混合容器 Web 视图打开,可在 cordova.xml(位于 \WLPortal\apps\WLPortalApp\android\native\res\xml\cordova.xml)中将 stay-in-webview 首选项设置为:                    <preference name="stay-in-webview"                    value="true" />
      n6 X$ A$ U5 Y3 t8 Z7 p: D, x. t如果使用一个非本地门户服务器,那么也可修改此位置的安全策略。默认的安全策略是阻止所有网络访问。然后您可以声明对 cordova.xml 中特定网络域和子域的访问权限。这篇文章 提供了有关的更多信息。
  • 现在可再次右键单击应用程序,选择 Build All and Deploy。您将在 Eclipse 右下角的状态栏中看到进度。在完成该过程之后,请右键单击 WLPortalWLPortalAppAndroid 并选择 Run As... > Android Application。这将启动 Android 模拟器,应用程序将会显示您的 WebSphere Portal,如图 13 所示。                                                                  f( y  d3 }7 G' [% M& W+ J
    ! c* `; @2 X% W# h1 z$ v+ t# G. p; k
    图 13. 模拟器运行显示 WebSphere Portal 的应用程序
    . v: H0 \8 m  y/ f2 M% X
  • 现在,您需要获得一个定制主题,该主题基于您 之前 创建的 WebSphere Portal 8.0 主题。您还需要使用 WebDAV 实用程序来执行以下操作:; N- U4 a8 e, y; X
    • 更新主题模板 (theme.html)。
    • 将 Worklight JavaScript 文件复制到主题。
    • 创建将在一个新主题配置文件中定义的模块。
      6 s& T/ a: D; Z  F5 {
    启动 WebDAV 实用程序(我们为本示例使用了 AnyClient)并连接到 fs-type1 入口点。在加载它时,会显示如图 14 所示的文件夹结构。
    $ P8 ?' ^$ [. o8 P! `$ N
    + q) e% C0 {' [9 g! }' W
    ) c) e, @6 L7 `. S) p# f+ O  i图 14. fs-type1 的 WebDAV 文件夹结构
  • 导航到您的定制主题,比如 fs-type1:themes/<customTheme>。在定制主题内创建一个名为 worklight 的文件夹(图 15)。                                                               
    6 ]. O/ P1 u! O9 a2 H7 F+ @/ L
    , i# W% O% J9 k9 Y6 c8 u& Z2 @, D图 15. 创建的 worklight 文件夹: a/ x$ y) a0 P" l' _% k- ^
  • 在 Eclipse 中找到您将加载到 WebSphere Portal 中的 Worklight 库的 JavaScript 文件。这些文件夹名为 wlclientcommon,您可在 \WLPortal\apps\WLPortalApp\android\native\assets\www\default\ 下找到它们。将 wlclient 和 common 文件夹都复制到您在 WebDAV 上创建的 worklight 文件夹中。
  • 打开应用程序在您插入 WebSphere Portal URL 之前加载的主要 HTML 文件,它位于 \WLPortal\apps\WLPortalApp\android\native\assets\www\default\WLPortalApp.html。此文件中有两部分需要集成到 WebSphere Portal 中,因为该应用程序不再使用此文件。
    & q6 u1 \4 [! \! b4 _$ b1 j
    • 第一部分是 <head> 元素中包含的静态 JavaScript 文件(清单 7)。                " k( ?- D$ n) p

      $ P* j! K$ V  U# r  ~8 a$ X$ T; {  f4 l清单 7. WLPortalApp.html 的 head 元素中包含的静态 JavaScript
    • <script type="text/javascript">8 D$ L2 B! \) a9 U9 w0 C4 V* r
          // Define WL namespace.8 W- ?3 g: b' @' P- K- a
          var WL = WL ? WL : {};/ Q1 U0 a+ ^7 j" q, S  Z
      5 T  }' F" c: n  e1 j! Q  K
          /**4 I. ]- S! I. ?' A

      : f" n2 |! j3 v: Q7 I/ y     * WLClient configuration variables." m. p# B0 h$ b
      8 ?% T. V" G4 v1 F3 m- h
           * Values are injected by the deployer that packs the gadget.5 Z8 X, g# n0 W; c6 w4 Z* m
      - S/ m2 ~5 y# y2 T# b
           */
      0 b& s" d/ ]- _. ^9 _1 ?) y
      $ h4 b  A9 w& i( j; m: J    WL.StaticAppProps = {
      ( }+ R. ?8 n- ^$ U) b    "APP_DISPLAY_NAME": "WLPortalApp",- r  j% o7 T' F/ ]! E% u
          "APP_LOGIN_TYPE": "never",9 E6 l! A& \; _2 ]
          "APP_SERVICES_URL": "\/apps\/services\/",' ]" T; A+ @1 o4 q. ~1 `3 |
          "APP_VERSION": "1.0",: A* e2 }2 A7 X6 U9 ]
          "ENVIRONMENT": "android",( ?# q# O% g: K4 a; g0 x
          "LOGIN_DISPLAY_TYPE": "embedded",
      ( P+ a4 X4 d/ k    "LOGIN_REALM": null,3 f* o4 o* }7 y0 L$ O  t8 X, \
          "WORKLIGHT_ROOT_URL": "\/apps\/services\/api\/WLPortalApp\/android\/"
      3 Z1 d; U( l4 z. Q- ]};</script>
      3 V. K+ \5 S/ {2 A% ?/ Q2 S
    • 第二部分是 <body> 元素上的 onload 方法,它用于初始化 Worklight 客户端(清单 8)。               
      * |8 k6 N6 G# J- L* C+ P
        O. [& W: O& `8 b6 Y清单 8. 元素主体上初始化 Worlight JavaScript 的 onload 方法
    • <body id="content" style="display: none">

      , [0 Z8 A; N% b- }
      5 i! {1 X; q4 i9 _6 v
    这两部分都必须包含在主题中,作为一个模块的工件。获取此 HTML 文件中的 JavaScript,并以一种适用的方式将它包含在各个 JavaScript 文件中。在 Worklight 库的 <customTheme>/worklight/common/js 文件夹中创建两个新文件,分别名为 init.jsstaticprops.js(图 16):fs-type1:themes/<customTheme>/worklight/common/js/
    6 Y( F3 p* W! ^8 U+ `/ f! _7 ~/ p! L+ }9 J/ {! d# m3 {

    / }0 K2 T: y) k5 X0 Q0 G图 16. 创建新文件 init.js 和 staticprops.js
  • 将您刚才创建的 staticprops.js 文件复制到本地机器上并打开该文件(清单 9)。将静态 JavaScript 从 HTML 页面复制到此文件中。                8 r0 g4 U* z& v- d

    : S, N) P9 n" H; G6 V8 ~9 [) a' L清单 9. staticprops.js 文件的内容
  • var WL = WL ? WL : {};. ~# K! k3 U  `/ f
    WL.StaticAppProps = {, Y* z6 B  O2 i3 Z
        "APP_DISPLAY_NAME": "WLPortalApp",  ], P/ P& O' c
        "APP_LOGIN_TYPE": "never",
    # Q: q& u/ [& @% v    "APP_SERVICES_URL": "\/apps\/services\/",
    9 H, Y7 C2 k) B  V! o    "APP_VERSION": "1.0",  m  L7 ^1 U+ V: A" Z4 l! e
        "ENVIRONMENT": "android",9 i' F. }7 I0 s$ X" a
        "LOGIN_DISPLAY_TYPE": "embedded",
    * d! N. _9 @8 V* [    "LOGIN_REALM": null,
      _5 q* S/ Q6 G. q    "WORKLIGHT_ROOT_URL": "\/apps\/services\/api\/WLPortalApp\/android\/"
    " z& `% h$ |1 o/ a  k: y};

    7 h' _( R1 B$ m+ M+ C
    将更新的 staticprops.js 文件复制回 WebDAV 上的 <customTheme>/worklight/common/js 文件夹中。
  • 将您刚创建的 init.js 文件复制到本地机器上,并打开该文件(清单 10)。这里使用 i$ API(包含在 WebSphere Portal 主题中)创建一个 onload 函数,以便替换 HTML 页面中的内联 onload 方法。                4 e3 ^. Z' M3 ?/ k
    % E5 W2 z7 ^% F; z; @7 [: k. t
    清单 10. init.js 文件的内容
  • i$.addOnLoad(function(){        
    : p+ X# F/ K& ?  n9 ]        WL.Client.init({});
    ; e2 q# r4 H1 }) w/ v. Y8 ?});
    ! W" A; j% Z) A' S  l! |
    将 init.js 文件复制回 WebDAV 上的 <customTheme>/worklight/common/js 文件夹中。
    3 I% ]# ]' C! J% ~$ D请参阅 WebSphere Portal 8.0 Javadocs,了解 i$ API 的更多信息,参阅 WebSphere Portal 维基,了解 使用主题优化框架创建模块 的更多信息。
  • 需要在定义新主题模块之前创建的最后一个工件是测试 Worklight JavaScript 的示例。此示例将执行测试,确保 Cordova API 可在 WebSphere Portal 主题中使用,并且基于 Cordova API 中的示例集。            因为此示例仅用于测试该 API 在 WebSphere Portal 中的使用情况,并且重用价值有限,所以不需要为示例代码创建一个模块。可将该代码段直接放在主题模板中,然后将本地化的主题模板复制到您机器上。该主题模板位于 WebDAV 上的定制主题 fs-type1:themes/<customTheme>/nls/theme_en.html 中(图 17)。
    # B$ m+ f5 N* N" Y* I1 i3 Z: h% |" {0 O, t3 W$ Z- Q
    , L0 F) M  ~& N. `3 |3 d4 L. z; N8 x# }
    图 17. 要添加示例代码的本地化的主题模板, B* {/ G/ [+ p9 z
  • 打开主题模板并查找 <a rel="dynamic-content"                href="co:config"></a> 动态内容元素,该元素的位置靠近模板底部。将来自 Cordova API 的 deviceready 示例放在这个动态内容元素之后,如清单 11 所示。                  
    4 e* K9 s1 ?9 }4 x* ]
    ) ^6 h1 B, w# q9 u7 g, P3 F9 e清单 11. 在 WebSphere Portal 中测试 Cordova API 的示例
  •                                                 ! z: \7 |! q0 M- O
    <div class="wpthemeComplementaryContent" 9 d1 I$ B4 n0 U: Y
            id="wpthemeComplementaryContent"
    " ]1 D0 ^  N1 h7 Y3 F& Y3 o                role="region"   Z( \# Q9 ^6 A3 f* A( q$ b/ f- S5 t- u
                    aria-labelledby="wpthemeComplementaryContentText">
    3 v  B: [! j6 u5 v2 K) h; _* r  <span class="wpthemeAltText" id="wpthemeComplementaryContentText">( N7 b0 p6 |+ X$ _) u
            Complementary Content
    0 N0 A6 Y: d1 m: o3 i  </span>
    - h2 L; {- U$ ]* C9 T1 Q2 o$ ^/ {  <a rel="dynamic-content" href="co:config"></a>
    7 {/ d% G8 c; \8 {  <script type="text/javascript">: w" }$ M0 t; }+ p  y6 G
      document.addEventListener("deviceready", onDeviceReady, false);. \- k; i6 }/ D" U+ `
      function onDeviceReady() {        
    2 V! {! h) v# e        var element = document.getElementById('deviceProperties');
    ) u; [/ n3 r5 B0 v+ X# j0 Y        element.innerHTML = 'Device Name: '     + device.name + '<br/>' +
    8 W: ?# |& [, M' p* V, Z4 E: ~1 R2 w                            'Device Version: '  + device.version;! N. W$ Z+ W1 Y) v) U( X5 |
      }- i, v* T5 B( V8 e5 y
      <script>
    2 J4 S- U0 o) e* R</div>
    " U" s# v) [7 i) `8 \
  • 测试 Cordova 的 JavaScript 准备就绪后,您需要将一个显示设备信息的元素插入到主题模板中。在紧挨 <body> 元素的下方,将一个具有 ID "deviceProperties" 的元素放在主题模板中。清单 12 给出了一个示例。                # `5 b; ?  ]- H7 L# b3 p

    , r/ a" ^5 {# v& ]) a/ {清单 12. 主题模板中的设备属性元素
  • <p id="deviceProperties">Loading device info</p>
    ' {8 J8 j0 a1 t
  • 让主题模板一直处于打开状态,向 <body> 元素添加一个值为 “content” 的 ID(清单 13)。Worklight init 方法需要使用此 ID。                4 K5 U. p* o& s& U$ |  r
    " ~3 W" g! E$ `9 L0 ~* h
    清单 13. 将一个新 ID 添加到 body 元素中
  • <body id="content" class="lotusui30dojo tundra locale_en">

    + n1 t" J0 [* j) Y$ Q; ]
  • 现在来自 HTML 页面的内容和用于测试 Worklight JavaScript 的示例以独立文件的形式包含在主题中,您可将它们定义为新模块中的工件。为此,将新主题贡献 (theme contribution) 注册为 WebDAV 中的自定义主题下的 contributions 文件夹中的一个 JSON 配置文件。系统会自动才此文件夹中扫描这些文件,并且定义的贡献是为定义它们的主题而注册的。(如欲了解创建特定于主题的贡献的更多信息,请参阅 注册特定于主题的贡献。)- E) j: S2 _7 W& f) [& Y
    • 打开您的自定义主题下的 contributions 文件夹,创建一个名为 worklight.json 的文件。此文件应为以下内容分别定义两个新模块:
      ( h' s  G5 J- a* P2 |, ~/ x/ H
      • Worklight JavaScript 库文件
      • Worklight 初始化 onload 方法5 O/ g; M( i' |- q
      这两个模块将分别标识为 wl_clientwl_init
    • 将 worklight.json 文件复制到您的本地机器上,将清单 14 的内容放在此文件中。                ; q" P& _: W6 K5 O
      2 s& N% _1 ?; ?, m/ ]) G8 Z4 N
      清单 14. worklight.json 文件的内容
    • {! A8 A) x( E2 p2 `
         "modules":[{+ z9 {/ j7 @  I* n/ x
            "id":"wl_client",
      4 ^, ]' S- Y6 l- |, f. O      "contributions":[{
      ; G4 l) I2 l. v& f         "type":"config",
      3 s. M) C7 E5 ?7 H, b            "sub-contributions":[" k" \3 }3 l! E; Y
                  {. H1 t5 D2 X! K) ?, y% i
                     "type":"js",
      ( \0 o; u# A% w' Q* [' H               "uris":[{"value":"/worklight/common/js/staticprops.js"}]
      : g( t  R$ f) k            },
      . [) W- `7 z, C, u. r/ n            {
      ' @7 r  B7 }' I9 J; {( s! w               "type":"js",; k+ G, k, H* A
                     "uris":[{"value":"/worklight/wlclient/js/cordova.js"}]! ^2 n9 e/ X/ g$ |2 q
                  },
      7 Q9 _# A6 T; ~$ F            {
      6 M; E8 V7 z. [9 s: ~! @& {0 B               "type":"js",/ O/ I) h, l2 r; J3 m
                     "uris":[{"value":"/worklight/common/js/wljq.js"}]
      ) W& M5 Q! f) v+ u            },' C# y8 P: N9 }( E8 j; v$ Z
                  {# k  ~5 ^7 N" v. \9 I
                     "type":"js",2 W0 b! w( ~2 O  t) X
                     "uris":[{"value":"/worklight/common/js/base.js"}]
      1 w* m+ o# }; U/ F            },
      : |+ t" Q3 |4 `            {5 |- m$ b+ Q% M7 A3 r/ p# v
                     "type":"js",: S9 R- N7 |- k* p5 X  J
                     "uris":[{"value":"/worklight/wlclient/js/messages.js"}]5 d% B% Z+ W' o3 V, Q. Z/ D, V
                  },( q& u/ ]+ O3 K% W
                  {; a" i/ {) T) a2 p
                     "type":"js",' G) L5 A5 ~1 J4 }, y1 y9 h" d; A- q
                     "uris":[{"value":"/worklight/common/js/wlcommon.js"}]0 W6 |  ~1 ?) I" p8 e! i- d
                  },                                
      9 F6 c4 R( X/ R7 U4 j5 b0 U            {
      ( c7 g/ d( g$ J* `/ `- p5 K2 [               "type":"js",
      5 Q6 S; [7 g! h6 f) H               "uris":[{"value":"/worklight/wlclient/js/diagnosticDialog.js"}]
      + h5 t' Y" ~/ H8 g" I' {3 [6 l            },
      ! k# l0 c% |: O1 N) g. w2 q/ R            {, I. A0 A! K3 R9 X+ O' J  k
                     "type":"js",) Z5 S; I- Z7 ]+ S+ Q
                     "uris":8 _' n0 b  J8 n0 Y
                        [{"value":"/worklight/wlclient/js/deviceAuthentication.js"}]
      : k7 C2 k* T% `; U            },
      & E4 l5 W3 d* S2 S5 }" \            {/ }( A7 f; P  ~% A/ G% M
                     "type":"js",0 m- b/ z+ C5 a
                     "uris":[{"value":"/worklight/wlclient/js/window.js"}]8 `6 W* Q: E. M, q) }: B5 }1 ^
                  },8 q' l1 a5 F7 C! V9 P
                  {
      * _/ |* C* W' O% B               "type":"js",
      # l5 {! Q2 C1 ?2 d! E& T( B  a               "uris":[{"value":"/worklight/wlclient/js/worklight.js"}]
      : B3 h/ F; w5 ]. a            },
      4 O  y5 I0 C7 ^: l9 X0 A1 `+ L            {
      8 ^* b, e& j+ |2 l* P- W) p4 }2 C               "type":"js",
      2 [6 l: O4 j# t+ t* q$ O               "uris":[{"value":"/worklight/wlclient/js/wlclient.js"}]
      . G2 d( x9 W8 G            },
      7 @4 G9 R) t! z+ f3 i" T2 {% m: o            {4 J. e/ g5 E. O/ ^. P8 N
                     "type":"js",* T3 l# L- F6 z, S! x
                     "uris":[{"value":"/worklight/wlclient/js/wlfragments.js"}]
      % j7 M! u# G: y6 o) g            },1 L$ I. e1 J- ?- `6 E& `( \
                  {
      , n' y7 E7 {. L- ?8 w1 s8 u               "type":"js",8 p- d) V( K' p- u$ |8 w
                     "uris":[{"value":"/worklight/wlclient/js/encryptedcache.js"}]: H( z0 I% L( W+ s# _# G$ }8 q
                  },
      . z( z# a3 N4 H: V: d; D            {! F& O- W. v' E  S! ~9 t* g
                     "type":"js",; e7 T" a$ A% A( a
                     "uris":[{"value":"/worklight/wlclient/js/checksum.js"}]
      + K' N) i: f3 k# r            },7 k* T6 P, H# }5 x: X* ~& j& N
                  {$ h) O# a! w9 d' S3 }# s5 i% q  S
                     "type":"js",
      " Y, h8 g6 V& R6 \8 ?$ m               "uris":[{"value":"/worklight/wlclient/js/wlgap.android.js"}]
      8 s5 J; K* S' d% a: C6 E4 k; Y            }]9 [9 z1 v: C( S# x+ y
              }]
      8 C' H% O" u5 e) r! \4 h   },
      3 ^0 u+ g: E) X- ?) e$ @   {
      1 O# }0 r. j, W6 S! \      "id":"wl_init",! `, }, v. R" S
            "prereqs":[{
      ! P, E3 d* ^  a, }, S" `         "id":"wl_client"( t; L( K9 i6 C: C( N
            },{3 Q) x# K5 k+ p2 g9 O5 P! v1 Z& }
               "id":"wp_client_main"
      $ |* @. q* W: }4 U      },{
      % U& A" P+ q/ P6 B. U9 q         "id":"wp_client_ext": G( c' Z/ {$ e$ f4 Q
            }],+ T, n6 v5 E: K7 ]! {
            "contributions":[{
      , Q. }% Q5 `+ r3 [  L' f         "type":"config",& U7 M# P1 w8 P: k3 x
               "sub-contributions":[{  w9 p% T! Y0 [* G* C& o
                  "type":"js",
      + ~( C. r$ g" _. q9 ]            "uris":[{
      1 x( n! l  W$ a7 Z5 i1 s               "value":"/worklight/common/js/init.js"
      4 }1 _4 {! D2 v/ Y% o# T9 f& I: r            }]' O! b+ t2 N+ I
               }], E6 D% h5 a8 C" J' q1 R
            }]: X( O: K8 e6 P! C  T; Z
         }
        Y/ Y' ~/ }& j+ H) D' V! Z   ]
      7 ^- B/ Q  d$ b( z, A0 [}

      ' N! n( ~& Z5 i! z' D2 k$ B
    • 将 worklight.json 文件复制回 WebDAV 上的 <customTheme>/contributions 文件夹中。) P3 S9 ?0 D! e6 X
  • Worklight JavaScript 库现在已在主题模块中定义。测试 JavaScript 的示例直接放在主题模板中,所以它可在测试后轻松地删除,在配置文件中,针对示例代码的模块不是必需的。最后一步是获取这些模块并在主题配置文件中定义它们。创建一个新的配置文件,方法是打开自定义主题中的轻量型配置文件(位于 fs-type1:themes/<customTheme>/profiles/profile_lightweight.json)。将此文件复制到您的本地机器上并重命名为 profile_worklight.json
  • 打开 profile_worklight.json 文件,并添加您定义为贡献的 wl_client 和 wl_init 模块(清单 15)。               
    8 r0 f7 v: M) D1 h- J8 @7 {7 Q( R
    清单 15. 配置文件中定义的模块 ID 数组的示例
  • "moduleIDs": [8 k3 N$ }9 p: O  W8 K/ X" ^
                    "wp_theme_portal_80",
    % V' R  N3 B; g+ R3 {                "wp_portlet_css",
    2 j  g. j6 r& o# a. [                "wp_one_ui"," M; f( [, o) @9 H
                    "wp_one_ui_dijit",
    ! r: u9 u1 ^/ b                "wp_legacy_layouts",
    ! p5 k/ Z1 T; \% u  ?) @                "wp_client_ext",
    / F( X' A. g4 t& n                "wp_status_bar",) Y7 w% v2 T# X2 R* y
                    "wp_theme_menus",
    - `8 ^" k/ J% S$ P' {* e$ H: u                "wp_theme_skin_region",+ D6 h. k' k# h# o$ N( C* E
                    "wp_theme_high_contrast",' \/ ^" J) C; S( B- u
                    "wp_layout_windowstates",
    5 v5 B$ A( Y9 B5 f0 ]' o" q                “wl_client”,
    " m; C: O) q  [. j2 o# J                “wl_init”
    . }* T9 n% B' q3 N* Q" O/ |: L* a        ],

    7 V5 U- h3 M/ O6 i$ h+ a9 J! j
  • 重命名配置文件,以便您在页面属性对话框中进行选择时能够轻松地识别它。为此,找到英文标题(或您计划使用的语言)并将标题从  “Lightweight” 更改为 “Worklight”(清单 16 和清单 17)。                ( P1 U" O1 @4 B. d
    ( i6 D6 T6 ~/ G
    清单 16. 更改之前的配置文件标题
  • {
    7 I# a) g  Q8 L, o  m7 p        "value":"Lightweight",
    * v' \7 \# V+ `! e3 N$ r        "lang":"en". k5 L, G1 B1 f+ r% ?+ Q
    },
    7 P* f1 i, Z) m3 }4 S) ]' ^
    清单 17. 更改之后的配置文件标题
  • {- O& X1 ~3 h8 {. e( u  T
            "value":"Worklight",3 n# f& B* j+ T$ b
            "lang":"en") f! S; N  E* f! O( b3 y
    },
    + L0 [7 e( t- D
  • 将 profile_worklight.json 文件复制回 WebDAV 上的 <customTheme>/profiles/ 目录中。清除浏览器缓存,并重新启动 WebSphere Portal,确保已经启用了新配置文件。            在 WebSphere Portal 中应用 IBM Worklight JavaScript 所需的所有主题工件都已准备就绪。您现在可以获取定义模块的配置文件,以包含 Worklight 工件,并将它应用于某个页面。创建一个页面并应用您的自定义主题,如果您尚未这样做。(请参阅 页面创建和导航,了解创建页面的更多信息。)! t" D* T3 X7 A: o  a2 K
    可以通过两种方式将配置文件应用于页面,并查看您对 Worklight 的更改。您可:
    7 x) g8 g' m7 V- j
    • 将配置文件设置为主题默认设置。
    • 专门针对一个特定页面设置它。  e' ]2 ?  }6 R1 W# ~
    两种方法都有效,您都可以看到更改,但在一个特定页面上设置配置文件最简单。为此,打开可用于自定义的 Page Properties 对话框,并在 Advanced 选项卡上查找可用主题配置文件的下拉菜单(图 10)。(参阅 更改主题配置文件,了解有关的更多信息。)
    2 ?3 D$ t1 l$ H$ i( V  A) K5 c+ w( @" V0 J. J4 Y9 |3 s% O. y. j

    7 Y, `; T* ]4 @- g1 s# \$ }图 18. 页面属性对话框中的属性配置文件
    7 T4 _. G( X9 q. |% K* ]1 ?
      `+ M3 H" r. b* C3 t, ~1 w6 J  [- k' U, p5 X# e" m

, c9 `& s: @5 Z6 V

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 支持 反对

使用道具 举报

 楼主| 发表于 2013-3-12 20:35:23 | 显示全部楼层
使用 Android 模拟器测试混合应用程序6 k/ n" u, K& E9 {8 k9 s9 o. w
现在您已将配置文件应用于某个 WebSphere Portal 页面,您可使用 Android 模拟器测试该示例:
! x' R3 Y" B2 V: K; J( ]9 }* O
  • 再次右键单击应用程序并选择 Build All and Deploy 来部署和构建该应用程序。您可以在 Eclipse 右下角的状态栏中查看进度。
  • 在完成该过程时,右键单击 WLPortalWLPortalAppAndroid 并选择 Run As... > Android Application。这将启动 Android 模拟器,应用程序将会显示您的 WebSphere Portal。
  • 在该应用程序呈现 WebSphere Portal 应用程序后,如果您没有访问其应用 Worklight 配置文件的新页面的匿名访问权限,那么请登录并导航到该页面。这会花费几秒钟时间加载设备设置,但您会看到它们显示在页面顶部,如图 19 所示。                                                                , Z7 J# b- q. i$ @0 p5 h6 j1 g( ]
    , l6 ?9 Q' Z  Z9 W$ A3 P) \( n, y# P% Q
    图 19. Worklight 应用程序显示了 WebSphere 中的设备信息  B7 }0 V# f% Q1 l6 e2 U- @

    % W+ x4 F9 B3 |


3 V5 I2 X- |& T) X  Z4 C1 N: `
5 ~* G2 l& ~! X* @结束语; G" M5 L+ j* P) A; F* O' D! y0 X
IBM Worklight 使多渠道 Web 应用程序与设备和设备交付渠道交互变得非常轻松。Worklight shell 是设备上一个精简的原生客户端代码层,能够处理身份验证、安全性、应用程序启动和通知等任务,可针对某个组织或企业的特定需求而进行调整。该 shell 用于启动 Web 内容(应用程序的真正价值)。IBM WebSphere Portal 可将包含利用 Worklight 原生服务的标记的 portlet 与其他 portlet 聚合在一起。为此,将以标准方式提供 Worklight shell,并使其指向 WebSphere Portal 管理的网站。Worklight shell 也可封装为一个可交付程序,如果需要的话,还可以将它发布到一个应用程序商店中,或通过 MDM 部署它。结果是,您扩展了全面的 WebSphere Portal 多渠道网站管理功能,以包含原生设备服务。5 `( v8 z$ e- s: s* `" Z1 s' D( y
本系列中的后续文章将介绍如何在您的 WebSphere Portal 主题中利用原生功能,配置 Worklight 与 WebSphere Portal 之间的身份验证,通过 Worklight 和 Web 内容管理提供与您的设备社交服务的原生集成,以及使用 Worklight 改进您的 IBM Rational Application Developer 和 IBM Web Experience Factory portlet。
, w+ W9 N8 t2 Z7 o! {& }2 Y2 B* ^5 j0 D

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 支持 反对

使用道具 举报

 楼主| 发表于 2013-3-12 20:35:57 | 显示全部楼层
本帖最后由 技术狂人 于 2013-3-12 20:37 编辑 ( t1 v) x4 e/ y9 h
* r$ {: Q. C# |" y; `* N
下载# E( f* X% Z% k8 K6 j
描述名字大小
1 C  F* z9 s" d( E0 R
门户主题文件的样例8 KB
3 K; U* E2 d. Y% y( U: m& }% ~
应用程序的样例1 KB/ Y- G3 f, z9 A& w9 m& Y: E) a4 s

4 l0 v. x9 E! t& u% c

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 支持 反对

使用道具 举报

 楼主| 发表于 2013-3-12 20:38:16 | 显示全部楼层
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|小黑屋|手机版|无图版|SCMLife.com ( 京ICP备06056490号-1 )

GMT+8, 2018-1-16 20:37 , Processed in 0.084685 second(s), 8 queries , Gzip On, MemCache On.

Powered by SCMLife X3.4 Licensed

© 2001-2017 JoyShare.

快速回复 返回顶部 返回列表