CenterPoint Energy

Transcription

CenterPoint Energy

CenterPoint Energy –
Creating and exposing web
services over multiple media
James Gilpin
Technology Architect/CenterPoint Energy
CenterPoint Energy, Inc.
CenterPoint Energy operates in five primary businesses: electric
transmission and distribution, natural gas distribution, interstate natural
gas pipelines, field services, and competitive natural gas sales and
services
After a successful re-hosting of Natural/Adabas applications from the
mainframe in August 2009, CenterPoint Energy has been extending the
modernization of these applications by exposing them as web services to
clients such as mobile, laptop, desktop and other APIs. Exposure of the
business logic is through a combination of EntireX, Web Services Stack,
and wM ESB. The strategy for exposing these services and the discussion
regarding the implementation is the focus of this presentation.
27 June 2011 | ProcessWorld 2011 | 2
Mobile Strategy
In April, 2011, CenterPoint Energy started developing a Mobile Strategy.
As part of that strategy a number of standards were published and
teams are to adhere to those standards.
The strategy was targeted to mobile devices, but we found that it can be
extended to several media types. Whether desktop, mobile, B2B, many
of these same concepts are applicable.
Software AG product areas involved
Agenda
Discuss our strategy
The client interface
Client interface talking to web service
Web service and business logic
Other interfaces to same business logic
Other options – Event Replication (database level)
The Flow
FTP
HTTP
SMTP
FAX
Event Replication
Users
wM IS
EntireX
NATURAL
Developers
SPOD and NaturalONE
Strategy
Native vs. Web based applications
It will be necessary to evaluate the choice of application design tools,
user interfaces, and a variety of items that are dependent on the
application's intended target platform. This first decision will drive
the rest of the mobile strategy and is therefore the most important.
http://www.computerworld.com/s/article/9217296/Shock_Windows_8_optimized_for_desktop_tablets?taxonomyId=15
Web Based Applications
A more prudent choice would be the more universally accepted web
based application. By leveraging the growing momentum of HTML5,
CSS3, JavaScript, and AJAX, a web-based application can achieve
platform independence by gaining access to a device's functionality
and then mimicking the behavior of a native application. Designing
web applications to take advantage of web browsers instead of
specific devices increases the longevity of the application and
thereby reducing the overall costs of the typical project. There are
several other advantages to this approach, including the ability to
use the same web application on multiple devices with minor tests
for the type of browser the client has chosen to use.
Appendix A and B
The Client Interface
Mobile Web Browsers
Safari
The Apple Safari browser is HTML5 compliant, available for other
platforms, and stable. Testing the web application from a variety of
platforms is a plus for this browser.
Blackberry Bolt
RIM has changed their basic browser several times over the last 10 years.
The most recent incantation is called ‘Bolt’. It supports HTML5, Flash,
and a variety of options not previously available.
Google Android
A powerful web browser, but requires the Android operating system to
function.
Skyfire
Skyfire supports several types of mobile devices, including Android,
iPhone, and Windows Mobile.
User Interface
Keep the interface simple
Screen size and ability to provide input
data are the two most critical areas.
To make it easier for the user to
navigate through the web application,
use a common set of menu buttons
(home, logoff, etc.) on each page.
Buttons common to each screen should
be located in the same place. For
example,’ home’ or ‘main menu’
should be located in the top left hand
corner. The ‘logoff’ button should be
located in the top right hand corner.
Data Entry
To make it easier for the end user to enter required data, set the tab
index to flow the data input in the order the user would expect to be
normal. For example, tabindex=1, for user id; taxindex=2 for
passwords; etc.
Data crowding
Data crowding the screen does NOT enhance
the usability of an application. In many
cases, it serves to distract the user. Limit
the number input fields and columns of
table information. Font size should be large
enough to comfortable read. Avoid the
common mistake of reducing the font size
to fit more information as this leads to
clutter.
Appendix C
Client interface talking to the web service
Calling the Web Service
Execute these calls on the server, NOT the client machine
Security
Versioning
How?
Java Server Pages – WSDL2Java
Based on Apache AXIS2
Generates an object that provides you with simple set and get methods
.NET 4.0
.NET SDK, create a proxy to consume the web service
wsdl.exe
Using JAVA? WSDL2Java, part of Axis2 implementation
Generated files
//reading in the serviceshost file for the connection
Validate
DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance();
DocumentBuilder db = dbf.newDocumentBuilder();
Document doc = db.parse("http://localhost:8080/prototype/services.xml");
NodeList nl = doc.getElementsByTagName("serviceshost");
Reading an XML file via the web
String serviceshost = nl.item(0).getFirstChild().getNodeValue();
boolean validUser = false;
boolean validPW = false;
boolean oktocont=true;
CVALIDATResponse Cresponse = null;
if (request.getParameter("internetid") == null) {
oktocont=false;
validUser=false;
}
Pick up the user id and password
if (request.getParameter("internetpw") == null && (oktocont)) {
oktocont=false;
validPW=false;
}
Validate
if (oktocont) {
try {
CVALIDATStub stub = new CVALIDATStub(serviceshost + "/CVALIDAT");
Set target host and service
CVALIDATDocument.CVALIDAT CVALIDATrequest = CVALIDATDocument.CVALIDAT.Factory.newInstance();
CVALIDATrequest.setINTERNETID(request.getParameter("internetid").toUpperCase());
CVALIDATrequest.setINTERNETPW(request.getParameter("internetpw").toUpperCase());
CVALIDATDocument CVALIDATrequestDoc = CVALIDATDocument.Factory.newInstance();
CVALIDATrequestDoc.setCVALIDAT(CVALIDATrequest);
CVALIDATResponseDocument CVALIDATresponseDoc = stub.cVALIDAT(CVALIDATrequestDoc);
Cresponse = CVALIDATresponseDoc.getCVALIDATResponse();
Make the call to the web service
session.setAttribute("cvalidat", Cresponse);
if (request.getParameter("cmpy") == null) {
session.setAttribute("cmpy",53);
} else {
session.setAttribute("cmpy",Integer.parseInt(request.getParameter("cmpy")));
}
}
Appendix D and E
Web Service and Business Logic
Turning Business Logic into a Web Service
Business Logic
COBOL, Natural, ETC.
How?
EntireX
RPC Servers
webMethods Integration Server
Flow Service
Adapters
WSStack
EntireX Web Services Stack
Implementation of Axis2
Copy wsstack.war to servlet engine (ie. Tomcat)
Generate WSDL and AAR files from IDL
Publish Axis2 Archive files to wsstack
http://localhost:8080/wsstack/sagdeployer
wM Integration Server
Adapter Services for Natural
NaturalONE
Generate wM IS Connection from IDL file
Generate WSD
Appendix F and G
Other Interfaces
Other Interfaces
wM Integration Server
FTP/S – built in
ftp wmisaddress
cd namespacedir/folder/subfolder/service
put yourfile.xml
get resultfile.xml
SMTP – via external SMTP server
mailto: [email protected]
Subject: mywork:Service
Use body or attach xml file
HTTP/S – built in
http://server:port/invoke/folder.subfolder/service
File Polling
Be sure to define the ports and allow traffic via the appropriate firewalls
Other Options
Data Replication
ADABAS SQL Gateway
Direct access to the ADABAS files
ADABAS Event Replicator
Data warehouse built for adhoc queries, read only access
Performs initial state copy of entire file
Copies updates and deletes to SQL Server
Data Mapping – Replication
Table File
Common design used to store states, countries, area codes, zip codes, etc.
Infrequent changes
Built on record type and null suppression
Map subsets of data to individual SQL tables
Based on key criteria
tb_city_name > ‘ ‘
Descriptor to ADABAS file, only picks up those records with a city name
Be careful of ‘field abuse’
Verify counts after the initial load and after file changes
Data Dictionary Manager
Event Replicator
Don’t Forget to Visit the Solutions Hall!
Thank you!
Appendix A
The Client(s) - Show many choices, so little time
What are we talking about?
FTP
HTTP
SMTP
Users
Developers
Set your target! – Creating a Strategy
CenterPoint Energy
Majority of our users have mobile devices today
IBM had first device in 1992, called the Simon
Pager, Phone, Fax Machine, and PDA
Sold in 1994 for $899, in 15 states and 190 cities.
Blackberry, 1999
Four (4) operating systems currently dominate the market
Symbian OS (Ericson)
RIM OS (Blackberry)
Andriod (Google)
iOS (Apple)
Set your target! – Creating a Strategy
Worldwide sales recorded in 2010 and 2009
Trending toward Andriod and iOS
http://www.canalys.com/pr/2011/r2011013.html
http://www.gartner.com/it/page.jsp?id=1543014
Native vs. Web based applications
It will be necessary to evaluate the choice of application design tools,
user interfaces, and a variety of items that are dependent on the
application's intended target platform. This first decision will drive
the rest of the mobile strategy and is therefore the most important.
Native Applications
Designers targeting a specific set of devices will most likely choose to
use the design tools and templates provided by the vendor of those
devices. Apple, Google, and Microsoft have all provided
development tools specific to their device platform and operating
systems. In the case of Apple, the vendor has also developed a
unique download approach that requires Apple to approve the
application for use by users of the vendor’s devices. This can be
seen a restriction due to the methodology chosen by the vendor to
safeguard their operating system from hackers and fraudulent
applications. Google and Microsoft are not as restrictive, but do
have a certain set of requirements regarding development tools and
interface design restrictions.
Native Applications
Native applications are written to install on a mobile device and then,
as required, connect to gather data and business rules from remote
servers. This type of installation leads to upgrade requirements,
synchronization of data and business rules, and higher support costs.
The advantage of these types of applications is the use of the device
user interface and graphics. In the case of the iPhone (Apple) the
vendor provides a template design that gives the application the look
and feel of all the other applications installed on the device.
Native Applications
Creating native applications involves keeping a code base for each
mobile device. This leads to duplication of effort, multiple versions
of the same application, and multiple testing phases. It is strongly
recommended that the development of native applications be
avoided.
http://www.computerworld.com/s/article/9217296/Shock_Windows_8_optimized_for_desktop_tablets?taxonomyId=15
Web Based Applications
A more prudent choice would be the more universally accepted web
based application. By leveraging the growing momentum of HTML5,
CSS3, JavaScript, and AJAX, a web-based application can achieve
platform independence by gaining access to a device's functionality
and then mimicking the behavior of a native application. Designing
web applications to take advantage of web browsers instead of
specific devices increases the longevity of the application and
thereby reducing the overall costs of the typical project. There are
several other advantages to this approach, including the ability to
use the same web application on multiple devices with minor tests
for the type of browser the client has chosen to use.
Appendix B
What do these terms mean?
Languages
HTML5
HTML is the language that provides the structure and content for the
World Wide Web. HTML5 has been in the development stage for a
number of years. Several software vendors are conforming the
‘Working Draft’ specifications and the W3C (World Wide Web
Consortium) is expected to issue ‘Last Call’ in May, 2011; with a final
recommendation slated for 2014.
HTML5 provides an enhanced set of tags such as <canvas>, <video>,
<audio>, <nav>, <section>, <article>, and <header>. Previous
versions of HTML required the use of ‘id=’ and div tags to support this
same functionality.
It is recommended that ALL output be created using the HTML5
standards.
Languages
CSS3 – Cascading Style Sheets
Instead of defining all features in a single, large specification like CSS2, CSS3
is divided into several separate documents called "modules". Each module
adds new capability or extends features defined in CSS2, over preserving
backward compatibility. Work on CSS level 3 started around the time of
publication of the original CSS2 Recommendation. The earliest CSS3 drafts
were published in June 1999.
Due to the modularization, different modules have different stability and are
in different status. As of March 2011, there are over 40 CSS modules
published from the CSS Working Group. Some modules such as Selectors,
Namespaces, Color and Media Queries are considered stable and are either in
Candidate Recommendation or Proposed Recommendation status. Once CSS
2.1 is finalized and published as Recommendation, they are likely to go to
Recommendation as well.
http://en.wikipedia.org/wiki/CSS3#CSS_3
Languages
Javascript
Because JavaScript code can run locally in a user's browser (rather
than on a remote server), the browser can respond to user actions
quickly, making an application more responsive. Furthermore,
JavaScript code can detect user actions which HTML alone cannot,
such as individual keystrokes. Applications such as Gmail take
advantage of this: much of the user-interface logic is written in
JavaScript, and JavaScript dispatches requests for information (such
as the content of an e-mail message) to the server. The wider trend
of Ajax programming similarly exploits this strength.
http://en.wikipedia.org/wiki/Javascript
Languages
AJAX
AJAX (an acronym for Asynchronous JavaScript and XML) is a group
of interrelated web development methods used on the client-side to
create interactive web applications. With Ajax, web applications can
send data to, and retrieve data from, a server asynchronously (in the
background) without interfering with the display and behavior of the
existing page. Data is usually retrieved using the XMLHttpRequest
object.
Despite the name, the use of XML is not needed (JSON – JavaScript
Object Notation is often used instead), and the requests need not be
asynchronous.
Appendix C
Design Considerations
Mobile Web Browsers
Safari
The Apple Safari browser is HTML5 compliant, available for other
platforms, and stable. Testing the web application from a variety of
platforms is a plus for this browser.
Blackberry Bolt
RIM has changed their basic browser several times over the last 10 years.
The most recent incantation is called ‘Bolt’. It supports HTML5, Flash,
and a variety of options not previously available.
Google Android
A powerful web browser, but requires the Android operating system to
function.
Skyfire
Skyfire supports several types of mobile devices, including Android,
iPhone, and Windows Mobile.
Mobile Web Browsers
Internet Explorer Mobile
Microsoft has integrated the Bing search engine into the latest version of
their IE Mobile browser. It also supports HTML5, gesture touch
commands, and can display web sites in both ‘mobile’ and ‘desktop’
mode.
Opera Mobile
Opera Mobile is installed on a variety of smart phones, including HTC,
Nokia, Sony Ericsson, Samsung, and Motorola. Current implementations
do not document support for HTML5.
User Interface
Design Considerations
Easily accessible and user friendly are the key phrases to remember
when designing any web site. Designing web sites to be accessible by
mobile devices presents a set of unique challenges to the site
development team.
User Interface
Keep the interface simple
Screen size and ability to provide input data are the two most critical
areas. To make it easier for the user to navigate through the web
application, use a common set of menu buttons (home, logoff, etc.)
on each page. Buttons common to each screen should be located in
the same place. For example,’ home’ or ‘main menu’ should be
located in the top left hand corner. The ‘logoff’ button should be
located in the top right hand corner.
User Interface
<header>
<nav>
<ul>
<li><a href="menu.jsp">Menu</a></li>
<%
if (session.getAttribute("cvalidat") != null) {
%>
<li><a href="pointconfirmations.jsp">Point Confs</a></li>
<li><a href="querynoms.jsp">Noms</a></li>
<li><a href="logoff.jsp">Logoff</a></li>
<%
}
%>
</ul>
</nav>
</header>
#nav { margin-left:auto; padding-top:8px;}
#nav ul {list-style:none;}
#nav li {display:inline;}
#nav a, #navigation a:visited, #navigation a:active {display:block; float:left;
background:url(images/menu2.jpg) repeat-x; height:19px; padding:5px
15px 0 15px; margin-right:5px; color:#000; text-decoration:none;
border:solid 1px #999;}
#nav a:hover {background:url(images/menu1.jpg) repeat-x; color:#fff;
border: solid 1px #09c;}
#nav .active a {background:url(images/menu1.jpg) repeat-x; color:#fff;
border: solid 1px #09c;}
Data Entry
To make it easier for the end user to enter required data, set the tab
index to flow the data input in the order the user would expect to be
normal. For example, tabindex=1, for user id; taxindex=2 for
passwords; etc.
Simplify the design
Data crowding the screen does NOT enhance the usability of an
application. In many cases, it serves to distract the user. Limit the
number input fields and columns of table information. Font size
should be large enough to comfortable read. Avoid the common
mistake of reducing the font size to fit more information as this leads
to clutter.
User Interface
Bandwidth
The amount of data downloaded for an individual page can
dramatically affect the performance of the web site. Images,
embedded scripts, and data used for form elements should be
minimized.
Remember, your users may be paying $$$$ for bandwidth…
Graphics should be kept to a minimum and those used should be tested
for bandwidth considerations. This may mean reducing the quality of
an image to lessen the impact on the speed and data download
constraints of the current mobile broadband networks.
Storage Options
Cookies
Included in http request
Unencrypted
Limited to about 4kb of data
Storage Options
HTML5 Storage
Stores named key/value pairs locally, within the client web browser
Supported in IE8.0+, FIREFOX3.5+, SAFARI4.0+, CHROME4.0+,
OPERA10.5+, IPHONE2.0+ ANDROID2.0+
Implemented natively within browser, so available even when thirdparty browser plugins are not
Includes storage types: localStorage and sessionStorage
Useful for storing small amounts of data, but less useful for storing large
amounts of structured data
Limited to 5 MB of data storage
Stores data as strings
Error message that will be thrown if exceeded: “QUOTA_EXCEEDED_ERR”
Web developer cannot request more storage space, however, some browsers
(like Opera) allow the user to control the data storage size
Testing Options
MobiOne
Full development and testing suite
Testing Options
http://ipadpeek.com
Appendix D
Web Interfaces to the client
What are we talking about?
FTP
HTTP
SMTP
Users
Developers
Client Application
Client Application - Login
<form method=post action=validate.jsp>
Login
<table>
<tr>
<td align=right>ID:</td>
<td align=left><input type=text name=internetid tabindex=1 value=""></td>
<td align=right>
<select name="cmpy" size="1" id="cmpy" tabindex=4>
<%
String cmpy = request.getParameter("cmpy");
if ((cmpy == null) || (cmpy.equals("53"))) {
JSP code, executes on server
%>
<option selected value="53">CEGT</option>
<option value="60">MRT</option>
<%
} else {
%>
<option selected value="53">CEGT</option>
<option value="60">MRT</option>
<%
}
%>
</select>
</td>
</tr>
<tr>
<td align=right>Password:</td>
<td align=left><input type=password name=internetpw tabindex=2 value=""></td>
<td align=right><input type=submit value="Login" tabindex=3></p></td>
</tr>
</table>
</form>
//reading in the serviceshost file for the connection
Validate
DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance();
DocumentBuilder db = dbf.newDocumentBuilder();
Document doc = db.parse("http://localhost:8080/prototype/services.xml");
NodeList nl = doc.getElementsByTagName("serviceshost");
Reading an XML file via the web
String serviceshost = nl.item(0).getFirstChild().getNodeValue();
boolean validUser = false;
boolean validPW = false;
boolean oktocont=true;
CVALIDATResponse Cresponse = null;
if (request.getParameter("internetid") == null) {
oktocont=false;
validUser=false;
}
Pick up the user id and password
if (request.getParameter("internetpw") == null && (oktocont)) {
oktocont=false;
validPW=false;
}
Validate
if (oktocont) {
try {
CVALIDATStub stub = new CVALIDATStub(serviceshost + "/CVALIDAT");
Set target host and service
CVALIDATDocument.CVALIDAT CVALIDATrequest = CVALIDATDocument.CVALIDAT.Factory.newInstance();
CVALIDATrequest.setINTERNETID(request.getParameter("internetid").toUpperCase());
CVALIDATrequest.setINTERNETPW(request.getParameter("internetpw").toUpperCase());
CVALIDATDocument CVALIDATrequestDoc = CVALIDATDocument.Factory.newInstance();
CVALIDATrequestDoc.setCVALIDAT(CVALIDATrequest);
CVALIDATResponseDocument CVALIDATresponseDoc = stub.cVALIDAT(CVALIDATrequestDoc);
Cresponse = CVALIDATresponseDoc.getCVALIDATResponse();
Make the call to the web service
session.setAttribute("cvalidat", Cresponse);
if (request.getParameter("cmpy") == null) {
session.setAttribute("cmpy",53);
} else {
session.setAttribute("cmpy",Integer.parseInt(request.getParameter("cmpy")));
}
}
Validate
catch(Exception e) {
if (request.getParameter("trace") != null) {
e.printStackTrace();
}
So, it went terribly wrong
%> <img src=images/error.png alt="Error occured"><b>An occured, please accept out apologies.</b><%
if (request.getParameter("debug") != null) {
out.print("<pre>");
e.printStackTrace(new java.io.PrintWriter(out));
out.print("</pre>");
}
}
}
if (Cresponse != null) {
if (Cresponse.getRACFID() == "") {
response.sendRedirect("login.jsp?loginmsg=User ID and/or Password not matched");
} else {
response.sendRedirect("menu.jsp");
It worked, move on to ‘menu.jsp’
}
} else {
response.sendRedirect("login.jsp?loginmsg=The system is currently unavailable");
}
%>
Client Application
Data Crowding
Data Crowding
Error Handling
Error Handling
Appendix E
Creating the client side – WSDL2java
The Flow
FTP
HTTP
SMTP
Users
Developers
Using JAVA? WSDL2Java, part of Axis2 implementation
WSDL2Java: the stub
Generating the stub
Generated files
Combine the generated code into a single jar file
Place this in the path (lib?) of your client application
More info: http://today.java.net/pub/a/2006/06/22/axis-2-generated-client-code.html
Appendix F
NaturalONE - maintaining Natural and Web Services
The Flow
FTP
HTTP
SMTP
Users
Developers
What is NaturalONE?
NaturalONE
Single IDE with
multiple
perspectives
Appendix G
Generating the IDL and publishing the Web Service
Open the target Natural subprogram in the editor
Right click on the subprogram in the project listing
And select „Extract IDL“
The IDL will be presented in the editor window
Right click on the IDL and choose properties to set the Broker ID, etc.
Switch to the EntireX perspective
Right click the IDL object and
select Generate Web Service
Select the object(s) to deploy
Select your target WSStack
implementation
WSStack?
EntireX WSStack, implementation of
Axis2 used to publish web services.
Easy to use, testing, etc.
aar, wsdl, xmm?
Axis Archive - contains these compressed/archive files (.aar)
EntireX
TSTLIB.xmm
xml-init.xml
META-INF
MANIFEST.MF
services.xml
TSTLIB.wsdl
File Structure; Tomcat directories
How do you know if was deployed? - WSDL
Once deployed, test your XML
Testing the web service
Create a sample XML/SOAP document
Set the appropriate input values
Set the appropriate input values
View the resulting document
Errors are also returned as a XML document
End of Appendix Section

CenterPoint Energy

Transcription

Similar documents

Logging into ClassLink Outside of School

The Challenges of Hybrid Apps and Games

Mise en page 1

Resume - Designwave

Case study: Star Swipe HTML5 Game, CBBC Interactive

Presentation - The Nest i/o

horsing - Le Bocage Normand

Recommended Internet Explorer 7 Browser Settings

SPECYFIKACJA FORM REKLAMOWYCH GRY - GRY

Untitled - Content admin

Tech Forum - Episerver

Intermediate Blackboard Building Block Development

Learn Basic HTML5