vmworld 2013: vsphere ui platform best practices: putting the web client sdk into action
DESCRIPTION
VMworld 2013 Max Daneri, VMware Laurent Delamare, VMware Nimish Sheth, VMware Learn more about VMworld and register at http://www.vmworld.com/index.jspa?src=socmed-vmworld-slideshareTRANSCRIPT
vSphere UI Platform Best Practices: Putting the Web
Client SDK Into Action
Max Daneri, VMware
Laurent Delamare, VMware
Nimish Sheth, VMware
TEX4845
2
Disclaimer
This presentation may contain product features that are currently
under development.
This overview of new technology represents no commitment from
VMware to deliver these features in any generally available
product.
Features are subject to change, and must not be included in
contracts, purchase orders, or sales agreements of any kind.
Technical feasibility and market demand will affect final delivery.
Pricing and packaging for any new technologies or features
discussed or presented have not been determined.
3
Agenda
Review of vSphere Web Client architecture and extensibility
Plugin development experience from the field
SDK 5.5 changes
Roadmap
4
vSphere Web Client (VWC) Architecture Overview
VWC main characteristics for plugin developers
Open platform with a true web architecture
Extensibility at its core
• UI extensibility
• Data extensibility
Easy to build a unified user experience
• Consistent look & feel
• Data mash-ups
Rich SDK and developer tools
5
vSphere Web Client Architecture Overview
3-Tier Architecture
App Server
Solution 1 Solution N Backend for
Solution A vCenter
Server
vCenter
Server 1
Web Client (Flex)
Mid-tier app server (Java)
Access to vCenter and
other backend services
App Server App Server
6
Leveraging the UI and Java Platforms
vCenter 1.. N
Back-end Server
or Database
VWC UI plugins 3rd party plugins
• Plugin Architecture
• MVC Framework
• Data Access API
Web Client
App Server
(stateless) 3rd party services
• Data Manager
• Session Manager
• OSGI services
Java remoting (BlazeDS)
through secure AMF channel
vSphere Web Service SDK
Or any remote access to backend
Direct access is
possible but not as
well integrated
• Extension points
• Java services proxy
• Dependency injection
VWC services
VWC
platform
VMware
components
UI Platform
Java Platform
Partner
solutions
Back-ends
7
Data Extensibility & Client Commands
VM UI
Data Services
VM Service
myPlugin Adapter
Host UI
myPlugin UI
VC Adapters
Data Access Framework
myPlugin Service
vCenter 1.. N
(inventory service)
Back-end Server
or Database
Data Request
Events
Normalized
queries
Service calls
VWC
platform
VMware
components
Partner
solutions
Dispatching
Queries to back-ends
Aggregated
results
Web
Client
App
Server
Java to back-ends
Java Services Proxy
No complex business
logic
in server plugins
8
Extensibility Framework
Design Goals
Promote extensibility by design rather than implementation
Enable UI customization, consistency and easy navigation
Keep optimal footprint
• Lazy loading of metadata, resources & code modules
9
Extensibility Framework
Key Concepts
Extension Point
• Declaration of an extensible feature
Extension
• Implements an extension point
Plugin
• Bundle of metadata, code
and resources
Plugin package
UI plugin bundle1 (.war)
UI plugin bundle2 (.war)
Java service bundle3 (.jar)
Data adapter bundle4 (.jar)
3rd party library X (.jar)
plugin-package manifest (.xml)
my-packaged-solution (.zip)
10
Packaging & Deployment
Example of a plugin-package manifest
<pluginPackage id="com.vmware.samples.viewspropertiesui"
version="1.0.0"
name="Views Sample”
vendor="VMware" >
<dependencies>
<pluginPackage id="com.vmware.vsphere.client" version="5.5.0" />
</dependencies>
<bundlesOrder>
<bundle id="com.vmware.wsvim25" />
<bundle id="com.google.gson" />
<bundle id="com.vmware.samples.custompropertyprovider" />
<bundle id="com.vmware.samples.custompropertyui" />
<bundle id="com.vmware.samples.viewspropertiesui" />
<bundle id="com.vmware.samples.wssdkprovider" />
<bundle id="com.vmware.samples.wssdkui" />
</bundlesOrder>
</pluginPackage>
11
Packaging & Deployment
How do you deliver your new plugin to users?
1. Create a plugin-package .zip
2. Provide a script to register the plugin as a vCenter extension,
with a URL pointing to the plugin-package .zip location.
3. When a new user session starts, VWC finds your plugin and hot-
deploys it to the app server if necessary.
What about new versions?
Only the latest version of the plugin is deployed.
When a newer plugin version is registered the older one is
un-deployed automatically.
12
Extension Templates
A collection of pre-defined extension points and extensions
Out-of-the-box templates
• Instantiating an object workspace for new object types
• Instantiating a summary view
<!-- Chassis object view template instance.
Defines the object workspace (right hand side) for the Chassis object. -->
<templateInstance id="com.vmware.samples.chassis.viewTemplateInstance">
<templateId>vsphere.core.inventory.objectViewTemplate</templateId>
<variable name="namespace" value="com.vmware.samples.chassis"/>
<variable name="objectType" value="Chassis"/>
</templateInstance>
13
Extension Templates – Custom object workspace
14
Extension Filtering
Allows filtering based on runtime conditions
3 filters
• Object type
• Typically used for actions
• e.g. Show the extension only if the selected object is a VirtualMachine
• Object properties
• e.g. Show the extension only if the VM is FT enabled
• Privileges
• e.g. Show the extension only if the user has a specific privilege
15
Extension Filtering – Type Filter
<extension id="vsphere.core.vm.faultToleranceTurnOnActionSet">
<extendedPoint>vise.actions.sets</extendedPoint>
<object>
…
</object>
<metadata>
<objectType>VirtualMachine</objectType>
</metadata>
</extension>
Example of an action appearing only for VirtualMachine objects:
16
Extension Filtering – Privilege Filter
<extension id="vsphere.core.vm.ftView">
<extendedPoint>vsphere.core.vm.summarySectionViews</extendedPoint>
<object>
…
</object>
<metadata>
<privilege>VirtualMachine.Interact.CreateSecondary</privilege>
</metadata>
</extension>
Example of a portlet extension for users who have a specific privilege:
17
Extension Filtering – Object Property Filter
<extension id="vsphere.core.vm.ftView">
<extendedPoint>vsphere.core.vm.summarySectionViews</extendedPoint>
<object>…</object>
<metadata>
<privilege>VirtualMachine.Interact.CreateSecondary</privilege>
<propertyConditions>
<com.vmware.vsphere.client.filters.PropertyConditionsInfo>
<conditions>
<com.vmware.vsphere.client.filters.ComparisonInfo>
<propertyName>runtime.faultToleranceState</propertyName>
<comparisonOperator>EQUALS</comparisonOperator>
<propertyValue>enabled</propertyValue>
</com.vmware.vsphere.client.filters.ComparisonInfo>
</conditions>
<conjoiner>AND</conjoiner>
</com.vmware.vsphere.client.filters.PropertyConditionsInfo>
</propertyConditions>
</metadata>
</extension>
Portlet extension restricted to VMs with a specific property enabled:
18
Agenda
Review of vSphere Web Client architecture and extensibility
Plugin development experience from the field
SDK 5.5 changes
Roadmap
19
Demo
A real life plugin, which displays special VM guestOS information
which is not normally visible in the vSphere Client
20
My Challenges
vSphere Web Client extensions works in a different manner compared
to .NET client
vSphere Web Service SDK is used in a different way
• No need for WaitOptions, RetrieveServiceContent and login
(.NET lovers) .NET UI extensions are not possible, but a plugin can call
an external .NET web service
21
What I Learned from My Mistake
Start simple – don’t try to start creating complex and fantastic code,
start simple, your self-esteem will thank you
Don’t reinvent the wheel – everything needed to manage a vSphere
infrastructure is here, no need to develop strange server component
Read the documentation – example codes are very important but
sometime reading the doc is a must!
22
Agenda
Review of vSphere Web Client architecture and extensibility
Plugin development experience from the field
SDK 5.5 changes
Roadmap
23
Compatibility Story
Ground rules:
• vSphere Web Client works with the previous vCenter release
• Plugins are supported for at least one more VWC release
Compatibility w/ vCenter 5.0 vCenter 5.1 vCenter 5.5
VWC 5.1 OK OK No
VWC 5.5 No OK OK
Compatibility w/ VWC 5.1 VWC 5.5
Plugin + SDK 5.1 OK OK
Plugin + SDK 5.5 No (1) OK
(1) Cannot use 5.5 features in a plugin targeting VWC 5.1, otherwise it is OK.
24
SDK 5.5 Changes
New features
• Solution menus
• A better way to build solution-specific menus
• Action prioritization
• 2 new extension points to order or promote actions
• Finally possible to put a global action in the list toolbar
• AdvancedMouseEvent
• Listen to right-click events in your own widgets
• DisposeManager improvements and new extension point
• You can decide under which namespace your Flex objects will be GC’d
• Dialogs and Wizards
• Wizard data can be saved during the user session or across sessions
• But support limited to 5.5 for now because of upcoming platform changes
25
SDK 5.5 Changes (cont’d)
Other important changes
• Better samples
• Virgo updated to 3.6
• Spring Framework libraries updated
• Java version 1.7 (compile with target 1.6)
• Flash Player version >= 11.5
• Web-ContextPath must use this format: vsphere-client/plugin-name
• See [SDK]/docs/release-notes.html for all details
Your plugin package must now include a 5.5.0 dependency
<pluginPackage id="com.acme.acme-plugin" version="1.0.0”
name=”Acme solution” vendor=”ACME">
<dependencies>
<pluginPackage id="com.vmware.vsphere.client" version="5.5.0" />
</dependencies>
...
26
Agenda
Review of vSphere Web Client architecture and extensibility
Plugin development experience from the field
SDK 5.5 changes
Roadmap
27
SDK Roadmap
We’re moving away from Flex as UI technology
Our future HTML 5 platform will preserve your investments
The Java tier doesn’t change
You will be able to take several paths during this transition
• Keep using Flex UIs in the short term
• Mix Flex UIs with HTML
• Use only HTML/Javascript
• Stick with C# client Script plugins
28
SDK Roadmap (cont’d)
Flex UI plugins
• For the short term this is still the best way to integrate your UI with VWC
• The entire vSphere UI suite is using this!
• Will be supported by HTML 5 platform
• Except deprecated APIs
• Columns extensions and portlets have limitations
Use cases
• Continuing existing investment
• Starting a simple plugin
• Building a UI plugin for vSphere 5.1 and 5.5
Tips
• Reducing your UI code will make the transition easier
• For complex UIs consider mixing some HTML views
29
SDK Roadmap (cont’d)
C# client script plugins
• Can use HTML/Javascript
• Limited integration with the Web Client
• Fewer extension points, views displayed in separate tab Classis Solutions
• Security warning because of HTTPS link to external server
• Missing APIs (no callback into Flex)
• No Java service layer
• Will be supported in HTML 5 platform with some exceptions
Use case
• Re-using or enhancing an existing script plugin
• Writing a new plugin that must also work in the C# client
Tips
• All new development should focus on true Web Client plugin, with a Java
service layer, and a UI either in Flex or HTML
30
SDK Roadmap (cont’d)
New HTML/Javascript plugin support
• Coming with the existing VWC 5.5 platform!
• Full SDK support, all extensions are supported
• Easiest transition to future HTML 5 platform
• Use the HTML widgets and Javascript libraries of your choice
• Add or re-use Java services in the mid-tier
• Possible to mix Flex and HTML
Beta-release coming soon
31
HTML Bridge Overview
vCenter 1.. N
Back-end Server
or Database
Web
Client
App
Server
• Data Manager
secure AMF channel
vSphere Web Service SDK
UI Flex Platform
Java Platform
Partners Back-ends
VWC platform
VMware
Any remote access API
Html views invoked by bridge.
Javascript callbacks available
for some Flex APIs
REST apis to get/post
data with java controllers
Integration at the data level
is independent of the UI
rendering technology
VWC UI plugins 3rd party Flex plugins HTML plugins
HTML
Bridge • Data Access API
• Extension points
VWC adapters
3rd party controllers
3rd party data adapters
3rd party services
Controllers get data through
Data Manager, or call
services to access back-end
Solution can mix Flex & Html
HTTPS Ajax
32
HTML Bridge Demo
33
• TAP Access membership includes:
New TAP Access NFR Bundle
• Access to NDA Roadmap sessions at VMworld, PEX and Onsite/Online
• VMware Solution Exchange (VSX) and Partner Locator listings
• VMware Ready logo (ISVs)
• Partner University and other resources in Partner Central
• TAP Elite includes all of the above plus:
• 5X the number of licenses in the NFR Bundle
• Unlimited product technical support
• 5 instances of SDK Support
• Services Software Solutions Bundle
• Annual Fees
• TAP Access - $750
• TAP Elite - $7,500
• Send email to [email protected]
TAP Membership Renewal – Great Benefits
34
TAP
• TAP support: 1-866-524-4966
• Email: [email protected]
• Partner Central:
http://www.vmware.com/partners/partners.html
TAP Team
• Kristen Edwards – Sr. Alliance Program Manager
• Sheela Toor – Marketing Communication Manager
• Michael Thompson – Alliance Web Application Manager
• Audra Bowcutt –
• Ted Dunn –
• Dalene Bishop – Partner Enablement Manager, TAP
TAP Resources
VMware Solution Exchange
• Marketplace support –
• Partner Marketplace @ VMware
booth pod TAP1
THANK YOU
vSphere UI Platform Best Practices: Putting the Web
Client SDK Into Action
Max Daneri, VMware
Laurent Delamare, VMware
Nimish Sheth, VMware
TEX4845