BC440 DevelopingInternetApplicationComponents

BC440 DevelopingInternet
Application Components
BC440
Release 640 04/05/2006
0
BC440 Developing Internet Application
Components
BC440
Developing
Internet Application
Components
SAP AG 1999
R/3
Release 4.6
Date: January 2000
Material number: 5003 4855
0.2
Copyright
Copyright 2004 SAP AG. All rights reserved.

No part of this publication may be reproduced or transmitted in
any form or for any purpose without the express permission of
SAP AG. The information contained herein may be changed
without prior notice.
SAP AG 2004
Some software products marketed by SAP AG and its distributors contain proprietary software components of
other software vendors.
Microsoft, Windows, Outlook, and PowerPoint are registered trademarks of Microsoft Corporation.
IBM, DB2, DB2 Universal Database, OS/2, Parallel Sysplex, MVS/ESA, AIX, S/390, AS/400, OS/390, OS/400,
iSeries, pSeries, xSeries, zSeries, z/OS, AFP, Intelligent Miner, WebSphere, Netfinity, Tivoli, and Informix are
trademarks or registered trademarks of IBM Corporation in the United States and/or other countries.
Oracle is a registered trademark of Oracle Corporation.
UNIX, X/Open, OSF/1, and Motif are registered trademarks of the Open Group.
Citrix, ICA, Program Neighborhood, MetaFrame, WinFrame, VideoFrame, and MultiWin are trademarks or
registered trademarks of Citrix Systems, Inc.
HTML, XML, XHTML and W3C are trademarks or registered trademarks of W3C, World Wide Web
Consortium, Massachusetts Institute of Technology.
Java is a registered trademark of Sun Microsystems, Inc.
JavaScript is a registered trademark of Sun Microsystems, Inc., used under license for technology invented and
implemented by Netscape.
MaxDB is a trademark of MySQL AB, Sweden.
SAP, R/3, mySAP, mySAP.com, xApps, xApp, and other SAP products and services mentioned herein as well as
their respective logos are trademarks or registered trademarks of SAP AG in Germany and in several other
countries all over the world. All other product and service names mentioned are the trademarks of their respective
companies. Data contained in this document serves informational purposes only. National product specifications
may vary.
These materials are subject to change without notice. These materials are provided by SAP AG and its affiliated
companies ("SAP Group") for informational purposes only, without representation or warranty of any kind, and
SAP Group shall not be liable for errors or omissions with respect to the materials. The only warranties for SAP
Group products and services are those that are set forth in the express warranty statements accompanying such
products and services, if any. Nothing herein should be construed as constituting an additional warranty.
0.3
ABAP Workbench
Level 2
3 days
BC402
ABAP Programming
Techniques
3 days
BC404
ABAP Objects: Object Oriented Programming in R/3
BC405
3 days
Techniques of List
Processing and InfoSet
Query
BC400
5 days
ABAP Workbench:
Foundations and
Concepts
MBC40
2 days
Managing ABAP
Developments Projects
BC410
Programming
User Dialogs
5 days
BC420
Data Transfer
5 days
BC412
3 days
Dialog Programming
using EnjoySAP Controls
BC430
ABAP Dictionary
2 days
BC460
3 days
SAPscript: Forms Design
and Text Management
SAP AG 1999
CA610 (Rel. 4.0) 2 days

CATT:Test Workbench and
Computer Aided Test Tool
BC490
3 days
ABAP Performance
Tuning
2 days
BC415
Communication
Interfaces in ABAP
BC425
3 days
Enhancements
and Modifications
BC470
2 days
Form Printing Using
SAP Smart Forms
Level 3
BC414
3 days
Programming
Database Updates
Recommended supplementary
courses are:
Business Process Technologies
CA925, CA926, CA927
BC095 (Business Integ. Techn.)
BC619 (ALE), BC620, BC621
0.4
Course Prerequisites
Required:
SAP50 - Basis Technology
BC400 - ABAP Workbench: Concepts and Tools
BC410 - Developing User Dialogs
Recommended:
Knowledge of HTML
SAP AG 1999
0.5
Target Group
Audience:
Project teams with ABAP experience who want to know how

the R/3 System can be connected to the WWW using the
Internet Transaction Server.
SAP consultants and partners working with customers who

want to connect R/3 to the WWW.
Duration: 5 days
SAP AG 1999
User notes:
The training materials are not teach-yourself programs. They complement the course instructor's
explanations. On the sheets, there is space for you to write down additional information.
1
Course Overview
Contents
Course Goal
Course Objectives
Course Content
Course Overview Diagram
Main Business Scenario
SAP AG 1999
(C) SAP AG
BC440
1.2
Course Goal
This course will prepare you to:

Use the Internet Transaction Server (ITS) for using
R/3 with the World Wide Web

Explain the programming models for ITS-based
Internet applications
Use HTMLBusiness
SAP AG 2001
(C) SAP AG
BC440
1.3
Course Objectives
At the conclusion of this course, you will be able to:

Outline requirements for transactions on the
WWW
Describe the architecture of the Internet
Transaction Server
Design and implement a WebTransaction
Develop WebRFC-enabled function modules
SAP AG 1999
(C) SAP AG
BC440
1.4
Course Content
Preface
Unit 1
Course Overview
Unit 2
Introduction
Unit 3
Internet, Intranet and

WWW
Unit 4
Unit 5
HTML, CSS and

JavaScript
Internet Transaction
Server
Unit 6
ABAP Workbench
Basics
Unit 7
SAP GUI for HTML
Unit 8
EasyWebTransactions
Unit 9
ITS Flow Logic
Unit 10
HTMLBusiness
Unit 11
Summary and Outlook
Appendices
SAP AG 1999
(C) SAP AG
BC440
1.5
Course Overview Diagram
7 Web RFC
8 Administration
Server
4 HTML
3 Internet, Intranet and WWW
9 Summary and Outlook
1 CourseOverview 2 Preface
6 Web
Transaction
SAP AG 1999
(C) SAP AG
BC440
1.6
Main Business Scenario
Each course participant will develop their own on-
line travel agency with:

HTML pages:
Containing hyperlinks, images, and forms
CSS and JavaScript
Connection to R/3:
Online flight information system with

booking function
SAP AG 1999
(C) SAP AG
BC440
2
Introduction
Contents:
Connecting R/3 and the Web
Internet Transaction Server (ITS)
Programming models
SAP AG 1999
(C) SAP AG
BC440
2.2
Introduction: Unit Objectives
At the conclusion of this unit, you will be able to:

List the requirements for connecting components
between the World Wide Web and R/3
Describe the concept of the Internet Transaction
Server (ITS)
SAP AG 1999
(C) SAP AG
BC440
2.3
Overview Diagram Preface
7 Web RFC
8 Administration
5
4 HTML
Internet
Transaction
Server
6 Web
Transaction
SAP AG 1999
(C) SAP AG
BC440
2.4
Overview: Connecting R/3 and the Web
Connecting
Connecting R/3
R/3 and
and the
the Web
Web
Internet
Transaction Server
Server (ITS)
(ITS)
Programming
Programming Models
Models
SAP AG 1999
(C) SAP AG
BC440
2.5
R/3 Client/Server Architecture
Presentation
Application
Database
SAP GUI
...
...
DIAG
SAP AG 1999
Application solutions can be divided into three functional areas - presentation, application logic and
data storage. The design of the software allows all three components to run on separate systems.
The R/3 System can distribute presentation, application logic and data storage to different computers.
The prerequisite is the three-tier client/sever architecture of the R/3 System:
The database server is installed on a central computer, and the processes presented in the database
service run from here.
Several application servers can be connected to the database server. The actual application logic is
processed on the application servers.
Several presentation servers (frontend) which users work on can be connected to each application
server. All presentation tasks are carried out on these individual computers.
(C) SAP AG
BC440
2.6
R/3 With Web Connection
Presentation
Application
Database
SAP GUI
...
Web browser
...
Web
server
?
HTTP
(HTML)
DIAG
SAP AG 1999
(C) SAP AG
BC440
2.7
Connection Between HTTP Server and R/3
Communication with
R/3
WS
the HTTP server
the R/3 application

server
User administration for R/3

logon
Conversion of R/3 data into
HTML pages
Status management
Synchronization of R/3
SAP AG 2001
(C) SAP AG
BC440
2.8
Connecting to the Web
Inside out
?
Outside in
SAP AG 1999
(C) SAP AG
BC440
2.9
Where is the Transaction Logic?
SAP R/3
System Help
Inside out
HTTP
server
Booking no. 561966

Cancel
Internet
Transaction
Server
BAPI
Program
Outside in
BAPI
Business
object
SAP AG 1999
(C) SAP AG
BC440
2.10
Overview: Internet Transaction Server (ITS)
Connecting
Connecting R/3
R/3 and
and the
the Web
Web
Internet
Transaction Server
Server (ITS)
(ITS)
Programming
Programming Models
Models
SAP AG 1999
(C) SAP AG
BC440
10
2.11
R/3 Client/Server Architecture with ITS
Presentation
Application
Database
SAP GUI
ITS
...
Web
server
...
Web browser
HTTP
(HTML)
DIAG
SAP AG 1999
The Internet Transaction Server extends the three-tier client/server structure of the R/3 System to the
Internet.
With a SAP GUI the R/3 System can be used simultaneously with the Internet Transaction Server.
(C) SAP AG
BC440
11
2.12
Web Browser
GUI for Internet Application

Components
Requirements:
HTML 3.2 or later
Supported products:
Windows 95 or Windows NT
Microsoft Internet Explorer 4.0
Netscape Communicator 4.0
SAP AG 1999
All current Web browsers that can interpret at least HTML version 3.2 are suited for communication with
the Internet Transaction Server.
Microsoft Internet Explorer 4.0 is required for "interactive WebReporting".
Browser enhancements (such as Java-Applets and ActiveX) are not required.
(C) SAP AG
BC440
12
2.13
The Web Server
Interface to the World

Wide Web
ITS
R/3
Requirements:
CGI interface or
ISAPI (Microsoft) or
NSAPI (Netscape)
Availability:
Web
server
Third party suppliers
SAP AG 1999
Supported Web servers:

Microsoft Internet Information Server: 3.0, 4.0 as of ITS 2.1
Netscape Enterprise Server: 3.0
Netscape Enterprise Server on 5 different UNIX Web servers (CGI interface)
Connecting the Web server to the ITS:
CGI - Common Gateway Interface: Standard interface to connect the Web server to an executable
program on the same computer
ISAPI - Internet Server API: Interface developed especially for Microsoft's Internet Information
Server to use DLLs on the same computer (DLL = Dynamic Link Library).
NSAPI - Netscape Server API: Interface developed especially for Netscape's Server to use DLLs
on the same computer.
For further information see units "Internet, Intranet and WWW" and "Internet Transaction Server".
(C) SAP AG
BC440
13
2.14
Internet Transaction Server
Link between the

WWW and R/3
R/3
WS
Converts R/3 data

into HTML pages
Requirements:
Internet
Transaction
Server
Server based on Intel
Windows NT
Server 4.0
Availability:
(server components CD)
R/3 installation
www.saplabs.com
SAP AG 1999
For details about availability and up-to-date information see:

http://service.sap.com/sap-its
Customers and partners can also order the CDs in SAP-OSS:
Subject area: XX-SER-SWFL-SHIP
You must specify an installation number.
(C) SAP AG
BC440
14
2.15
R/3 System
Business
transactions
WS
ITS
Requirements:
R/3
System
Release 3.1G
or higher
Internet
Applications
Components (IAC)
Instead of R/3, you can

use other mySAP.com
components such as
BW, API, KW etc.
SAP AG 1999
All R/3 Releases from 3.0D can be used with all ITS Releases. For details and restrictions see Note
80074.
(C) SAP AG
BC440
15
2.16
Overview: Programming Models
Connecting
Connecting R/3
R/3 and
and the
the Web
Web
Internet
Transaction Server
Server (ITS)
(ITS)
Programming
Programming Models
Models
SAP AG 1999
(C) SAP AG
BC440
16
2.17
SAP's GUI Strategy
SAP GUI
for the Windows
environment
SAP GUI
for the Java
environment
SAP GUI
for HTML
ITS
R/3
System
SAP AG 1999
(C) SAP AG
BC440
17
2.18
IACs and SAP GUI for HTML
IAC
IAC
Internet
Internet
Application
Application
Components
Components
WebTransactions
WebTransactions
Transactions
for
WebTransactions
WebRFC
WebRFC
Function
modules
for WebRFC
SAP
SAP GUI
GUI
for
for HTML
HTML
Entire R/3
functionality
R/3
R/3
SAP AG 1999
With the Internet Transaction Server, R/3 functions can be mapped into the Internet in three different
ways:
If an R/3 program is created especially for Internet users, it is called an Internet Application
Component (IAC). These include WebTransactions and WebRFC. IACs are not complex and they are
easy to use.
WebTransaction - special internet-enabled transactions that make a part of the whole R/3
functionality available to Internet users.
WebRFC - special function modules that can read and present data directly to the Internet user
The SAP GUI for HTML enables you to use almost all the R/3 functions in the Web browser. The
high level of complexity of R/3 transactions is also supported.
(C) SAP AG
BC440
18
2.19
EasyWebTransaction (EWT) Components
SAP R/3
System Help
CGI
LH
Carrier ID:
HTTP
DIAG
SAP R/3
System Hilfe
100
HTTP
Web
browser
CGI
HTTP
server
DIAG
ITS
Carrier name:
Lufthansa
200
1 Screen =
1 Template =
1 HTML page
R/3
HTML
Service Business
file
templates
SAP AG 1999
EasyWebTransactions consist of three components: R/3 transaction, service file and HTMLBusiness
templates. Complex EasyWebTransactions have more components. For simplicity these are not shown
on the above slide.
The R/3 transaction is created especially for use by the ITS:
Only use "simple" screens that can be easily converted into HTML
The transaction must allow synchronization through the ITS
Use a special technique to provide users with input help in HTML forms
Users must be able to log on to the Internet while the transaction is being processed
The business logic can be created quickly using BAPIs
The service file contains information required by the ITS to log on to the R/3 System and to start the
transaction.
(C) SAP AG
BC440
19
2.20
WebRFC
R/3
HTTP
CGI
RFC
WebRFC-enabled
function module
HTTP
Web
Browser
CGI
HTTP
server
RFC
ITS
Lufthansa
WebRFC
templates
1 call =
1 HTML page
WebRFC
SAP AG 1999
WebRFC is based on an RFC connection between the ITS and the R/3 application server
(RFC = remote function call).
The ITS transfers a parameter table to a special RFC-enabled function module in R/3 and in response
receives a table that represents either an HTML page or a MIME object.
(C) SAP AG
BC440
20
2.21
SAP GUI for HTML Components
SAP R/3
System Help
CGI
LH
Carrier ID:
HTTP
DIAG
SAP R/3
System Help
100
HTTP
Web
browser
CGI
HTTP
server
DIAG
ITS
Carrier name:
Lufthansa
200
R/3
1 screen =
1 HTML page
Service
file
HTML
Business
functions
SAP AG 2001
SAP GUI for HTML enables almost every R/3 transaction to be executed in the Web browser. All
screen elements (and controls) are automatically converted into HTML pages.
(C) SAP AG
BC440
21
2.22
Focus of this Course
Internet
InternetTransaction
TransactionServer
Server
ITS
Internet
InternetApplication
ApplicationComponents
Components
Web
WebTransactions
Transactions
WebRFC
WebRFC
SAP
SAPStandard
Standard
modifications
modifications
Customer
developments
SAPGUI
SAPGUI
for
forHTML
HTML
SAP AG 1999
(C) SAP AG
BC440
22
2.23
Preface
Connecting
Connecting R/3
R/3 and
and the
the Web
Web
Internet
Transaction Server
Server (ITS)
(ITS)
ITS
ITS and
and SAP's
SAP's GUI
GUI strategy
strategy
ITS
ITS and
and mySAP.com
mySAP.com
SAP AG 1999
(C) SAP AG
BC440
23
2.24
mySAP.com Overview
Company or
organizational
boundary
Marketplace
Marketplace in
in
www.mySAP.com
www.mySAP.com
Workplace
Workplace
e-Community
e-Community
Marketplaces
Marketplaces
Information
Information and
and services
services within
within
the
the company
company
Information
Information and
and services
services outside
outside
the
the company
company
SAP AG 2001
The mySAP.com Workplace supports employees by providing the right information and applications
through a mouse click and using an interface that is easy to understand, use and adapt to personal needs.
The mySAP.com Workplace has the following features:
Single point of access - one point of access to applications, information and services using a Web
browser
Personalized and role-based user interface
Easy integration
Openness and flexibility
Access from anywhere at any time
The mySAP.com Marketplace
Enables all business processes to be carried out on one level (One-Step-Business) - at any time,
anywhere and with any business partner.
Contains a cross-industry horizontal marketplace as the basis for cooperation between business
partners.
Contains a range of vertical and regional marketplaces for specialized business between groups with
common interests, such as the oil and gas industries.
(C) SAP AG
BC440
24
2.25
mySAP.com Workplace
Frontend
Workplace middleware
WP
engine
HTTP
ITS
1
Browser
HTTP
Backend systems
WP
server
Component
system 1
ITS
R/3
BW
BBP
APO
HTTP
ITS
...
...
Component
system 2
KW
CRM
...
SAP AG 1999
When an employee accesses the functions on a backend system (e.g. R/3) from his/her Workplace the
following components are involved:
The Web browser communicates with the HTTP server that is running on a remote computer. The
connection is established across the Internet or Intranet.
The information about the Workplace (user role, personalization) is held on the Workplace server.
The employee logs on to the Workplace once only (Single Sign-On).
The Internet Transaction Server (ITS) sets up the connection between an HTTP server and an SAP
backend system.
Other ways to access an SAP backend system are:
SAP GUI for the JAVA Environment: Can run in the Web browser, allows direct access
Windows terminal client: Can run in the Web browser, access via a frontend server
SAP GUI for the Windows Environment: Direct access from a Windows workstation computer
(C) SAP AG
BC440
25
2.26
Introduction: Unit Summary
You are now able to:

List the requirements for connecting components
between the World Wide Web and R/3
Describe the concept of the Internet Transaction
Server (ITS)
SAP AG 1999
(C) SAP AG
BC440
26
3
Internet, Intranet and WWW
Contents:
Internet Technology
World Wide Web
Security in the Internet
Intranet
SAP AG 1999
(C) SAP AG
BC440
3.2
Internet, Intranet and WWW: Unit Objectives

Define the basic components of Internet
technology
List the differences between the Internet and
WWW
Understand what HTTP requests and HTTP
responses are
List security issues
SAP AG 1999
(C) SAP AG
BC440
3.3
Overview Diagram - Internet, Intranet and WWW
7 Web RFC
8 Administration
5
4 HTML
Internet
Transaction
Server
6 Web
Transaction
SAP AG 1999
(C) SAP AG
BC440
3.4
Overview: Internet Technology
Internet
Internet Technology
Technology
World
World Wide
Wide Web
Web
Security
Security in
in the
the Internet
Internet
Intranet
Intranet
SAP AG 1999
(C) SAP AG
BC440
3.5
The Internet - The Network of All
Networks
Internet
SAP AG 1999
The Internet is a network of computer networks. It is operated by:

Governments in various countries
Research and educational institutions
Private companies
armed forces
Other organizations
Internet Engineering Task Force (IETF), the organization representing the above organizations, is
responsible for standardizing the communications protocols used. (http://www.ietf.org).
These standards are published as Requests for Comments (RFC). Following discussions with the
"Internet community" they are enacted. They can, however, later be amended or replaced with new
RFCs.
(C) SAP AG
BC440
3.6
The Communications Protocol: TCP/IP
Internet
TCP/IP =Transmission Control Protocol / Internet Protocol

Developed and standardized in 1970 in the USA
Used by almost all hardware and operating systems
Enables different systems to be connected
SAP AG 1999
IP - Internet Protocol has the following task:

Addressing - Controls the transport of data packets from the sender to the receiver
TCP - Transmission Control Protocol is responsible for:
Fragmentation - Breaks down a message into data packets before it is sent and reassembles the
message at the receiver
Basic data transfer - Converts a data flow into data packets
Reliability - Ensures that the data packet is delivered to the receiver
Flow control - Controls the data flow process (e.g. how many packets the receiver should get)
Multiplexing - Handles several connections to one computer
Connections - Establishes connections and disconnections
RFCs (Request for Comments)
IP is defined in RFC 791.
TCP is defined in RFC 793.
(C) SAP AG
BC440
3.7
The IP Address
A four-byte address that uniquely identifies each computer

in the Internet worldwide (in the future: 16-byte address)
The IP address consists of:
Network ID (1-3 bytes)
Host ID
(remaining bytes)
IP Address
193.78.135.91
IP Address
142.16.172.83
SAP AG 1999
IP requires a globally unique address to transmit a data packet between the sender and receiver.
The address consists of four bytes:
Network ID - the first one to three bytes
Host ID - the remaining byte(s)
The more bytes that are used for the network ID, the fewer computers (hosts) can be managed in the
network.
If a computer is transferred to a different network, its IP address changes.
The Network Information Center (NIC) in each country assigns network IDs. (Worldwide:
http://www.internic.net, Germany http://www.nic.de). Network providers can freely
assign host IDs.
In the future, it is planned to extend the IP address to 16 bytes because not enough addresses can be
assigned with four bytes to meet the increasing demand.
(C) SAP AG
BC440
3.8
Router - Connects Two Networks
Network
142.16
Network
193.78.135
IP Address
193.78.135.91
IP Address
142.16.172.83
A router connects two networks
Two network cards
Two IP addresses (one from each network)
SAP AG 1999
Within the same network, IP packets can be delivered directly to the receiver.
Routers are used to send IP packets from one network to a different network.
Routers know the topology (architecture) of the Internet and therefore know which networks to use to
send a packet to a receiver in a remote network.
Data packets from one sender can be routed along different paths to the same receiver, for example, if a
network fails or is overloaded. TCP ensures that the packets are delivered in the same sequence.
(C) SAP AG
BC440
3.9
Domain Name System (DNS)
Problem:
IP addresses are difficult to remember and change frequently
Solution:
A globally unique name is assigned to an IP address (letters and

words)
Walldorf
R
WDF
PC12
PC55
.com
Palo Alto
Singapore
PC34
pc12.wdf.sap.com
Host name
Network
Domain
SAP AG 1999
The Network Information Center (NIC) in each country assigns domain names as well as network
IDs
Codes for countries (ISO 3166) are the top-level domain: de, fi, jp
Top-level domains in the USA:
com companies
edu schools, universities
gov governmental bodies
mil military
org
other organizations
net special networks
See appendix for further information.
(C) SAP AG
BC440
3.10
Services in the Internet
Email
News
Internet
World Wide Web (WWW)
File transfer (FTP)

Remote login (Telnet)
SAP AG 1999
Email - electronic mail can be sent to, or received by, anyone connected to the Internet. Images and
other "binary" objects can be sent as well as text.
Based on SMTP (Simple Mail Transfer Protocol). See RFC 821.
News - electronic discussion groups or bulletin boards. Users can write something on any topic and other
users can read it and respond to it. There are thousands of news groups and the number of them
increases daily.
Based on NNTP (Network News Transfer Protocol). See RFC 977.
World Wide Web - multimedia information service using text, pictures, video and sound. Easy-to-use
graphical user interface.
Based on HTTP (Hypertext Transport Protocol). See RFC 2068.
File transfer - used to exchange files (text, pictures, etc.) directly between two computers.
Based on FTP (File Transfer Protocol). See RFC 959.
Remote login - used to logon directly to the user interface of a remote system via the Internet. For
example, to run programs or edit files in the remote system.
Based on Telnet. See RFC 854.
(C) SAP AG
BC440
10
3.11
TCP Ports
IP Address
142.16.1.9
Mail server
News server
WWW server
Internet
Software
Hardware
Logical
TCP port
SAP AG 1999
Logical ports are used to provide different Internet services on the same computer.
All inbound data packets have the same destination IP address but the port number assigns them to the
correct (software) server.
The standard port numbers for Internet services are defined in RFC 1060.
21 - FTP (File Transfer Protocol)
23 - Telnet
25 - SMTP (Simple Mail Transfer Protocol)
80 - HTTP (Hypertext Transport Protocol)
119 -NNTP (Network News Transfer Protocol)
(C) SAP AG
BC440
11
3.12
TCP/IP - The Data Packet
Address
Addressdata
data
Usage
Usagedata
data
IP address
TCP port
Sender
161.78.135.91
1031
Receiver
142.16.172.83
80
SAP AG 2001
Note: The above graphic has been simplified for this course. In reality, the header of a TCP/IP data
packet also contains many other fields.
A connection from one IP address/TCP port to another IP address/TCP port is also called a socket.
(C) SAP AG
BC440
12
3.13
The Web Browser
Software used to access the Internet
Requests data from Internet servers (client/server structure)
Presents the information received (such as text, pictures and sound)
Sends data to Internet servers (such as mail and news)
Sends data
Web
Webbrowser
browser
Receives data
Internet server
SAP AG 1999
A Web browser enables you to communicate with Internet servers that provide a range of services.
Web browsers should really be called Internet browsers because they do not merely communicate with
World Wide Web servers (HTTP servers). But as their main task is to communciate with WWW servers,
the term Web browser is generally accepted.
A browser must be able to:
Communicate with DNS servers
Generate TCP/IP packets
Receive TCP/IP packets
Present data received (text, images, sound, etc.)
Other desirable functions:
Buffer data already received locally
List connections recently
(C) SAP AG
BC440
13
3.14
URL Uniform Resource Locator
Access to different data objects in the Internet

URLs for HTTP, FTP:
service://host.domain[:port]/pathname
http://www.xyz.com/information/list.html
ftp://ftp.abc.xyz.com/pub/programs/
URLs for mail and news

mailto:username@host
news:newsgroup
SAP AG 1999
URLs contain information that the Web browser requires to access a data object on the Internet:
Service - Name of the Internet service
host - name of the server that is to provide the service
port - port number if different from the standard (optional)
pathname - name of the object on the server
URLs for mail and news refer implicitly to the current mail or news server. For this reason you do not
have to enter the name of the server.
(C) SAP AG
BC440
14
3.15
Overview: World Wide Web
Internet
Internet Technology
Technology
World
World Wide
Wide Web
Web
Security
Security in
in the
the Internet
Internet
Intranet
Intranet
SAP AG 1999
(C) SAP AG
BC440
15
3.16
What is The World Wide Web?
One of the services on

the Internet
Multimedia: uses text,
images, videos and
sound
Pages contain links
(hyperlinks) to other
objects
Uses graphical user
interfaces
SAP AG 1999
The WWW was developed in 1989 at CERN (European Laboratory for Particle Physics) to enable
researchers to access documents worldwide (text, images, etc.).
Only the page setup of a document is described in the WWW and not its actual appearance. This
enables a page to be displayed on different hardware platforms.
Hyperlinks enable users to access information on globally distributed WWW servers.
(C) SAP AG
BC440
16
3.17
HTTP Hypertext Transport Protocol
HTTP is the application protocol of the WWW service
Handles transmission between HTTP client and HTTP server
Based on TCP/IP
Is stateless
Defines methods to data objects
HTTP request
HTTP
HTTPclient
client(browser)
(browser)
HTTP response
HTTP
server
SAP AG 1999
HTTP functions as a client/server application. After each request from a browser (client) to a server a
response ensues.
HTTP is stateless, after each request-response-cycle the server "forgets" the client. The next request
from the same client is handled as though it were the first request from this client.
HTTP 1.1 is defined in RFC 2068.
(C) SAP AG
BC440
17
3.18
Data packet
Response
Request
Data packet
HTTP Messages and Methods
GET
Message header:
<method> <URL> <ver.>
<name1>:<value>
<name2>:<value>
...
Requests data object
POST
Message body:
...
Processes data object
PUT
Message header:
<ver.> <status> <reason>
<name1>:<value>
...
Message body:
<one data object:
text, picture, sound...>
Sends data object
DELETE
Deletes data object
HEAD
Requests message header without

message body
SAP AG 1999
Abbreviations on the above slide:

<Method>
HTTP method
<URL>
URL (Uniform Resource Locator) of the data object
<Ver.>
Protocol version. For requests this specifies the latest version of the client used.
For responses, the version that the server used
<Status>
Status after the request (see below)
<Reason>
Reason phrase = reason for the status
Status categories (quoted from RFC 2068)
1xx - Informational: Request received, continuing process
2xx - Success:
The action was successfully received, understood and accepted
3xx - Redirection: Further action must be taken in order to complete the request
4xx - Client error: The request contains bad syntax or cannot be responded to
5xx - Server error: The server failed to respond to a valid request
Examples of status 'reason phrase:
200 OK; 204 No content, 403 Forbidden; 505 HTTP Version not supported
(C) SAP AG
BC440
18
3.19
HTTP Server Cache Function
s89/pc.html
s89/tv.html
PC12
PC55
s67/car.html
Cache A
S89
Cache B
S67
s67/bike.html
s67/ship.html
s67/car.html
PC34
Principle: present
SAP AG 1999
Each computer on the Internet that forwards HTTP requests can store them together with the responses
in a local cache. If the same request is received again the response can be taken directly from the cache.
Multi-level caching is possible and does not create problems.
See appendix for further information
(C) SAP AG
BC440
19
3.20
Browser History
History buffer
PC12
pc.html
tv.html
Internet
products.html
welcome.html
-
Test if original changes
Always
Once per session
Never
Principle: History
SAP AG 1999
Web browsers store data objects received for the first time on the local hard disk. If the user requests the
same object again, it is loaded from the hard drive, instead of sending a request to the Internet.
An HTTP cache functions in a completely different way. The cache always indicates the current status on
the server whereas the history buffer always indicates a past status that does not necessarily correspond
with the current status on the server.
You can configure what happens when data objects are fetched from the Internet. Three options are
usually available:
Always - The history buffer is not used at all
Once per session - An object is requested once from the Internet and then stored in the history buffer.
If it is requested a second time, it is taken directly from the history buffer.
Never - The history buffer is never deleted, not even when the browser is started again. All requests
are fetched from the history buffer provided that the data object has already been stored there.
(C) SAP AG
BC440
20
3.21
Cookies - Memory for HTTP
HTTP cookie
Up to four Kbytes of data (not "executable")
Can be sent from a server with an HTTP response
Is sent automatically with the next request from the client back to the
same server
Request
Response
Request
HTTP client (browser)
HTTP server
SAP AG 1999
Characteristics of HTTP cookies:

Can by-pass HTTP statelessness
Can be up to four KBytes of data (ASCII or binary, but not 'executable').
Sent with an HTTP response from a server
A server can freely specify the contents of a cookie. For example, serial numbers for the status of a
transaction.
Cookies cannot be requested from a server. Only the browser can send a cookie together with a
request. This is done automatically for all requests to the server that received the cookie.
'Life span'
Non-persistent - The browser keeps the cookie only in its memory. At the end of the browser
session the cookie is lost.
Persistent - The browser stores the cookie on the local hard drive, so that it is available again in
the next browser session. The server assigns the cookie an expiration date after which the browser
does not send the cookie.
Browsers can be configured so that they ask the user whether cookies should be accepted. Name,
contents and expiration date are displayed.
For further information on the misuse of cookies see the appendix.
(C) SAP AG
BC440
21
3.22
Overview: Security in the Internet
Internet
Internet Technology
Technology
World
World Wide
Wide Web
Web
Security
Security in
in the
the Internet
Internet
Intranet
Intranet
SAP AG 1999
(C) SAP AG
BC440
22
3.23
Security Aspects in the Internet
Access control
Network and file access authorization
Confidentiality
Data encryption
Authentication
Unique identification of network users
Integrity
Data cannot be corrupted during transfer
Proof of sender and receiver (non-repudiation)

Ascertains that a message exists
SAP AG 1999
Security issues in 'everyday life':

Access control - Who is allowed to drive your car or live in your house?
Confidentiality - Do you use letters or postcards to send personal news?
Authentication - Are you sure who the sender is of an order that has just arrived in your company?
Integrity - Are you sure that no-one has added, changed or deleted an item in the order?
Sender and receiver proof - Do you want confirmation that an important message has arrived or is it
sufficient just to have sent it?
(C) SAP AG
BC440
23
3.24
Controlling Access Firewall
Network
142.16
Network
193.78.135
IP address
IP address
Firewall
SAP AG 1999
A firewall is a special router.

A firewall controls the data flow between two networks by checking the TCP/IP data packets:
IP filtering firewall:
IP address and TCP port of the sender
IP address and TCP port of the receiver
Application level firewall
Service used
Data division contents
After checking against negative and positive lists, the data packets are either forwarded or rejected.
(C) SAP AG
BC440
24
3.25
Encryption Process
Symmetrical encryption
Characteristics : Confidentiality
One key for encryption and decryption and the key must
be sent via a secure connection
Fast algorithms
Example: DES (Data Encryption Standard) 56-bit key
Asymmetrical encryption
Characteristics : confidentiality, authentication and

integrity
Pair of keys: public key for decryption, private key for

encryption
Complex, slower algorithms
Example: RSA (after the inventors Rivest, Shamir and

Adleman)
SAP AG 1999
Symmetrical encryption:
Advantage:
Fast algorithms
Disadvantages:
The shared key must first be exchanged via a secure connection.
Anyone who intercepts the key can corrupt the message data as well as read it. The message
receiver will not be aware of this.
Asymmetrical encryption:
Advantage:
Messages can neither be read nor corrupted
Disadvantages:
Complex algorithms
Public keys of all the communication partners must be maintained
See appendix for further information
(C) SAP AG
BC440
25
3.26
SSL and HTTPS
SSL (Secure Socket Layer) enhances TCP/IP

SSL has the following characteristics:
Authentication
Confidentiality
Connection is structured with asymmetrical

encryption using certificates
Symmetrical encryption after secure data exchange
Integrity
An integrity test is part of the protocol
HTTPS is HTTP on SSL
SAP AG 1999
SSL is a protocol from Netscape to enable secure communication on the Internet.

SSL is an additional layer between the application protocols (HTTP, SMTP, Telnet, FTP, and NNTP) and
the transmission protocol TCP/IP.
HTTPS is a variant of HTTP that uses SSL.
URLs for HTTPS connections begin with https://.
The standard port number for HTTPS is 443 instead of 80 for 'normal' HTTP.
Example of certification instances in the Internet: www.versign.com
(C) SAP AG
BC440
26
3.27
Overview: Intranet
Internet
Internet Technology
Technology
World
World Wide
Wide Web
Web
Security
Security in
in the
the Internet
Internet
Intranet
Intranet
SAP AG 1999
(C) SAP AG
BC440
27
3.28
Internet and Intranet
Network based
on TCP/IP
Network based
on TCP/IP
Many networks
are linked
Internal network
in company
Global IP addresses
Local IP addresses
Internet
Intranet
SAP AG 1999
Internet technology can link computers regardless of their hardware and software.
Within a company network, this technology can also be used to enable simple information exchange
despite heterogeneous hardware and software.
IP addresses within a company network can be freely allocated, provided that the computers are not to be
directly connected to the Internet.
(C) SAP AG
BC440
28
3.29
Controlling Access to an Intranet
TER
Internet server
Internet
TRA
Intranet server
PC12
FW
PC55
Intranet
Firewall
SAP AG 1999
In the above example, a firewall (server FW) controls access to the Intranet.
Only TCP/IP data packets with the destination Internet server (TER) are routed to the Intranet. All other
accesses from the Internet are rejected.
The computers within the Intranet (PC12, PC55) can access the Intranet server (TRA) as well as the
Internet server (TER).
However, the internal computers cannot access the Internet for two reasons:
The internal IP addresses are not valid in the Internet
A data packet that returned from the Internet as the response to a request is blocked by the firewall.
(C) SAP AG
BC440
29
3.30
Proxy - Connection to the Internet
proxy 5139
s89
80
data
data
to the Internet
pc12
13
s89
80
PROXY
S89
Internet
s89
80
proxy 5139
data
data
5139 pc12 13
6074 pc55 21
HTTP
7731 pc34 15 cache
...
...
...
from the Internet
data
data
PC12
Intranet
s89
80
pc12
13
data
data
SAP AG 1999
A proxy is a special firewall with two functions:

It controls access from the Internet into the Intranet
It provides computers on an Intranet with access to the Internet
Internally assigned IP addresses are not valid on the Internet.
The proxy is the only computer whose IP address is known on the Internet.
The proxy maps internal IP addresses to TCP ports and vice versa.
Combination with an HTTP cache for access to the Internet is normal.
(C) SAP AG
BC440
30
3.31
Internet, Intranet and WWW
Unit Summary

Define the basic components of Internet
technology
List the differences between the Internet and
WWW
Comprehend what HTTP requests and HTTP
responses are
List security issues
SAP AG 1999
(C) SAP AG
BC440
31
4
HTML - Hypertext Markup Language
Contents:
HTML - Basics
Formatting with Cascading Style Sheets (CSS)
Images, hyperlinks, tables, and frames
Input using HTML forms
JavaScript
SAP AG 1999
(C) SAP AG
BC440
4.2
HTML: Unit Objectives

Create HTML pages
Use Cascading Style Sheets
Create images, hyperlinks, and tables
Define HTML forms and pass form input to CGI
programs
Explain how JavaScript can be used in HTML
pages
SAP AG 1999
(C) SAP AG
BC440
4.3
Overview Diagram HTML
7 Web RFC
8 Administration
5
4 HTML
Internet
Transaction
Server
6 Web
Transaction
SAP AG 1999
(C) SAP AG
BC440
4.4
Overview: HTML Basics
HTML
HTML Basics
Basics
Formatting
Formatting with
with Cascading
Cascading Style
Style Sheets
Sheets
Images,
Images, Hyperlinks,
Hyperlinks, Tables,
Tables, and
and Frames
Frames
Input
Input Using
Using HTML
HTML Forms
Forms
JavaScript
JavaScript
SAP AG 1999
(C) SAP AG
BC440
4.5
HTML Hypertext Markup Language
Graphical description language for WWW documents

The document description is:
Stored as a text file in the file system of the HTTP server
Sent as an HTTP response from the server
Interpreted by the client (Web browser)
Header size 1
Header size 2
Header size 3
<head>
<title>title of page</title>
</head>
<body>
<h1>header size 1. </h1>
<img src="saplogo.gif" alt="Logo">
</body>
HTTP client (Web browser)
HTTP server
SAP AG 1999
HTML - Hypertext Markup Language

Describes the logical structure of a page, not the actual appearance of the page
Is platform-independent
Is an implementation of SGML (Standard Generalized Markup Language)
Has been used in the WWW since 1990
HTML is standardized by the World Wide Web Consortium (W3C) and the Internet Engineering
Task Force (IETF) (http://www.w3.org).
There are several versions (here the last two):
HTML 3.2 - W3C Recommendation (January 1997)
HTML 4.0 - W3C Recommendation (April 1998)
Developers of Web browsers have added their own enhancements
HTML pages:
Are simple text files
Can be stored, in a static state, in the file system on the WWW server or generated at runtime by CGI
programs
Can be written with simple text editors or with publishing tools
(C) SAP AG
BC440
4.6
HTML - Basic Structure
Basic structure
<html>
<head>
<title>Club Piranha Holidays</title>
</head>
<body>
<h1>Welcome to Club Piranha Holidays</h1>
We can offer you  incredibly
<em>exciting</em>
holidays
...
...
</body>
</html>
SAP AG 1999
HTML tags
Begin with < and end with >
Most tags consist of an opening part (<tag>) and a closing (</tag>) part. With many tags you can omit
the closing part.
Unknown tags and parameters are ignored by Web browsers.
Are case-insensitive
Many commands can contain parameters in the opening part:
Example: <span id="special">Special font</span>
Parameters are separated by a space
If parameter values contain a space they must be enclosed in " "
Formatting can only be done with HTML tags. Note:
More than one consecutive space will be reduced to one single space
Line breaks are ignored in the text file
Comments in HTML:

(C) SAP AG
BC440
4.7
Head and Body
Head
<head>
<title>Club Piranha Holidays</title>
<link rel="stylesheet" href="styles.css">
<meta name="..." content="..." http-equiv="...">

</head>
Body
<body>
...
</body>
SAP AG 1999
The <head> of an HTML page contains basic information about the page. They include:
<title> - Title of the page that appears in the title bar of the Web browser. This title is also used for
navigation in the history buffer and for saving URLs. If <title> is not specified the URL of the
page is used instead.
<meta> - HTTP-specific data that is part of the HTTP header. Web browsers interpret this
information as if it had been sent with the HTTP header
<base> - Base URL that all hyperlinks used on the page are based on.
<link> - Hyperlinks for the document, for example, to a style sheet (see later in this unit)
The <body> of an HTML page contains the actual contents of the page.
For further information see current documentation on: http://www.w3.org.
(C) SAP AG
BC440
4.8
Overview: Formatting Using CSS
HTML
HTML Basics
Basics
Formatting
Formatting with
with Cascading
Cascading Style
Style Sheets
Sheets
Images,
Images, Hyperlinks,
Hyperlinks, Tables,
Tables, and
and Frames
Frames
Input
Input Using
Using HTML
HTML Forms
Forms
JavaScript
JavaScript
SAP AG 1999
(C) SAP AG
BC440
4.9
Formatting Text
<h1>largest heading</h1>
Paragraph
<p>This is the first paragraph

<p>This is the next paragraph
Highlighted
<em>example</em>
Bold
<b>Text</b>
General area
(see CSS)
<span id=...>Two words</span>
SAP AG 1999
Note that if you use small numbers for <h1> to <h6> you choose large fonts, while if you use small
numbers for <font> you choose small fonts.
For further tags see current documentation on: http://www.w3.org.
(C) SAP AG
BC440
4.10
CSS Cascading Style Sheets
Defining styles centrally:
body { background-color: rgb(255,255,255);
font-family: Arial }
a:link { color: rgb(0,0,153) }
a:visited { color: rgb(153,0,0) }
a:active { color: rgb(0,0,255)
h1, h3, h5 { color: rgb(0,0,153)}
Using styles:
<head>
<link rel="stylesheet" href="styles.css">
<style> h3 { color: rgb(0,204,51) } </style>
...
</head>
</ st yl e>
References should always precede local definitions!
SAP AG 1999
CSS (Cascading Style Sheet ) is a simple style sheet mechanism that allows authors and readers to
attach style (e.g. fonts, colors and spacing) to HTML documents.
The CSS1 language is human readable and writable. It expresses style in common desktop publishing
terminology.
One of the fundamental features of CSS is that style sheets cascade. Styles can be stored on the Web
server or defined in individual HTML pages. Users can also define their own personal style sheets to
adjust for human or technical restrictions. Usually local definitions overlay global definitions.
CSS, like HTML, is standardized by the World Wide Web Consortium (W3C)
(http://www.w3.org).
(C) SAP AG
BC440
10
4.11
Example
We can offer you an <em>unforgettable</em> holiday:

<p> - <b>sport:</b> Go jogging in the desert without water
<p> This week:
<font color="red">'Choose a candidate'</font>
How many paragraphs?

Which text is displayed in bold?
Which text is emphasized?
SAP AG 1999
(C) SAP AG
BC440
11
4.12
Images on HTML Pages
Embedded in a page
Welcome to the
HTML chapter
<h2>Welcome ...</h2>
<img src="sap.gif"
alt="SAP Logo"
width=177
height=67>
As background (e.g. in <body>)
<style>
body {background-image:
url("sap.gif")}
</style>
Welcome to the
HTML chapter
SAP AG 1999
Parameters of the <img> tag

src: URL of the image (see next page)
alt: Text is displayed while loading (see next page). This text is also displayed when the display of
pictures has been turned off in the Web browser or the specified URL does not jump to an image.
width and height
Width and height of image to be displayed
If you specify a different size to the original image, the Web browser will increase /decrease the image
size in proportion.
Even if an image is to be displayed in a smaller size, its full size has to be retrieved from the Internet.
If you specify only one of the two parameters, the Web browser calculates the size of the other
parameter, so that the width to height ratio is retained.
If the width and height are specified, the Web browser can still display the page while the image is
being loaded (see page after the next page).
(C) SAP AG
BC440
12
4.13
URL - Uniform Resource Locator
General structure including the name of the server

http://www.xyz.com/information/info.gif
On the same HTTP server
welcome.bmp
In the same directory
/abap/sap.gif
Absolute path on server
../../design.jpg
Relative to current file
Directory without specification of file name (only for hyperlinks)

folder/
Depends on server configuration:

Error message Default page (e.g. home.html)
Contents of directory in an HTML page
SAP AG 1999
Most HTTP servers can configure a response to a request which only contains a directory name without
a file name in its URL. To do this you would choose one of the settings below:
Development: Display directory contents
Test: Display a default page or, if there is not one, display the directory contents
Productive Operation: Display a default page or, if there is not one, display an error message
(C) SAP AG
BC440
13
4.14
Images on HTML Pages - HTTP Procedure
HTTP
server
HTTP
HTTPclient
client
Header size 2
Header size 3
HTML page info.html
SAP Logo
<h2>header size 2 </h2>

<h3>header size 3 </h3>
<img src="sap.gif"
alt="SAP Logo"
width=177
height=67>
Header size 2
Header size 3
image sap.gif
SAP AG 1999
Each HTTP request (GET or POST) can request only one object.
The Web browser automatically generates a new HTTP request for each image on an HTML page.
The Web browser can only display a formatted HTML page once the size of all the images are known.
If the width and height are specified in all the <img> tags, the Web browser does not have to wait
until it has loaded all the images.
The whole page is displayed while the images are still being loaded and are shown as true size
rectangles containing the text of the alt parameter.
(C) SAP AG
BC440
14
4.15
Hyperlinks References to Other Objects
Text or images can be used

as hyperlinks
The browser uses color to
highlight hyperlinks
'Visited' hyperlinks are
highlighted in a different
color
The target object does not
know there is a link to it
The hyperlink will not know

about any changes made to
the target object
SAP AG 1999
A hyperlink is "visited", when the target has been loaded at least once in the Web browser.
Even if the target changes, the hyperlink retains the same "visited" status
After a specific time (e.g. 30 days) the Web browser sets hyperlinks back to their original "unvisited"
status
This behavior is independent of the history and caching mechanisms
(C) SAP AG
BC440
15
4.16
Hyperlinks in HTML
Further <a href="info.html">information</a>

<a href="/home.html"><img src="sap.gif"></a>
Further Information
Information on the
Server:
info.html
Welcome to the
HTML Unit
SAP AG 1999
home.html
(HTML) text or an image can be placed between the opening <a> and the closing </a> tags. The Web
browser loads the target object when the text or image is clicked.
You can also use <a> to define hyperlink targets within a page.
Example:
Definition of target in page info.html:
<a name="se">Stefan Ehret</a> is an ABAP instructor.
Use in a hyperlink:
Read more about <a href="info.html#se">Stefan</a>.
You can also evaluate the coordinates of the mouse click in an image. Area coordinates and URLs have
to be assigned to the image. An <a> tag is not needed for this.
Example:
<map name="bc440map">
<area coords="1,1,10,20"
href="info.html">
<area coords="12,21,40,40" href="home.html">
</map>
<img src="sap.gif" usemap="#bc440map">
(C) SAP AG
BC440
16
4.17
Hyperlinks to Other Servers
Further <a href="http://s67/info.html">information</a>
Further information
http://s89/demo.html
PC12
Information about the

Server:
demo.html
S89
http://s67/info.html
info.html
S67
SAP AG 1999
The target of a hyperlink (here info.html on S67) does not know about the links to it from HTML pages
on other servers (here demo.html on S89).
At runtime, the Web browser may pass the URL of the page containing the hyperlink to info.html to
the server S67. If so, the string "referer: http://s89/demo.html" is sent in the header of
the HTTP request to S67.
(C) SAP AG
BC440
17
4.18
Overview: Input using HTML forms
HTML
HTML Basics
Basics
Formatting
Formatting with
with Cascading
Cascading Style
Style Sheets
Sheets
Images,
Images, Hyperlinks,
Hyperlinks, Tables,
Tables, and
and Frames
Frames
Input
Input Using
Using HTML
HTML Forms
Forms
JavaScript
JavaScript
SAP AG 1999
(C) SAP AG
BC440
18
4.19
Tables
<table> ... </table>
Row
Row
<tr> ... </tr>

<td> ... </td>
Header
Body
Footer
<thead> ... </thead>

<tbody> ... </tbody>
<tfoot> ... </tfoot>
<head> <style> table { border-style: solid } </style>

</head><body>
<table> <thead>
<tr><td>Destination</td><td colspan=2>Price</td></tr>
</thead> <tbody>
<tr><td>Paris
</td><td>2500 DM</td><td>$1250</td></tr>
<tr><td>London
</td><td>1840 DM</td><td>$ 920</td></tr>
</tbody> </table>
</body>
Table
SAP AG 1999
Tables are built row by row

Table rows are structured data cell by data cell.
Some CSS parameters for tables:
border-style
border-width
border-color
background-color
background-image
(C) SAP AG
BC440
19
4.20
Frames
<html> <head> ... </head>

<frameset cols="20%,80%">
<frame name="F1"
src="red.html">
<frame name="F2"
src="blue.html">
</frameset>
Divide the browser window

into several windows
Several <frameset>s can
be nested in each other
Each <frameset> is
divided either by
</html>
columns: cols="c1,c2,..."
rows: rows="r1,r3,..."
F1 F2
SAP AG 1999
Values for cols or rows parameters:

nnn
Number of pixels
nnn%
Percentage of area to be divided up
*
Remaining area
1, 2*
Divide proportionately (1/3 to 2/3)
Parameters of the <frame> tag:
noresize
Size cannot be changed
scrolling
yes, no, auto - display scroll bar
frameborder
1 or 0 - dividing line to neighbouring frame
Several frames can be nested in each other. Framesets can be nested either in the same file or in several
files. In the above example red.html and blue.html could contain their own <frameset> tags.
(C) SAP AG
BC440
20
4.21
Frames and Hyperlinks
With target you can

specify which frame is to
be replaced
The target of a hyperlink

replaces the contents of
the frame
<a href="green.html"
target="F2"> ... </a>
F1 F2
F1 F2
<a href="green.html"> ... </a>
F1 F2
<a href="green.html"
target="_top"> ... </a>
SAP AG 1999
If a target parameter is not specified, the frame containing the hyperlink is replaced with the target of
the hyperlink.
With the target parameter you can specify that a different frame is to be replaced. To do this, you
must indicate the name of the frame to be replaced. The name must correspond exactly to its definition
in the <frameset>.
Note: Upper/lower case is important here.
There are other special values for target
Note: Use lower case.
_self
Same function as omitting the target parameter
_top
Target replaces the whole frameset
_blank Opens a new browser window that displays the target
_parent The target replaces the file in which the frameset has been specified. The frame that
contains the hyperlink belongs to this frameset. This only works if the framesets are
specified in several files and not just in one single file.
The history mechanisms of the Web browser (back/forward buttons) can impede user navigation in
frames. For example, if you select "Back", you do not exit the frameset, but are simply taken to the
previous contents of the frame.
(C) SAP AG
BC440
21
4.22
CGI Common Gateway Interface
Interface between the HTTP server and:

an executable program or
a shell script
Browser
HTTP
HTTP
server
CGI
CGI
program
WWW server
The CGI program generates:
an HTML page or
a MIME object (image, sound, ...)
SAP AG 1999
CGI - Common Gateway Interface (current version 1.1) has been defined by NCSA (National Center for
Supercomputing, http://hoohoo.ncsa.uiuc.edu/cgi/).
Note: HTTP servers and CGI programs must run on the same server because the call parameters are
transmitted using environment variables.
The CGI program itself can call other programs (even if they are on other servers).
MIME - Multipurpose Internet Mail Extensions:
Standard for multi-part, multimedia E-mail messages and for HTTP objects
MIME enables non-text data such as images and sound to be sent on the Internet
Binary data is converted to ASCII code before it is sent. The receiver then converts it to its original
format
MIME is specified in RFC (Request for comment) 1341
Manufacturers of HTTP servers have developed their own protocols to create a more effective interface
between the server and the program called:
ISAPI - Internet Server API for Microsoft's Internet Information Server
NSAPI - Netscape Server API for Netscape's HTTP server
With Microsoft's Active Server Pages (ASP) you can store HTML pages with embedded tags (similar to
Visual Basic) in the server's file system. The tags are executed by the HTTP server at runtime and a
"real" HTML page is generated.
(C) SAP AG
BC440
22
4.23
Input for CGI Programs - HTML Forms
<form action="cgi-prg">
<input type=text name=CUSTOMER ... >
<select name=CARRID>
<option value="LH"> Lufthansa </option>
...
</select>
<input type=radio name=DURATION ... >
<input type=checkbox name=NONSTOP ... >
<input type=submit ... >
</form>
Transfer the input (query string):

CUSTOMER=Meyer&CARRID=LH&DURATION=12
SAP AG 1999
HTML tags to format text can be used between <form> and </form>.
An HTML page may contain several forms that call either the same CGI program or different CGI
programs.
The action parameter specifies the CGI program that is to be called.
All data entered into input fields that have a name can be transmitted via the CGI program. The names
and values of the fields are transmitted in a character string (query string) to the called program.
If a character is to be used as part of the value that performs a special function in a URL or that is not
allowed, the browser sends this character in hexadecimal format. You can recognize those characters by
the % sign (for example, %20 instead of ' '),
Within frames, the parameter target can be used in the <form> tag.
(C) SAP AG
BC440
23
4.24
Forms - Elements (1)
Text input
Text field
<input type=text name=CUSTOMER

maxlength=8 value="Meyer">
Password
<input type=password name=PWD>
Button to send completed form
Button
<input type=submit name=BUTTON1

value="send">
Hidden elements
Hidden
<input type=hidden name=ABC

value="12.45">
SAP AG 1999
The user can enter data directly into text input fields of type text.
size - Length of text displayed
maxlength - Maximum length of text. If maxlength is bigger than size, a scroll bar is
automatically added to the input field
value - Preassigned values
Input fields of type password behave the same as fields of type text, except that "*" is displayed
instead of the text actually keyed in. Note that the contents of password fields are not encrypted when
they are transmitted.
The Web browser does not display input fields of type hidden. They are not visible for the users.
In the case of hidden fields, the value assigned with value is transmitted together with the actual
user input to the CGI program called. Hidden input fields are used in forms created dynamically. For
further information refer to later sections in this unit.
A form can have several buttons of type submit.
All buttons call the same specified CGI program using <form action="...">.
The CGI program can evaluate name and value and respond appropriately to the button chosen.
The <input type=image> tag allows images to be used as buttons.
<input type=image name= srv=<URL of image> value=>
(C) SAP AG
BC440
24
4.25
Radio buttons (grouping by same name)

<input type=radio name=DURATION value="04"> 4 hours
<input type=radio name=DURATION value="12"> 12 hours
<input type=radio name=DURATION value=" "
checked
> other
Selection list
<select name=CARRIER>
<option value="AA"
> American Airl. </option>
<option value="LH" selected > Lufthansa
</option>
<option value="UA"
> United Airlines </option>
</select>
SAP AG 1999
The radio buttons are grouped by name. All radio buttons of a form that have the same name constitute
one logical group. It does not matter where they are positioned in the source code.
By default radio buttons are usually unchecked (not selected). If a button is to be checked, the parameter
checked can be used in the relevant <input> tag.
By default the first option is usually checked in a selection list. If a different option should be checked,
the parameter selected can be used in the relevant <option> tag.
(C) SAP AG
BC440
25
4.26
Checkbox (basic form)

<input type=checkbox name=NONSTOP value="X">
Direct flights only
Checkbox (improved form)

<input type=hidden
name=NONSTOP value=" ">
<input type=checkbox name=NONSTOP value="X">
Direct flights only
Checked checkbox
<input type=checkbox ... checked>
SAP AG 1999
A checkbox (name and value) is transferred to the CGI program called, only if it has been checked.
If the value in the checkbox has to be transferred each time, a hidden input element containing the
name of the checkbox must be used in the same form in front of the checkbox.
The value of the hidden input element is always transferred.
The value in the checkbox is also transferred if the checkbox has been checked.
Query strings in the above form (examples):
checkbox not checked: ...&NONSTOP=+
checkbox checked:
...&NONSTOP=+&NONSTOP=X&...
By default checkboxes are not checked. If a checkbox should be checked, the parameter checked
should be used in the relevant <input> tag.
(C) SAP AG
BC440
26
4.27
Submitting the Data Input - HTTP Method
GET
<form action="cgi-prg" method=get> ... </form>
The data input is attached to the URL
http://host/cgi-prg?name1=value1&name2=value2
Default method, if method has not been specified
4 KByte is the maximum amount of data that can be transferred
POST
<form action="cgi-prg" method=post> ... </form>
Eingaben werden in der HTTP-Request-Message transportiert
http://host/cgi-prg
The outcome of a POST request is not stored in a cache
SAP AG 1999
Hyperlinks always use the HTTP method GET
(C) SAP AG
BC440
27
4.28
Problem of Statelessness
HTTP is stateless but business

transactions need an internal
status
Form 1
Solution
Form 2
s=1
CGI
program
Invisible input element <input
type=hidden ... >
$PATH_INFO
cgi-prg/s1?name=value
Cookies
Form 3
s=2
SAP AG 1999
Form 1 is part of a static HTML page. Form 2 is part of an HTML page generated by the CGI program
after the data entered in Form 1 has been evaluated.
The page generated dynamically "hides" the status needed by the CGI program to continue processing
the transaction from the point at which it stopped.
Examples for Form 2
Hidden input:
<form action="cgi-prg"> <input type=hidden name=s value="1">...
Calls cgi-prg with input field s = 1.
$PATH_INFO: status direct in URL
<form action="cgi-prg/s1"> ... </form>
Calls cgi-prg with environment variable $PATH_INFO = /s1.
HTTP cookie: Up to 4 Kbytes of data are embedded in the HTTP response and are automatically sent
with the next HTTP request to the same server. In HTML:
<head> <meta http-equiv="Set-Cookie" content="s=1;"> </head>
<body> <form action="cgi-prg"> ... </form>
... </body>
Calls cgi-prg with environment variable $HTTP_COOKIE = s=1.
(C) SAP AG
BC440
28
4.29
HTML: Unit Summary

Create HTML pages
Use Cascading Style Sheets
Create images, hyperlinks, and tables
Define HTML forms and pass form input to CGI
programs
Explain how JavaScript can be used in HTML
pages
SAP AG 1999
(C) SAP AG
BC440
29
4.30HTML Exercises
Unit: HTML - Hypertext Markup Language:
Topic: HTML Basic Structure
At the conclusion of these exercises, you will be able to:
Create HTML pages
Use the commands <head>, <body> and <title>
Create the home page for an online travel agency. Only use the HTML
commands for the basic structure of HTML pages.
1-1
Notepad:
1-1-1 Use Notepad to create the home page of your travel agency. Think of a name
for your travel agency. Consider what types of holidays you want to offer and
think of three holiday destinations.
Only use the HTML basic commands structure (<head>,</head>,
<body>, </body>) and <title>. This page should contain the name of
your travel agency, a short description and the three holiday destinations.
Save the file in the file system of the Web servers:
\\<Web-Server>\HTML\Group##\home.html.
1-2
Web Browser:
1-2-1 Enter the following URL to display the page:
http://<Web-Server:Port>
/BC440/Unit04/Exercises/Group##/home.html
Your instructor will tell you the name of the Web server and the port number.
(C) SAP AG
BC440
30
Exercises
Topic: Formatting Text
Format and highlight text on an HTML page
Use the HTML commands to format the contents of your home page.
2-1
Notepad:
2-1-1 Use the HTML commands to format the contents of your home page.
Save the file on the Web server.
2-2
Web Browser:
2-2-1 Reopen your page again in the Web browser to look at your formatting. You can
simply select Refresh.
(C) SAP AG
BC440
31
Exercises
Topic: Images and Hyperlinks
Use images on HTML pages
Create hyperlinks between HTML pages
Create new HTML pages describing various destinations with images.

Create a hyperlink from your home page to the new pages.
3-1
Web Browser:
3-1-1 Enter the following URL:
http://<Web-Server:Port>/BC440/images.
Click through the subdirectories and display some of the pictures.
3-2
Notepad:
3-2-1 Create a new HTML page. This page should contain the name of one of your
holiday destinations on your home page. Briefly describe the main attraction of
this destination. Use <head>, <body> and text formatting commands.
3-2-2 Use the <img> command to display a picture of the destination. Save the file in
the file system of the Web servers:
\\<Web-Server>\HTML\Group##\dest1.html.
3-3
Web Browser:
/BC440/Unit04/Exercises/Group##/dest1.html
3-4
(C) SAP AG
Notepad:
BC440
32
3-4-1 Repeat steps 3-2-1 to 3-3-1 two more times so that you have described three
different travel destinations on the HTML pages dest1.html, dest2.html
and dest3.html.
3-4-2 Open your home page again
Search the list of the holiday destinations you created in the steps 3-2-1 to 3-41. Use the HTML command <a>, to create the entries in the list as hyperlinks.
Save the file.
3-5
Web Browser:
3-5-1 Reload your homepage from the Web server and click on the hyperlinks you
have just created. You should see the description and picture of the travel
destination.
(C) SAP AG
BC440
33
Exercises
Topic: Tables
Create HTML tables
Create a new HTML page with a table containing hyperlinks to other

groups.
4-1
Notepad:
4-1-1 Create a new HTML page containing a table. The table should enable customers
to display the homepage of other travel agencies (partner travel agencies)
simply by clicking on the mouse.
Create a table. Each row should contain three group numbers (see below).
01
02
03
04
05
06
...
...
...
The group numbers should be able to be used as hyperlinks to switch to the

homepages of the travel agencies. You can use the following URL for the
hyperlink (XX = No. of exercise group):
href="../GroupXX/home.html"
Save the file in the file system of the Web server:
\\<Web-Server>\HTML\Group##\partners.html.
(C) SAP AG
BC440
34
4-2
Web Browser:
/BC440/Unit03/Exercises/Group##/partners.html
Test the hyperlinks to the partner travel agencies.
(C) SAP AG
BC440
35
Exercises
Topic: HTML Frames
Define HTML framesets
Use the target parameter in HTML hyperlinks
Use the HTML frames to link all the pages you have created so far.
5-1
Notepad:
5-1-1 Create a new HTML page containing a frameset that divides the Web browser
window as shown below:
BANNER
banner.html
LEFT
home.html
RIGHT1
dest1.html
RIGHT2
partners.html
The names you should use in your frameset are shown in the frames. The page
to be displayed in each frame is shown in italics.
5-1-2 Save the file in the file system of the Web servers:
\\<Web-Server>\HTML\Group##\frames.html
5-2
Web Browser:
5-2-1 Enter the following URL to display the frameset:
(C) SAP AG
BC440
36
/BC440/Unit04/Exercises/Group##/frames.html
In the frame BANNER you should see an error message because the page
banner.html does not (yet) exist.
In the other three frames you should see the pages you created in the previous
exercises. If error messages are displayed instead, correct your frameset
(frames.html) before you start the next exercise.
5-3
Notepad:
5-3-1 Create a new HTML page for the frame BANNER containing the name of your
travel agency. Use <head>, <body> and text formatting commands.
\\<Web-Server>\HTML\Group##\banner.html.
5-4
Web Browser:
5-4-1 Reload the page in the frame BANNER from the Web server. The error message
should be replaced with the contents of your page banner.html.
Click on the hyperlinks on your page home.html in the frame LEFT. The travel
destination description now replaces the contents of the frame LEFT.
5-5
Notepad:
5-5-1 Open your home page
\\<Web-Server>\HTML\Group##\home.html
Add the parameter target to the hyperlinks to the travel destinations so that a
click in the frame LEFT changes the contents of the frame RIGHT1.
Save the page.
5-6
Web Browser:
5-6-1 Reload your home page Homepage (home.html in frame LEFT from the Web
server. Click again on the hyperlinks of your homepage in the LEFT frame. The
description of the travel destinations should replace the contents of the RIGHT1
frame.
Now click on the hyperlinks in the frame RIGHT2 on your page
partners.html. The homepages of the other travel agencies now replace the
contents of the frame RIGHT2.
5-7
Notepad:
5-7-1 Reload your page with the table
\\<Web-Server>\HTML\Group##\partners.html.
First change all the hyperlinks from ../GroupXX/home.html to
../GroupXX/frames.html to display the frameset of the other groups. Tip:
(C) SAP AG
BC440
37
Use the replace function in Notepad.

Add the parameter target to all the hyperlinks so that if you click in the frame
RIGHT2, your frameset disappears and the frameset of the travel agency clicked
on is displayed.
Save the page.
5-8
Web Browser:
5-8-1 Reload the page with the table (partners.html in frame RIGHT2) from the
Web server. Click again on the hyperlinks in the table in the frame RIGHT2. The
frameset of another travel agency should be displayed in full size.
(C) SAP AG
BC440
38
Exercises
Topic: Data Input (HTML Forms)
Create forms with HTML
Create a form for the first step in booking a flight.
6-1
Notepad:
6-1-1 Create a new HTML page containing a form. The following data is required by the
online booking system. (You will create the booking system in a later Unit.)
City and country of departure
Destination city and country
Restricted to one carrier
Flight restrictions - afternoons only

Use two invisible fields to transfer the departure country (DE) and destination
country (US) to the booking system.
Use a <select> command for the city and country of departure.
Use radio buttons to select a preferred carrier.
Use a check box to restrict flights to afternoons only.
Create an HTML button to send the completed form.
(C) SAP AG
BC440
39
Use the following CGI program as the value for the action parameter:
"/scripts/formecho.asp".
This program generates an HTML page that contains the names and contents of the
input elements from your form.
\\<Web-Server>\HTML\Group##\flights.html.
6-2
Web Browser:
6-2-1 Enter the following URL to display the form:
/BC440/Unit04/Exercises/Group##/flights.html
Send the form of several times. Enter different details in each form you send.
6-3
Notepad:
6-3-1 Reload your homepage
Add a hyperlink to flights.html with the parameter target="_top". Save the
page.
6-4
Web Browser:
6-4-1 Reload your frameset (frames.html) from the Web server. Reload your home
page Homepage (home.html in frame LEFT from the Web server. Click on the
new hyperlink of your homepage in the frame LEFT to display the input form you
have just created.
Submit the completed form.
6-5
Notepad:
6-5-1 Reload the page containing the form
\\<Web-Server>\HTML\Group##\flights.html.
Until now you could freely choose the names in your form. Change the value of the
action parameter from /scripts/form-echo.asp to
/scripts/online-booking.asp.
online-booking.asp is a simple program to display the values you have
entered in your form. This program requires that the input elements have special
names.
Save the page.
6-6
Web Browser:
6-6-1 Reload the page containing the form (flights.html) from the Web server.
Submit the completed form. You probably will not be able to see all the values so
that the names in your form are not those required by online-booking.asp.
6-7
Notepad:
(C) SAP AG
BC440
40
6-7-1 Enter names in your form so that online-booking.asp displays all the values
you enter in your form.
Test the parameter method (get or post).
Repeat steps 6-6-1 and 6-7-1 until your form matches the CGI program.
(C) SAP AG
BC440
41
4.31HTML Solutions
Unit: HTML - Hypertext Markup Language
Topic: HTML Basic Structure
Creating HTML pages
Using the commands <head>, <body> and <title>
Create the homepage for an online travel agency. Use only the HTML
commands for the basic structure of HTML pages.
file home.html:
<html>
<head>
<title> Solution Exercise 1 </title>
</head>
<body>
Welcome to Real Weird Vacations.
We offer travels you'll never forget:
- sports: desert jogging without water supply
- arts: under water painting in three different oceans
- language training: a trip to inner China with an Italian dictionary
This week's special: 'Flip the coin'
</body>
</html>
(C) SAP AG
BC440
42
Solutions
Topic: Formatting Texts
Formatting and highlighting text in an HTML page
Use HTML commands to format the contents of your homepage.
file home.html (changes in bold):

<html>
<head>
<title>Solution Exercise 2</title>
</head>
<body bgcolor=white link="darkblue" vlink="darkred"> <font face="Arial">
<h1>Welcome to Real Weird Vacations.</h1>
We offer travels you'll <em>never</em> forget:
<p> - <b>sports:</b> desert jogging without water supply
<p> - <b>arts:</b> under water painting in three different oceans
<p> - <b>language training:</b> a trip to inner China with an Italian dictionary
<p> This week's special: <font color="red">'Flip the coin'</font>
<p> 'Flip the coin' is a weird bus trip through Europe.
</font>
</body>
</html>
(C) SAP AG
BC440
43
Solutions
Topic: Images and Hyperlinks
Using images in HTML pages
Creating hyperlinks between HTML pages
Create new HTML pages that describe with pictures the various travel
destinations. Link your homepage to the new pages using hyperlinks.

<html> <head> <title>Solution Exercise 3</title> </head>
<p>This week's special: <font color="red">'Flip the coin'</font>
<h2>Have a look at the following destinations </h2>
<p> <a href="dest1.html">Egypt</a>
<p> <a href="dest2.html">Berlin</a>
<p> <a href="dest3.html">New York</a>
<p> <a href="dest4.html">Greenland</a>
</font> </body> </html>
(C) SAP AG
BC440
44
file dest1.html (dest2.html and dest3.html):

<html>
<head> <title>Egypt</title> </head>
<h1>Egypt</h1>
Land of the Pyramids.
<p>
<img src="/BC440/Images/Travel/Africa/Egypt/Giza.gif">
</font> </body>
</html>
(C) SAP AG
BC440
45
Solutions
Topic: Tables
Creating HTML tables
Create a new HTML page with a table containing hyperlinks to your

partner travel agency.
file partners.html:
<html> <head> <title>Partners of Real Wired Vacations </title> </head>
<h2>Our partners</h2>
<table border=1>
<tr> <th>Group</th> <th> </th>
<th>Group</th> <th> </th>
<tr><th> <a href="home.html">00</a>
</th> <td> home.html </td>
<th> <a href="..\..\Exercises\Group07\home.html">07</a> </th> <td> home.html </td>

<tr><th> <a href="..\..\Exercises\Group01\home.html">01</a> </th> <td> home.html </td>
</table>
</font></body> </html>
(C) SAP AG
BC440
46
Solutions
Topic: HTML Frames
Defining HTML framesets
Using the target parameter in HTML hyperlinks
Use HTML frames to link all the pages you have created up to now.
file frames.html:
<frameset rows="70,*">
<frame name="BANNER" src="banner.html" noresize>
<frameset cols="50%,*">
<frame name="LEFT" src="home.html">
<frameset rows="50%,*">
<frame name="RIGHT1" src="dest1.html">
<frame name="RIGHT2" src="partners.html">
</frameset>
</frameset>
</frameset>
</html>
file banner.html:
<html>
<body bgcolor=white><font face="arial" color="blue">
<center> <h1>Real Weird Vacations</h1> </center>
</font></body>
</html>
(C) SAP AG
BC440
47

<p>This week's special: <font color="red">'Flip the coin'</font>
<h2>Have a look at the following destinations </h2>
<p> <a href="dest1.html" target="RIGHT1">Egypt</a>
<p> <a href="dest2.html" target="RIGHT1">Berlin</a>
<p> <a href="dest3.html" target="RIGHT1">New York</a>
<p> <a href="dest4.html" target="RIGHT1">Greenland</a>
</font> </body> </html>
file partners.html (changes in bold):

<html> <head> <title>Partners of Real Wired Vacations </title> </head>
<h2>Our partners</h2>
<table border=1>
<tr> <th>Group</th> <th> </th>
<tr><th> <a href="home.html" target="_top">00</a>
</th> <td> home.html </td>
<th> <a href="..\..\Exercises\Group07\home.html" target="_top">07</a> </th> <td> home.html </td>

<th> <a href="..\..\Exercises\Group14\home.html" target="_top">14</a> </th> <td> home.html </td>
</table>
</font></body> </html>
(C) SAP AG
BC440
48
Solutions
Topic: Data Input (HTML Forms)
Creating forms with HTML
Create a form for the first step in booking a flight.
file flights.html:
<html> <head> <title>Online booking system (solution 6)</title> </head>
<body bgcolor=white><font face="arial">
<h1><font color="blue">Online Booking System</font></h1>
<h3>Select your flight from Germany to USA</h3>
<form action="/scripts/online-booking.asp" method="post">
<input type=hidden name=COUNTRYFR value="DE">
<input type=hidden name=COUNTRYTO value="US">
<table>
<tr> <td> From
<td> <select name="CITYFROM">
<option value="BERLIN
"
> Berlin
<option value="FRANKFURT
<option value="MUNICH
" selected > Frankfurt

"
> Munich
</select>
(C) SAP AG
BC440
49
<tr> <td> To
<td> <select name="CITYTO">
<option value="CHICAGO
<option value="NEW YORK
"
> Chicago
" selected > New York
<option value="SAN FRANCISCO "
> San Francisco
</select>
</table>
<table border=1 rules=none>
<tr> <th> Airline
<tr> <td> <input type="radio" name="CARRID" value="AA"
> American Airlines
<tr> <td> <input type="radio" name="CARRID" value="LH" checked> Lufthansa

<tr> <td> <input type="radio" name="CARRID" value="UA"
<tr> <td> <input type="radio" name="CARRID" value=" "
> United Airlines

> no preference
</table>
<p>
<input type="hidden" name="MARK" value=" ">
<input type="checkbox" name="MARK" value="X"> depart in the afternoon only
<p>
<input type="submit" name="DISP" value="Display form data">
</form>
</font> </body>
</html>
(C) SAP AG
BC440
50
5
Contents:
Architecture
Service files
Internet users for Web transactions
ITS context and HTMLBusiness templates
SAP AG 2001
(C) SAP AG
BC440
5.2
Internet Transaction Server: Unit Objectives

List the components that the ITS consists of
Explain what an ITS service is
Describe the most important parameters that are
used in service files
Explain what explicit and implicit logon means
Explain the concept of Internet users
and create Internet users
Describe how the ITS generates HTML pages
SAP AG 1999
(C) SAP AG
BC440
5.3
6 Web
Transaction
7 WebRFC
8 Administration
5
4 HTML
Internet
Transaction
Server
Summary and Outlook
Overview Diagram
SAP AG 1999
(C) SAP AG
BC440
5.4
Overview: Architecture
Architecture
Architecture
Service
Service Files
Files
Internet
Internet Users
Users for
for Web
Web Transactions
Transactions
Business Templates
ITS
ITS Context
Context and
and HTML
HTMLBusiness
Templates
SAP AG 1999
(C) SAP AG
BC440
5.5
Five-Tier Client/Server Architecture
Request
Web
Browser
HTTP
Server
Internet
Transaction
Server
R/3
Application
Server
R/3
Database
Server
Response
SAP AG 1999
The Internet Transaction Server connects the three-tier R/3 client/server architecture with the two-tier
HTTP client/server architecture.
For the R/3 System, the ITS and HTTP server form an intermediate layer between the application layer
and the presentation layer.
For the Internet user, the ITS provides interactive HTML pages (generated at runtime).
(C) SAP AG
BC440
5.6
Communication with
R/3
HTTP
the HTTP server
the R/3 application

server

logon
Internet
Transaction
server
Conversion of data on R/3

screens into HTML pages
Status management
SAP AG 1999
The Internet Transaction Server (ITS) links one or more HTTP servers with one or more R/3 Systems.
Internet and Intranet users can run Web-enabled transactions, Web-enabled function modules, or any
ABAP reports in R/3 using the ITS.
(C) SAP AG
BC440
5.7
ITS Software Components
ISAPI
NSAPI
TCP/IP
ITS
AGate
CGI
WGate
DIAG
RFC
SAP AG 1999
The ITS consists of the WGate (W = Web) and the AGate (A = application). The WGate communicates
with the HTTP server, and the AGate communicates with the R/3 application servers.
Connecting to the HTTP server:
CGI - Common Gateway Interface: General interface for communication between the HTTP
server and the executable program on the same computer
ISAPI - Internet Server API: Interface developed specifically for Microsoft's Internet Information
Server for DLLs on the same computer (DLL = dynamic link library)
NSAPI - Netscape Server API: Interface developed specifically for Netscape's Enterprise Server
for DLLs on the same computer.
Connecting WGate and AGate:
TCP/IP, or more precisely: HTTP - Hypertext Transport Protocol: Note: HTTP is used here
only for internal communication. The Web browser cannot connect directly to the AGate
Connecting to R/3:
DIAG - Dynamic Information and Action Gateway (= SAP GUI protocol): To call R/3
transactions. The R/3 System cannot distinguish between a "normal" SAP GUI user and the ITS. An
R/3 application can however make this distinction by calling the function module ITS_PING.
RFC - Remote Function Call: To call R/3 function modules
(C) SAP AG
BC440
5.8
HTTP
server
TCP/IP
ITS
AGate
CGI
WGate
Single Host Installation
DIAG
RFC
R/3
application
server
Windows NT
Server 4.0 (Intel)
SAP AG 1999
From now on, the connection between the HTTP server and WGate will be referred to as the CGI. The
interfaces ISAPI and NSAPI can be used instead, but they have been omitted for reasons of clarity.
To install the ITS, there are two technical points to note:
CGI, ISAPI and NSAPI require that the WGate is installed on the same computer as the HTTP
server
The AGate is only available for Windows NT Server 4.0 (Intel)
Windows NT Server 4.0 (Intel), the HTTP server and the ITS can be installed only on one computer.
HTTP server software supported is Microsoft Internet Information Server and Netscape Enterprise
Server.
This installation is suitable for test installations or for installations where security is not so important,
because only a few security precautions can be taken with this installation.
(C) SAP AG
BC440
5.9
HTTP
server
Windows NT
Server 4.0 (Intel)
or
Unix hardware
AGate
CGI
WGate
Dual Host Installation
TCP/IP
ITS
DIAG
RFC
R/3
application
server
Windows NT
Server 4.0 (Intel)
SAP AG 1999
If the WGate and the AGate are to be installed on two different computers, note the following
requirements:
The AGate requires a Windows NT 4.0 Server (Intel)
The WGate must be installed on the same computer as the HTTP server. UNIX operating systems
can also be used instead of Windows NT 4.0 (all SAP-supported derivatives).
(C) SAP AG
BC440
5.10
HTTP
server
ITS
DEV
TCP/IP
ITS
QAS
AGate
CGI
TCP/IP
DIAG
AGate
HTTP
server
WGate
CGI
WGate
Virtual ITS (1)
DIAG
RFC
RFC
R/3
DEV
R/3
QAS
SAP AG 1999
To minimize hardware requirements and response times, several virtual ITS servers can operate
independently from each other on one Windows NT 4.0 server.
Several (virtual) ITS instances may be required to separate test systems from development systems, for
example.
(C) SAP AG
BC440
10
5.11
HTTP
server
TCP/IP
ITS
DEV
ITS
QAS
AGate
CGI
TCP/IP
DIAG
AGate
HTTP
server
WGate
CGI
WGate
Virtual ITS (2)
DIAG
RFC
RFC
R/3
DEV
R/3
QAS
SAP AG 1999
If more than one virtual HTTP server is used, several complete ITS servers (WGate and AGate) can be
operated independently from each other on one computer.
This installation allows test and quality assurance systems to be installed on the same NT computer. For
security reasons, the production system should be separated from these two systems and be installed on a
different NT computer.
(C) SAP AG
BC440
11
5.12
Overview: Service Files
Architecture
Architecture
Service
Service Files
Files
Internet
Internet Users
Users for
for Web
Web Transactions
Transactions
Business Templates
ITS
ITS Context
Context and
and HTML
HTMLBusiness
Templates
SAP AG 1999
(C) SAP AG
BC440
12
5.13
Starting an ITS Service
HTTP
Web
browser
CGI
HTTP
server
WGate
http://<server>/<path>/wgate/<service>/!
ITS
Examples:
http://pc12/scripts/wgate/abcd/!
http://ux17/cgi-bin/wgate/test/!
SAP AG 2001
The service name is a symbolic name with a maximum length of 14 characters. If customers want to
create their own service, the name should begin with Z.
The specific syntax to start a service is dependent on the file system and the configuration of the HTTP
server.
Alternatively to the URL above, the following syntax can also be used:
http://<server>/<path>/wgate?~service=<service>
(C) SAP AG
BC440
13
5.14
Components of an ITS Service
Web
browser
CGI
TCP/IP
HTTP
server
ITS
MIME
objects
Service
files
AGate
HTTP
WGate
DIAG
RFC
R/3
application
server
HTML
Business
templates
SAP AG 2001
A service the Internet Transaction Server provides for Internet users consists of:
Administering logon information to the R/3 System (name of system, user details)
Running a transaction in R/3 or calling a function module or report
Converting R/3 data (screens or lists) to HTML pages
When a service is started, a SAP GUI or RFC session is internally started:
The ITS assigns the HTTP requests for a service to the correct session
A user context corresponds to each session in the R/3 System
A session ends when the service ends (by logoff or timeout in ITS)
(C) SAP AG
BC440
14
5.15
SAP@Web Studio
Working methods are projectoriented

Used for creating, managing,
maintaining and publishing:
SAP@Web
Studio
Projects
Service files
HTMLBusiness templates
Language dependencies
(text files)
MIME objects
(administration and display
functions only )
ITS flow files
SAP AG 2001
In the SAP@Web Studio, all the components of EasyWebTransactions and scenarios required outside the
R/3 System can be maintained using ITS flow logic. They include:
Service files
MIME objects (such as images, sound, video)
Files with language-dependent placeholders
ITS flow files
The SAP@Web Studio is a component of the ITS installation.
(C) SAP AG
BC440
15
5.16
Web
browser
Start service
SAP@Web
Studio
AGate
WGate
Publish with the SAP@Web Studio
HTTP
R/3
ITS
Web Studio publish
abcd.srvc <b>ì`</b>
test.srvc ìtab[i]`
MIMEs
Services
start
list
Templates Flow files
Seats
seats
Texts
Project ITSxxx_Demo
SAP AG 2001
MIME objects are copied by "Publish" into the file system of the WGate (the HTTP server).
(C) SAP AG
BC440
16
5.17
Site Definition Wizard
AGate
AGate
AGate
Web
browser
WGate
WGate
WGate
HTTP
ITS
3
1
Site Definition Wizard
Symbolic name for the site

Name of server on which WGate is running
Name of server on which AGate is running
Name of virtual ITS
URL for HTTP server with port (to start service)
SAP AG 2001
(C) SAP AG
BC440
17
5.18
Web
Browser
Start service
SAP@Web
Studio
AGate
WGate
Import Service from ITS into Project
HTTP
ITS
R/3
Publish / import from site
abcd.srvc
test.srvc
MIME
<b>ì`</b>
ìtab[i]`
Services Templates
seats
seats
Texts
Project BC440_Demo
SAP AG 1999
(C) SAP AG
BC440
18
5.19
Service Files
Global.srvc
~systemName
~login
~password
~client
~language
...
abcd.srvc
~transaction
ABCD
its050.srvc
~transaction
test.srvc
~initialTemplate start
~theme
99
XYP
Meier
***
400
DE
ABCD
zits050_00.srvc
~transaction
Z234
~login
~language
SAP AG 1999
Service files are text files that are stored in the AGate file system. They contain the settings that the ITS
requires to connect to the R/3 System to start a transaction or a WebRFC-enabled function module.
The structure of service files is as follows: Each line contains a parameter name with a value separated
by at least one space or TAB. These files can be edited with any text editor. The SAP@Web Studio and
the Web Application Builder provide table-type maintenance for this.
The file Global.srvc is a special service file. It contains global settings - all those common to all
individual services. When a <service> is started, the file Global.srvc is always imported first and
then the file <service>.srvc. The values from <service>.srvc are added to or override the
values from Global.srvc.
(C) SAP AG
BC440
19
5.20
Parameters in Service Files
Selection
Selection of
of R/3
R/3 System
System
Logon
Logon to
to the
the R/3
R/3 System
System
(implicit/explicit)
(implicit/explicit)
EasyWebTransaction,
EasyWebTransaction, ITS
ITS Flow
Flow Logic,
Logic,
WebRFC
WebRFC or
or ITS
ITS Administration
Administration Tool
Tool
ITS-Specific
ITS-Specific Parameters
Parameters
SAP AG 1999
(C) SAP AG
BC440
20
5.21
Service Parameters: Selection of the R/3 System
Load balancing across

the message server
~messageServer s01
~systemName
DEV
~loginGroup
SPACE
R/3 System
DEV
AGate
s01 (MS)
ITS
Direct selection of an
application server
~appServer
~systemNumber
s03
00
Example of using
SAProuter
~routeString
s02 (00)
DB
AGate
ITS
s03 (00)
/H/gateway/S/3299/H/s03/S/3200
SAP AG 2001
As the AGate logs on like a "normal" GUI user, all the different options of the SAP GUI logon can be
used.
The SAProuter can also be used between the AGate and the R/3 System.
If not all of the parameters contain values, the ITS automatically generates an error message.
(C) SAP AG
BC440
21
5.22
Service Parameters: Implicit Logon
The data for logging on to R/3

is all in the service file
~client
~login
~password
~language
400
meier
*****
EN
SAP R/3
System Help
Client
400
User
MEIER
Password
*****
Language
EN
R/3
SAP AG 2001
The ITS uses the above service parameters to log on to the R/3 System.
~client
- client
~login
- R/3 user
~password
- password
~language
- logon language
If all the parameters have values, the ITS logs on to R/3 when the service is started without asking the
user for logon details.
This type of system start is called implicit logon and is mainly used if the user does not have his/her
own R/3 user. For example, Internet sales scenarios can be implemented with this, where (as yet)
unknown Web users use R/3 to order goods and services.
You cannot identify the different Internet users in R/3 because they are all logged on with the same R/3
user. They also all have the same authorizations.
(C) SAP AG
BC440
22
5.23
Service Parameters: Explicit Logon
The data for logging on to R/3 is

only partly in the service file
~client
~login
~password
~language
400
EN
Smith
Password
********
Client
400
User
SMITH
Password
********
Language
EN
R/3
Please logon to the

R/3 System
Login
SAP R/3
System Help
SAP AG 2001
If one or more of the parameters do not contain values, the ITS automatically creates an HTML form to
ask the user for the missing logon details.
This type of start is called implicit logon and is only used if all the users have their own R/3 user.
In this case you can identify the different Internet users in R/3 just as SAP GUI users, which means they
may have different authorizations.
(C) SAP AG
BC440
23
5.24
Logging on to Several Services
Start S1
?
Meier
******
100
100
X
X Meier
*****
Start S2
X
?
?
Meier
~cookies = 1
******
SAP AG 1999
The ITS can create a temporary cookie which can save data of a direct logon when the user exits the
service.
Service parameters: ~cookies (standard = 1)
ITS with cookies (~cookies = 1)
Following an explicit logon the cookie contains a pointer to the logon data saved in the ITS (AGate).
The logon data is therefore only in the AGate and not in the cookie.
When another service is opened this data is used again.
ITS without cookies (~cookies = 0)
When a service is opened, logon data must be entered again.
(C) SAP AG
BC440
24
5.25
Service Parameters: ~timeOut and ~userTimeOut
~timeOut
Service 1
~userTimeOut
~timeOut
Service 2
Internet
Transaction
Server
Time
SAP AG 1999
~timeOut determines how much time (in minutes) is allowed to pass between sending a page through
the AGate and receiving the next request from the browser.
If this time is exceeded, the ITS closes the relevant R/3 connection and deletes all session-related data
stored internally.
If the user sends another request after ~timeOut has been exceeded, the user gets an HTML page with
message "Session timed out in response.
~userTimeOut determines how much time (in hours) is allowed to pass between ending the last
session of a user and starting a new session (service).
This parameter only works if ~cookies = 1, that is, the data of an explicit logon is to be saved when
the service is ended.
If after ~userTimeOut has been exceeded, the users starts a new service with explicit logon, the ITS
ignores the cookie of the last logon and requires a new explicit logon.
Starting with ITS 4.6B, the unit of ~usertimeout has been changed from minutes to hours (see also
Note 215330).
(C) SAP AG
BC440
25
5.26
EWT, ITS Flow Logic, WebRFC or ITS Admin Tool
DIAG
TCP/IP
ITS
ITS
Admin
Tool
System Help
SAP R/3
DIAG
AGate
WGate
SAP R/3
System Help
Carrier name:
100
Lufthansa
200
EasyWeb
Transaction
R/3
RFC
RFC
RFC
RFC
BAPIs and (any) other

RFC-enabled
function modules
ITS
Flow Logic
Special
WebRFC-enabled
function modules
WebRFC
SAP AG 1999
(C) SAP AG
BC440
26
5.27
Service Parameters: ITS-Specific
Generation of the HTML pages

~theme
~URLmime
~exitURL
~runTimeMode
99
/sap/its/mimes
/BC440/home.html
pm
Selection of templates
Path to MIME objects for URLs
URL after service is completed
Selection of system templates
Administration of logon data

~timeOut
~cookies
~userTimeOut
Max. time between two dialog steps

Data buffering of explicit logon
Maximum duration of buffering
5
1
60
Parameters for creating URL

~hostunsecure
~portunsecure
~hostsecure
~portsecure
Name of HTTP server

Port for HTTP
Name of HTTP-S server
Port for HTTP-S
s34
1080
s34
443
SAP AG 1999
(C) SAP AG
BC440
27
5.28
Starting a Service
Start without transferring parameters:
http://<server>/<path>/wgate/<service>/!
Start with transferring parameters

.../wgate/<service>/!?<par1>=<val1>&<par2>=<val2>...
Entry in service
file
Set by URL
ITS query if
necessary
Selection of R/3
System
Required
Ignored
No
Logon data
Allowed
Added to service
file
Yes
WebTransaction
or WebRFC
Required
Ignored
No
Transaction code
Required
Ignored
No
Name of FM for
WebRFC
Allowed
Added/
overrided
No
SAP AG 1999
(C) SAP AG
BC440
28
5.29
Overview: Internet Users
Architecture
Architecture
Service
Service Files
Files
Internet
Internet Users
Users for
for Web
Web Transactions
Transactions
Business Templates
ITS
ITS Context
Context and
and HTML
HTMLBusiness
Templates
SAP AG 1999
(C) SAP AG
BC440
29
5.30
Internet Users - Concept
SAP R/3
The data for logging on to R/3

is all in the service file
~client
~login
~password
~language
400
itsuser
*****
EN
System Help
Client
400
User
itsuser
Password
*****
Language
EN
SAP R/3
System Help
Enter customer number

and password:
Customer no. 200

Password
Customer no.
Password
**********
R/3
SAP AG 2001
Based on the service started, all Internet users are logged on to the R/3 System with the same R/3 user.
Initially, these users cannot be distinguished from each other.
If authentication is required for a user of the EasyWebTransaction (for example, if the user actually
wants to order the products selected in the online shop), the user must specify his or her Internet user
(for example, the customer number) and the associated password.
The prompt for the Internet user must be implemented at a suitable point in the R/3 transaction.
(C) SAP AG
BC440
30
5.31
Internet User - Object Type Dependency
SCUSTOM
MANDT ID
400
400
400
400
199
200
201
202
NAME
...
Smith
Meier
SAP
Hendriks
...
...
...
...
SCUSTOMER
(Flight
customer)
BAPIUSW01
MANDANT OBJTYPE
400
400
400
400
LFA1
KNA1
SCUSTOMER
SCUSTOMER
OBJID
200
200
200
201
PASSWORD
...
BDC3238AB8651EF
AAAAGB12F4G5R6T
ALIK8675J11K1UZ
HGD234HDS134GFT
...
...
...
...
SAP AG 1999
Internet users are created for business objects. For example, there may be a customer with customer
number 200, a vendor with vendor number 200, and an applicant with applicant number 200.
An Internet user makes sense only if the corresponding entry has been maintained in the master data
table associated with the business object.
Internet users are client-specific.
(C) SAP AG
BC440
31
5.32
Maintaining Internet Users
Maintain Internet User
User Edit Goto System Help
Create
ID:
200
Delete
Type:
SCUSTOMER
Rename
Lock/unlock
Initialize
(create password
automatically)
Change password
BAPIUSW01
BFUSER_TYP
SAP AG 1999
You create Internet users in transaction SU05.

For each business object maintained in table BFUSER_TYP you can create an Internet user in table
BAPIUSW01.
The password is generated by the maintenance transaction and can also be changed with this transaction.
Note: When you create an Internet user, the maintenance transaction automatically checks if the
corresponding record exists in the master data table.
(C) SAP AG
BC440
32
5.33
ITS: Unit Summary

List the components that the ITS consists of
Explain what an ITS service is
Describe the most important parameters that are
used in service files
Explain what explicit and implicit logon means
Explain the concept of Internet users and create
Internet users
Describe how the ITS generates HTML pages
SAP AG 1999
(C) SAP AG
BC440
33
5.34Internet Transaction Server: Exercises

Unit: Internet Transaction Server
Topic: Parameters in Service Files
Create projects and site definitions in Web Studio.
Import service files from ITS
Create a new project and site definition. Import various service files and
analyze the parameters in them.
1-1
Web Browser:
1-1-1 Start the service bc440e_syst1. This transaction displays some R/3 System
fields. The WGate URL is:
http://<Web-Server:Port>/scripts/wgate.
Your instructor will tell you the server name and port.
1-2
Web Studio:
1-2-1 Create a new project in C:\Projects. You can choose a name for the project.
Path: File New Projects
1-2-2 Create a new site definition for the training environment. You can choose a name
for the site definition. Your instructor will tell you the name of the server.
Path: Project Site Definition New
1-2-3 Import the service bc440e_syst1 from the ITS. Open the service file. Which
R/3 transaction belongs to the service bc440e_syst1?
Path: Project Add to Project Import Import Service
from Site
1-3
R/3:
1-3-1 Logon to the R/3 System.
1-3-2 Start the transaction belonging to the service bc440e_syst1. Compare the
display in SAPGUI to the HTML page you displayed in the browser. What
difference do you notice?
(C) SAP AG
BC440
34
1-4
Web Studio:
1-4-1 Import the service Global into your project. Search for the parameters that
determine which R/3 System and which R/3 user is used. Is load balancing used?
1-5
Web Browser:
1-5-1 Start the service bc440e_syst2. How is it different to service
bc440e_syst1? In which parameters must the services bc440e_syst1 and
bc440e_syst2 be different?
1-6
Web Studio:
1-6-1 Check your answers to the last question by importing the service bc440e_syst2
into your project. Which parameters from Global.srvc are overridden?
1-7
Web Browser
1-7-1 Restart the service bc440e_syst2 and add the client and the logon language
directly to the URL:
.../wgate/bc440e_syst2/!?~client=...&~language=...
(C) SAP AG
BC440
35
Exercises
Unit: Internet
Transaction
Server
Topic: Creating and Using Internet Users
Creating Internet users
Create an Internet user for an existing flight customer.
2-1
R/3:
2-1-1 Create an Internet user for flight customer 4##. Enter a new password (##
indicates your group number).
2-2
Web Studio:
2-2-1 Import the service bc440e_cust into your project. Open the service file to find
out which R/3 transaction belongs to this service.
2-3
R/3:
2-3-1 Start the transaction for service bc440e_cust. Enter your flight customer
number 2## and the new password. Change the address. Save the changes.
2-4
Web Browser:
2-4-1 Start the service bc440e_cust. What are the similarities and the differences
between the R/3 transaction and the ITS service?
(C) SAP AG
BC440
36
5.35Internet-Transaction-Server Solutions
Topic: Parameters in Service Files
Create projects and site definitions in Web Studio.
Import service files from ITS
Create a new project and site definition. Import various service files and
analyze the parameters in them.
1-2-3 Which R/3 transaction belongs to the service bc440e_syst1?

BC440D_SYSTEM_FIELDS
1-3-2 Start the transaction belonging to the service bc440e_syst1. Compare the
display in SAPGUI to the HTML page you displayed in the browser. What
difference do you notice?
The HTML page displays less fields than the R/3 screen.
1-4-1 Import the service Global into your project. Search for the parameters that
determine which R/3 System and which R/3 user is used. Is load balancing used?
(dependent on training system)
1-5-1 Start the service bc440e_syst2. How is it different to service
bc440e_syst1?
When you logon you have to enter client and language
In which services parameters must the services bc440d_syst1 and
bc440d_syst2 be different?
~client and ~language
(C) SAP AG
BC440
37
Solutions
Topic: Creating and Using Internet Users
Creating Internet users
Create an Internet user for an existing flight customer.
2-2-1 Import the service bc440e_cust into your project. Open the service file to find
out which R/3 transaction belongs to this service.
BC440D_CUSTOMER
2-4-1 Start the service bc440e_cust. What are the similarities and the differences
between the R/3 transaction and the ITS service?
The R/3 user is also displayed in the R/3 transaction. In the browser you
cannot change all the fields.
(C) SAP AG
BC440
38
6
Web Transaction
Contents:
Programming Model
Service and Templates
Web Debugger
Synchronization
Internet users
Connecting to the Workbench Organizer
Theme and language
Output with Step Loop
HTMLBusiness Functions and Operators
MIME Objects
Context Macros
Frame Transactions
SAP AG 1999
(C) SAP AG
BC440
6.2
Web Transaction: Unit Objectives

Describe the programming model
"WebTransaction"
Create and edit service files and HTML templates
Use language dependencies in Web transactions
Define methods of transferring data from HTML
forms to R/3 Systems
Implement synchronization in Web transactions
Use MIME objects
Transfer the components of Web transactions to
the R/3 Workbench Organizer
SAP AG 1999
(C) SAP AG
BC440
6.3
Overview Diagram Web Transaction
7 Web RFC
8 Administration
5
4 HTML
Internet
Transaction
Server
6 Web
Transaction
SAP AG 1999
(C) SAP AG
BC440
6.4
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connecting
Connecting to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
6.5
Transaction Attributes
WebTransactions
Standard R/3 Transaction
Simple!
Processing is efficient in all

possible situations
Intended for use by everyone

(large number of users)
Users do not need to be
trained
Intended for professional

users
Users must be trained
Uses multimedia
and hyperlinks
to other systems
SAP AG 1999
A WebTransaction makes a small part of the entire R/3 functions available to Internet users. This means
that untrained Internet users can also use this functionality.
(C) SAP AG
BC440
6.6
SAP R/3
System Help
CGI
LH
Carrier ID:
HTTP
DIAG
SAP R/3
System Hilfe
100
HTTP
Web
browser
CGI
HTTP
server
DIAG
ITS
Carrier name:
Lufthansa
200
1 Screen =
1 Template =
1 HTML page
R/3
HTML
Service Business
file
templates
SAP AG 1999
on the above slide.
transaction.
(C) SAP AG
BC440
6.7
Programming Model
SAP R/3
System Help
Booking no. 561966

Cancel
Uses the logic of SAP

business objects via BAPIs
Transaction supports:
BAPIs
Business
Object
Generates simple screens

and screen sequences
Synchronization
1:1 relationship between

screens and templates
Special form of F4 help
Internet users
SAP AG 1999
When a WebTransaction is created, the whole transaction does not have to be implemented again.
Business functions already developed by SAP can be re-used.
SAP encapsulates business data in business objects. The next topic describes this concept and explains
how BAPIs are used to access these objects.
(C) SAP AG
BC440
6.8
Accessing BAPIs with ABAP
ABAP program
R/3
PROGRAM ...
TABLES ...
DATA ...
Business Object
Repository
MODULE init OUTPUT.

CALL FUNCTION 'BAPI_...' ...
ENDMODULE.
Business object A:
Method 1 = M1
Method 2 = M2
MODULE read_data INPUT.

ENDMODULE.
Function modules:
MODULE confirm_reservation.
CALL FUNCTION 'BAPI_...'...
IF ... .
ENDIF.
ENDMODULE.
BAPI_A_M1
BAPI_A_M2
SAP AG 1999
Within R/3 Systems BAPIs are called in an ABAP program with the command "CALL FUNCTION".
If a BAPI is to be called in a remote system, a remote function call (RFC) "CALL FUNCTION ..." is
used. DESTINATION ..."
The naming convention for BAPI function modules is:
BAPI_<Business object>_<method>
(C) SAP AG
BC440
6.9
Error Handling
No restrictions
Error handling with export parameters (structure or table)
Parameter name RETURN
ABAP dictionary structure BAPIRET2
SAP AG 1999
As BAPIs can also be called from non-SAP systems, exceptions cannot be used. Instead, the export
parameter RETURN is used
RETURN is defined in accordance with the ABAP Dictionary structure BAPIRET2. (BAPIs from
Release 3.1 can also use the structure BAPIRETURN):
TYPE
CHAR
1 Message type: S Success, E Error, W Warning, I Information
ID
CHAR
20 Message-ID
NUMBER
NUMC
3 Message-Number
MESSAGE
CHAR 220 Message text
LOG_NO
CHAR
20 Application log: log number
LOG_MSG_NO NUMC
6 Application log: current message number
MESSAGE_V1 CHAR
50 Message variable
MESSAGE_V2 CHAR
50 Message variable
MESSAGE_V3 CHAR
50 Message variable
MESSAGE_V4 CHAR
50 Message variable
If a BAPI is successfully called, the parameter RETURN may be empty, either all the fields contain the
correct initial values, or TYPE has the value 'S'. The BAPI documentation will provide more
information.
(C) SAP AG
BC440
6.10
BAPIs with Update Semantics
BAPIs are always called synchronously
Exception: sent asynchronously in an IDoc packet in ALE but

called synchronously in the target system
Database changes in the BAPI via update task

No COMMIT WORK in BAPI, it is in the calling system
Service object SAP0001 has BAPIs (here names of
function modules):
BAPI_TRANSACTION_COMMIT
BAPI_TRANSACTION_ROLLBACK
(and others)
SAP AG 1999
(C) SAP AG
BC440
10
6.11
The Design Process - Step by Step
BAPI search
HTML
Business
R/3
transaction
Task flow
Requirement
SAP AG 1999
This topic outlines the order of the steps required to design a WebTransaction.
(C) SAP AG
BC440
11
6.12
Requirement
Requirement
Task flow
BAPI search
R/3
transaction
HTML
Business
New product or existing

products?
Is the product
appropriate for the
Internet?
Internet
What is the target

group?
SAP AG 1999
The first step in the design process of a WebTransaction is to consider what is to be marketed on the
Internet:
Is the product appropriate for the Internet?
Are the potential customers accessible on the Internet?
What hardware resources do customers have? (such as network connections, screen size, number of
colors displayed)?
Are the products/information already available on the Internet? Do your products/information offer
more than your competitors?
(C) SAP AG
BC440
12
6.13
Task Flow
Requirement
Task flow
BAPI search
Logon
Cancel flight
Password correct?
Yes
Yes
Cancel
HTML
Business
Steps required to
design transaction for
the Web
Simple process flow
No
Use multimedia
Enter posting number

Are you sure?
R/3
transaction
Consider feasibility of
developing an R/3
transaction
No
End
SAP AG 1999
The second step in designing a WebTransaction is to describe the steps Internet customers will have to
follow. Keep in mind the following:
The process should be self-explanatory for the Internet user
Make use of WWW features, that is, incorporate multimedia
Think in HTML: only use forms and hyperlinks
Consider viability for use in R/3. WebTransactions are based on R/3 Transactions.
(C) SAP AG
BC440
13
6.14
Searching for BAPIs
Requirement
Task flow
R/3
Business Object
Repository
Business object A:
BAPI search
R/3
transaction
HTML
Business
Search for existing

business objects
Select required methods
(BAPIs)
Method 1 = BAPI_A_M1
Method 2 = BAPI_A_M2
Business object B:
Method X = BAPI_B_MX
Method Y = BAPI_B_MY
SAP AG 1999
The third step is to search for business objects and BAPIs.

The Business Object Builder has a search function.
(C) SAP AG
BC440
14
6.15
R/3 Transaction
Requirement
Task flow
BAPI search
HTML
Business
Create an
R/3 Transaction
SAP R/3
System Help
R/3
transaction
Use existing BAPIs
Booking no. 561966
Create simple screens
Cancel
MODULE cancel_booking INPUT.
CALL FUNCTION 'BAPI_A_M1'
...
ENDMODULE.
BAPIs
BO
SAP AG 1999
The fourth step is to create a transaction in R/3. Create simple screens, create input fields for
transferring data to the BAPIs and output fields for displaying the data delivered by the BAPIs.
The Internet Transaction Server uses these screens like a "normal" GUI user. The Internet user can enter
data in all the input fields and all the output fields can be sent to the Internet user. Internal fields in the
associated ABAP program cannot be modified or read.
(C) SAP AG
BC440
15
6.16
HTMLBusiness
Requirement
Booking no.
Task flow
BAPI search
R/3
transaction
HTML
Business
Business logic
in R/3
561966
Display on Web browser

using HTMLBusiness
templates
Language-independent
Book id:
Templates are generated

using SAP@Web Studio
561966
SAP AG 1999
The fifth and last step in designing a WebTransaction is to create HTMLBusiness templates.
The complete business logic of WebTransactions is in the R/3 System and can be developed separately
from the visual appearance of the HTML pages.
The SAP@Web Studio generates a raw version of HTMLBusiness templates from the WebTransaction
screens in R/3. These templates enable the WebTransaction to be fully tested. After the test, only the
visual appearance of the raw version has to be edited.
URLs of graphics, sound and other MIME objects are displayed in HTMLBusiness templates through
placeholders which the ITS replaces with "real" URLs at runtime. The replacement depends on the
theme determined at runtime. This means that the screen display of the WebTransaction can be roughly
defined and then the ITS can automatically generate the final screen display at runtime.
Together with language support, WebTransactions can be displayed to suit customer needs (for example,
use colors or images appropriate to different cultures or nationalities).
(C) SAP AG
BC440
16
6.17
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
17
6.18
~transaction
Transaction ABCD
Global.srvc
~systemName
~login
~password
~client
~language
abcd.srvc
~transaction
test.srvc
~transaction
~theme
~login
~language
SAP R/3
XYP
Meier
***
400
DE
System Help
Customer no.
31415
Password
*****
Book
ABCD
Transaction EFGH
EFGH
66
SAP R/3
System Help
Carrier ID:
LH
Display name
Service
files
SAP AG 1999
Each ITS service is based on a service description that specifies, for instance, the R/3 System and the
transaction to be used.
For each ITS there is a global service description containing standard settings for all the services in an
ITS. These settings can be added to or overidden by the individual service descriptions.
Each service description is kept in its own service file (ASCII file with extension srvc) in the file system
of the AGate server. The HTMLBusiness templates required for the EasyWebTransaction are also kept here
(HTML files with special placeholders for R/3 data).
Service names can have a maximum of 14 characters.
(C) SAP AG
BC440
18
6.19
Service Wizard
bc440demo.srvc
~transaction
~client
~login
~language
Service name BC440Demo
R/3 System
Client
User
<none>
ABC
XYZ
400
Service
files
Smith
Password use *******

DIAG
Language
EN
Transaction
bc440
400
Smith
DE
BC440
use RFC
SAP@Web
Studio
SAP AG 1999
The Service Wizard automatically creates a service file according to the user's requirements. Only
entries that complement the settings from Global.srvc are created. Entries in Global.srvc can be
overwritten.
The following entries in Global.srvc can be overwritten:
R/3 System used
R/3 user used
Logon language
Theme (see slides later in this Unit)
Be careful when entering the system and user. When the service is later transported into the test and
production system, these entries still indicate the development system.
The service file is created without a connection to R/3. User requirements are not checked first.
The automatically generated service file can be modified at any time.
(C) SAP AG
BC440
19
6.20
Web
Browser
HTTP
Start service
SAP@Web
Studio
AGate
WGate
Publish Service Files
ITS
R/3
Publish
abcd.srvc
test.srvc
MIME
Services Templates
Texts
Project BC440_Demo
SAP AG 1999
The service files and templates created on the hard drive must be copied to the file system on the AGate
server so that the service can be used. This process, called "Publish" is supported by SAP@Web Studio.
(C) SAP AG
BC440
20
6.21
Syntax in HTMLBusiness
HTMLBusiness syntax is very similar to C programming

language
HTMLBusiness commands appear in "normal" HTML and are
enclosed between ` (backticks)
`SDYN_BOOK-NAME.LABEL` <p>
<em> `SDYN_BOOK-NAME` </em>
The SAP@Web Studio displays HTMLBusiness commands in
blue.
SAP AG 1999
HTMLBusiness expressions are case-insensitive.

The character ` (backtick) was chosen because it has no special usage in "normal" HTML.
Another way of embedding HTMLBusiness in HTML is described later.
(C) SAP AG
BC440
21
6.22
Output of Screen Fields
Output fields and field labels are displayed on the

screen by using the same field names in the template
that are used on the screen
SAP R/3
System Help
`SDYN_BOOK-NAME.label` <p>
Customer name:
`SDYN_BOOK-NAME.value`
Mller & Co
200
The screen fields can be placed anywhere in the

template
SAP AG 2001
All the names in HTMLBusiness expressions are interpreted as names of fields in R/3 screens.
The following additions can be used with each screen field:
.name
Name and index of the field
.value
Field value
.label
Field label
.max
Number of lines in a multiple-line field
.exists
Does the field exist or is it suppressed (dynamically)?
.disabled
Ready for input status of a field
.type
Field type
.maxSize
Maximum input length of field
.visSize
Visible length
(C) SAP AG
BC440
22
6.23
Naming Conventions for Templates
<prg>_<dynpro_no>.html
SAP R/3
System Help
sapits050d_100.html
LH
Carrier ID:
`SCARR-CARRID.label`
SAP R/3
System Help
`SCARR-CARRID.value`
100
Carrier name:
Lufthansa
sapits050d_200.html
`SCARR-CARRNAME.label` <p>
Program
SAPITS050D
`SCARR-CARRNAME.value`
200
SAP AG 2001
The ITS requires one HTMLBusiness template for each R/3 screen of a WebTransaction.
One screen is always visible in R/3 at runtime. The ITS selects the relevant template from the file system
in the AGate using the naming convention described above.
The logic determining the screen sequence is completely in R/3 and is not known to the ITS.
In Releases earlier than 4.0 program names can only be a maximum of eight characters.
(C) SAP AG
BC440
23
6.24
Template Wizard
R/3 System
Program
ABC
XYZ
GHJ
sapbc440d
TZU
Screen Number 100; 200

Service
BC440Demo
Theme
99
Language
<none>
<body>
<form action="`wgateURL()`"...>
...
</form>
`~messageLine`
</body>
HTML
Business
templates
R/3 Logon
SAP@Web
SAP@Web
Studio
Studio
R/3
SAP AG 1999
The Template Wizard automatically creates an HTMLBusiness template for each R/3 screen.
HTMLBusiness expressions are automatically created for all the input fields, output fields and field labels.
The Wizard also embeds these fields into an HTML form using <input type=text ...>
Depending on the application, some HTML commands may have to be deleted.
The HTMLBusiness command ~messageLine is described later in this Unit.
The ITS manages templates according to theme and language. (discussed later in Unit). Basically, the
theme is determined by the service parameter ~theme and the language by the service parameter
~language. The parameter values should be passed to the Template Wizard.
The tempaltes are generated in R/3. The SAP@Web Studio must establish an RFC connection to an R/3
System to run a program from here. You can chose the R/3 System. All user data required for logon must
be specified.
The automatically generated templates can be modified at any time.
(C) SAP AG
BC440
24
6.25
File Hierarchy - Services and Templates
ITS (AGate)
The service files and the

are stored in the file
system of the AGate
GLOBAL
(srvc)
ITS050demo (srvc)
99
SAPITS050_100.html
Global.srvc contains
global settings that can
be added to or overwritten with special
service files
SAPITS050_200.html
Test
(srvc)
99
SAPTEST_301.html
SAPTEST_305.html
...
...
In each service there is

one template for each
screen
SAP AG 2001
(C) SAP AG
BC440
25
6.26
Web
Browser
HTTP
Start service
SAP@Web
Studio
AGate
WGate
Publish Templates
ITS
R/3
Publish
abcd.srvc
test.srvc
MIME
<b>ì`</b>
ìtab[i]`
Services Templates
Texts
Project BC440_Demo
SAP AG 1999
The service files and templates created on the hard drive must be copied to the file system on the AGate
server so that the service can be used. This process, called "Publish" is supported by SAP@Web Studio.
(C) SAP AG
BC440
26
6.27
Publish, Build and Go
Publish
Copy files from the project to the ITS
Note: Save open files first!
Build (active service)
Syntax check for all templates of the service
Save all open files
Copy all files of the service to the ITS
Go (active service)
Build and
Start the service in the Web browser
SAP AG 2001
(C) SAP AG
BC440
27
6.28
Input Using HTML Forms
The ITS as CGI program for HTML input

<form action="`wgateURL()`">
<input type=text name=`CUSTOMER.name` ...>
<select name=`CARRID.name`> ... </select>
<input type=radio name=`DURATION.name` ... >
<input type=checkbox name=`NONSTOP.name` ... >
<input type=submit ...>
</form>
Converting data in the AGate at runtime (example)

action="/scripts/wgate/XY/~flNXlPTQ...MwMg=="
SAP AG 2001
The ITS transfers data entered in HTML forms to screen fields ready for input.
All types of HTML input elements can be used.
The URL of the ITS (WGate) must be specified as the value of the action parameter in the HTML
form. In HTMLBusiness the function wgateURL()can be used for the ITS to automatically generate this
URL at runtime. Details are described later in Unit.
(C) SAP AG
BC440
28
6.29
Transferring Input to the R/3 Screen
HTML Form
Screen
SAP R/3
System Help
Customer no. 200
****
4 hours
12 hours
other
X Direct flights only
Duration
AGate
Password
Display
Password
Duration
Direct flight
Exit
Customer no.
ITS
Lufthansa
4 hours
12 hours
other
X
Carrier
SAP AG 2001
The ITS receives the query string from an HTTP request:

Standard
name1=value1&name2=value2&...
Example:
CUSTMR_NO=200&PWD=abap&DURATION=12&NONSTOP=+&NONSTOP=X&SCARRCARRID=LH&%7EOkCode%3DDISP=display
The ITS transfers the values in the request into screen fields with the same names as the screen.
If the service parameter ~submitChecking is set to 1, an error will occur if a name in the query
string of an HTTP request has no matching screen field name. An HTML page is displayed with an ITS
administration message.
Besides the input fields, the ITS also fills the command field (also called OK code field). It is of no
importance in this context whether menus, icons or pushbuttons exist for the screen.
The ITS sends the completed screen as a DIAG packet to the R/3 System. The R/3 System is unable to
distinguish between the ITS and a "normal" SAP GUI user.
(C) SAP AG
BC440
29
6.30
HTML Forms - Text and Password
Screen
Template
<input type=text
name=`CUSTMR_NO.name` >
<input type=password
name=`PWD.name` >
SAP R/3
System Help
CUSTMR_NO=200&PWD=abap
Customer no.
200
Password
****
Duration
Query string (example)
Direct flight
4 hours
12 hours
other
X
Carrier
SAP AG 1999
HTML input elements of types input and password are mapped to input and output fields of the
same name.
(C) SAP AG
BC440
30
6.31
HTML Forms Radio Buttons
Screen
Template
<input type=radio
name="`RB_04.group`"
value="`RB_04.name`">
<input type=radio
name="`RB_12.group`"
value="`RB_12.name`">
SAP R/3
System Help
Customer no.
Password
Duration

Direct flight
%%RBGROUP001=RB_12
4 hours
12 hours
other
X
Carrier
SAP AG 1999
As the selection buttons belonging to one selection button group have different names in R/3, but all
radio buttons belonging to one group have to have the same name in HTML, the attribute .group that
the ITS generates at runtime from the screen description is used in HTML Business. This attribute does not
exist in R/3.
With the attribute .selected you can determine whether the selection button is selected on the screen.
Alternatively, HTML input elements of type radio can also be mapped to input and output fields of
the same name.
As the user can only select one HTML radio button on the Internet, only valid input values can be
entered in the input field of the R/3 screen.
(C) SAP AG
BC440
31
6.32
HTML Forms - Checkbox
Screen
Template
<input type=hidden
name=`NONSTOP.name`
value=" ">
SAP R/3
System Help
Customer no.
<input type=checkbox
name=`NONSTOP.name`
value="X">
Password
Duration

Direct flight
NONSTOP=%20&NONSTOP=X
4 hours
12 hours
other
X
Carrier
SAP AG 1999
HTML input elements of type checkbox are also mapped to input and output fields of the same
name. The R/3 field can be a real checkbox (values and X or an input/output field (all values
possible).
With the attribute .selected you can determine whether the checkbox is selected on the screen.
The "hidden" input field of type hidden is only needed, if the R/3 screen is used several times in
succession.
Example without a hidden field:
The user selects the HTML checkbox and sends the HTML form to the ITS. The ITS writes an "X "
in the R/3 input field.
The user then removes the "X" from the HTML checkbox and sends the HTML form to the ITS.
The ITS does not delete the "X" from the input field as the checkbox name is not in the query
string.
Example with a hidden field:
The user selects the HTML checkbox and sends the HTML form to the ITS. The ITS first writes an "
", then an "X" in the R/3 input field.
Now the user deselects the HTML checkbox and sends the HTML form to the ITS. The ITS only
writes the " " in the input field.
(C) SAP AG
BC440
32
6.33
HTML Forms - Select
Template
Screen
<select
name=`SCARR-CARRID.name` >
<option value="LH">
Lufthansa
...
</select>

SCARR-CARRID=LH
SAP R/3
System Help
Customer no.
Password
Duration
4 hours
12 hours
other
Direct flight
Carrier
LH
SAP AG 1999
An HTML select is also mapped to input and output fields of the same name.
As the user can only select one entry from the HTML select on the Internet, only valid input values
can be entered in the output field of the R/3 screen (client-side check).
(C) SAP AG
BC440
33
6.34
HTML Forms - Submit
Template
Screen
<input type=submit
name="~OkCode=DISP"
value="display">
SAP R/3
System Help
DISP no.
Customer
Password
Duration
%7EOkCode%3DDISP=display
Direct flight
4 hours
12 hours
other
X
Carrier
SAP AG 2001
HTML input elements of type submit are mapped to the command field, if ~OkCode is used as a name in
HTML.
A button is not needed in R/3 but it is useful for testing the WebTransaction in R/3. The Template Wizard
creates an HTML submit button for each R/3 button on the screen.
(C) SAP AG
BC440
34
6.35
Exiting a Service
Template
Screen
<input type=submit
name="~OkCode=/NEX"
value="exit">
SAP R/3
System Help
/NEX no.
Customer
Password
Duration
%7EOkCode%3D/NEX=exit
Service parameter
Direct flight
~exitURL /BC440/home.html
4 hours
12 hours
other
X
Carrier
SAP AG 1999
The function code /NEX is processed directly by the R/3 System and terminates the SAPGUI
connection between the ITS and the application server.
The PAI for the current screen is not processed.
The ITS sends the page defined in the Global.srvc with ~exitURL to the Web browser, usually to
the home page of the HTTP server. This is usually the homepage of the HTTP server.
(C) SAP AG
BC440
35
6.36
Using wgateURL() in Forms
HTMLBusiness template
<form action="`wgateURL()`"> ...

<input type=submit name="~OkCode=PICK"
value="send"> </form>
HTML page at runtime (service XY):
<form action=".../wgate/XY/~flNPTQ...MwMg==">
... </form>
SAP AG 1999
The character string following the service name contains:

Session ID with which the ITS assigns requests to the correct session memory
HTTP content charset to select an appropriate character set for the browser
Status information about synchronization.
(C) SAP AG
BC440
36
6.37
Skipping the First Screen in a WebTransaction
Enter data in all the mandatory input fields of the

first screen
Send function code with ~OkCode
.../wgate/XY/!?~OkCode=DISP&
CUSTMR_NO=200&DEPARTS=X&...
SAP AG 1999
No values will be entered on the screen without ~okCode.
(C) SAP AG
BC440
37
6.38
Output With Table Control
Example: Output of table control MY_TC

<table>
<tr> <td></td>
`repeat with j from 1 to MY_TC.columncount`
<td>`MY_TC-column[j].title`</td>
ènd` </tr>
`repeat with j from MY_TC.firstvisible to
MY_TC.lastvisible`
<tr>
<td><input type=radio name="MY_TC"
value="`MY_TC-rowselect[j]`"
ìf(MY_TC-rowselect[j].selected)` checked
ènd`></td>
<td>`SDYN_CONN-CARRID[j].value`</td>
...
...
ènd`
</table>
SAP AG 1999
The extract comes from a template that was generated by the template wizard.
`repeat with <index> from <start> to <end>` ... ènd` is a loop in HTMLBusiness. The
loop counter <index> does not have be especially declared. It can be output with `<index>`.
You can specify the column headers of a TableControl in your template with <tc>column[<index>].title. <index> refers to an index for the column (from 1 to
<tc>.columncount).
Field values in TableControl line cannot be directly accessed within the R/3 System. In HTMLBusiness all
the TableControl lines visible on the screen can be accessed. The line number is added in square
brackets to the name of the screen field. The numbering begins with the attribute
<tc>.firstvisible and ends with <tc>.lastvisible.
If the TableControl has a selection column, this can be specified with <tc>-rowselect[index].
Note: rowselect is a fixed expression and does not depend on what you have called the selection
column in R/3. Depending on the type of selection column the Wizard generates the correct HTML Business:
Simple selection: <input type=radio name="`<tc>.name`"
value="`MY_TC-rowselect[j].name`
Multiple selection: <input type=checkbox name="`MY_TC-rowselect[j]`"
value="X"
(C) SAP AG
BC440
38
6.39
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
39
6.40
Debugging an EWT Using SAP GUI
SAP GUI
Web Browser
SAP R/3
Name
200
Password
****
System Help
Duration
4 hours
12 hours
other
X Direct flights only
Display
Exit
Customer no.
200
Password
****
Duration
Lufthansa
4 hours
12 hours
other
Direct flight
Carrier
LH
SAP AG 1999
ITS debugging allows you to display an EasyWebTransaction simultaneously in the browser and in the
SAP GUI for Windows.
To use the ITS debugging feature, you must explicitly switch it on on the virtual ITS. To do this, you
choose Configuration/Debug in the ITS Administration tool and set the switch Debug to On. This sets
the following key in the Windows NT Registry:
Key: HKEY_LOCAL_MACHINE /
SOFTWARE / SAP / its / 2.0 /
<virtual ITS> / Programs / Agate / AdminEnabled
Value:
(C) SAP AG
BC440
40
6.41
SAP GUI
AGate
WGate
HTTP
server
Web
Browser
Passive Debugging Using SAP GUI
R/3 applic.
server
5
HTTP
TCP/IP
DIAG
SAP AG 1999
ITS debugging of a service requires that the service is first started from the Web browser. Once the
browser has received the first HTML page from the ITS, a SAP GUI connection must be established to
the AGate.
From the point of view of the SAP GUI the AGate behaves like an R/3 application server. The user name
and password are not requested because the AGate is already connected to R/3 through starting the
service. The SAP GUI displays each screen sent by the application server to the AGate.
The following steps take place:
An HTTP request of the browser arrives at the HTTP server. The HTTP server forwards it to the
WGate.
The WGate sends the request to the AGate.
The AGate creates a DIAG data packet and sends it to the R/3 application server which processes the
data.
The next screen is sent as a DIAG data packet to the AGate.
The AGate converts the DIAG data packet into an HTML page and sends it to the WGate. The AGate
then sends a copy of the DIAG data packets received to the SAP GUI. The user sees the screen that
arrived at the AGate before.
The HTTP server sends the HTML page that the WGate received as an HTTP response to the Web
browser.
(C) SAP AG
BC440
41
6.42
AGate
WGate
HTTP
server
Web
browser
Debugging Using SAP GUI Active
SAP GUI
R/3 application
server
4
HTTP
TCP/IP
DIAG
SAP AG 1999
If the user enters data via the SAP GUI, the AGate sends it to the R/3 application server. The result is
forwarded by the AGate directly to the SAP GUI.
An HTML page cannot be sent to the Web browser because the HTTP client/server structure requires an
HTTP request from the browser (client), before an HTTP response can be sent.
To establish a connection to the AGate using the SAP GUI, you must specify the instance number. You
set this instance number for each virtual ITS in the ITS Administration tool. To do this, choose
Configuration/Debug and set the SapguiDebuggerPort switch to sapdp<xx> where <xx> is the instance
number. This sets the following key in the Windows NT Registry:
Key: HKEY_LOCAL_MACHINE /
SOFTWARE / SAP / its / 2.0 /
<virtual ITS> / Programs / Agate / SapguiDebuggerPort
Value:
sapdp<xx>
After a virtual ITS has been installed, the value sapdp00 is set for the SapguiDebuggerPort.
(C) SAP AG
BC440
42
6.43
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
43
6.44
Synchronization Problem
SAP R/3
LH 400
01.06.00
300
1
4
LH 400
LH 400
LH 400
200
01.06.00
02.06.00
05.06.00
Details
LH 400
01.06.00
LH 400
01.06.00
300
PICK
ITS
AGate
6
SAP R/3
300
LH 400
01.06.00
300
R/3
SAP AG 1999
Provided that the user only clicks hyperlinks and sends forms in an EasyWebTransaction, the browser
and the R/3 System are synchronized.
If the user clicks the Back button in the browser, he or she is taken one step back (in the browser
history). The R/3 System, however, retains its previous status. Now the browser and R/3 have different
statuses and are no longer synchronous.
If the user goes forward again by clicking hyperlinks or sending forms, he sends data of a screen to R/3
that is not displayed at the moment. The data and the function code are ignored by R/3 - the status of
R/3 does not change. As the ITS responds passively to the screens sent by R/3, the ITS creates a suitable
HTML page.
(C) SAP AG
BC440
44
6.45
Synchronization - Simple Solution
SAP R/3
LH 400
01.06.00
03
LH 400
LH 400
LH 400
02
01.06.00
02.06.00
05.06.00
Details
ITS:
Browser Back
not supported
ID Scrn.
01 100
02 200
03 300
LH 400
01.06.00
300
ITS
AGate
4
~SyncBehaviour NoResync
R/3
SAP AG 1999
The ITS "hides" a status number in each HTML page. Details of this number (e.g. the screen number)
are stored in the ITS. This enables the ITS to check for each HTTP request whether the browser and R/3
are synchronized.
If the ITS determines that the browser and R/3 are no longer synchronized, dependent on the service
parameter ~SyncBehaviour it can execute one of the following actions:
Simple solution: Generate an HTML page that tells the user that BACK is not allowed. The
transaction in R/3 does not know anything about this.
Comfortable solution: Request the R/3 transaction to roll back as far as required for the browser and
R/3 to be synchronous again. This must be incorporated into the R/3 transaction.
(C) SAP AG
BC440
45
6.46
Synchronization - Comfortable Solution
SAP R/3
LH 400
01.06.00
03
LH 400
LH 400
LH 400
02
01.06.00
02.06.00
05.06.00
Details
LH 400
05.06.00
ID Scrn.
01 100
02 200
03 300
04 300
300
SAP R/3
LH 400 01.06.00
LH 400 02.06.00
LH 400 05.06.00
200
PICK
ITS
AGate
8
LH 400
01.06.00
AWSY...
SAP R/3
04
LH 400
05.06.00
300
R/3
SAP AG 1999
Synchronization in detail (example):

The ITS receives screen 300 by DIAG.
The ITS generates the associated HTML page and sends this page with the status number 03 to the
browser.
The user chooses the BACK button in the browser. The ITS is not aware of this action. The Web
browser sends a completed HTML form to the ITS via the HTTP server.
The ITS checks the status number 02 and determines that synchronization is necessary. The ITS then
sends the function code AWSY<prog><screen_no> to the R/3 System.
The ABAP program uses SET SCREEN to display the correct screen 200. The ITS receives the
correct screen 200 by DIAG.
The ITS fills the input fields and sends the associated function code.
The input is processed in R/3 and the result screen 300 is sent by DIAG to the ITS. The ITS receives
screen 300 by DIAG.
browser.
Note: The ITS sends AWSY... only once - R/3 has only one chance to send the correct screen.
(C) SAP AG
BC440
46
6.47
Synchronization Table
DATA: sync_itab TYPE TABLE OF sitssync,

sync_wa TYPE sitssync.
subsc
repid
dynnr
MAIN
sapmits100
200
LEFT
sapmits100
100
RIGHT1 sapmits100
300
RIGHT2 sapmits100
400
SAP AG 1999
The ITs provides the information about what screen is required in an internal table. This table contains
one or more rows
Always a row with SUBSC = MAIN. This row contains the program name and the number of the
(main) screen required by the ITS.
Further rows only if the main screen contains subscreen areas that also have to be synchronized (see
unit Frame Transactions).
(C) SAP AG
BC440
47
6.48
Synchronization ABAP Coding (1)
DATA
...
sync_itab TYPE TABLE OF sitssync,

CASE ok_code(4).
WHEN 'AWSY'.
CALL FUNCTION 'ITS_GET_SYNC_INFO'
TABLES
sync_info
= sync_itab
EXCEPTIONS
its_not_available = 1
others
= 2.
See next slide
ENDCASE.
SAP AG 1999
To allow an EasyWebTransaction to be synchronized, the ITS sends a function code beginning with
AWSY. The other characters are no longer relevant.
In the ABAP program the function module ITS_GET_SYNC_INFO must then be called. The
synchronization information is requested from the ITS using RFC and stored in the internal table
(interface parameters).
(C) SAP AG
BC440
48
6.49
Synchronization ABAP Coding (2)
READ TABLE sync_itab INTO sync_wa

WITH KEY subsc = 'MAIN'.
IF sy-subrc = 0.
... " internal roolback
Possibly:
Deletes internal tables
Initializes fields
Releases database locks
...
LEAVE TO SCREEN sync_wa-dynnr.
ENDIF.
SAP AG 1999
Before the LEAVE TO SCREEN ..., the internal logic of the ABAP program must be synchronized,
which means that the previous input must be discarded.
(C) SAP AG
BC440
49
6.50
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connecting
Connecting to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
50
6.51
Internet User - Object Type Dependency
SCUSTOM
MANDT ID
400
400
400
400
199
200
201
202
NAME
...
Smith
Meier
SAP
Hendriks
...
...
...
...
SCUSTOMER
(Flight
customer)
BAPIUSW01
MANDANT OBJTYPE
400
400
400
400
LFA1
KNA1
SCUSTOMER
SCUSTOMER
OBJID
200
200
200
201
PASSWORD
...
BDC3238AB8651EF
AAAAGB12F4G5R6T
ALIK8675J11K1UZ
HGD234HDS134GFT
...
...
...
...
SAP AG 1999
Internet users are created for business objects. For example, there may be a customer with customer
number 200, a vendor with vendor number 200, and an applicant with applicant number 200.
An Internet user makes sense only if the corresponding entry has been maintained in the master data
table associated with the business object.
Internet users are client-specific.
(C) SAP AG
BC440
51
6.52
Check at Runtime
When Internet users are created, the system does not

check if the master record exists.
At runtime the following checks are carried out:
Does the master record exist in the relevant application table?
Does the Internet user exist in table BAPIUSW01?
Is the Internet user unlocked?
Is the password correct?
Standard name for BAPIs (here name of FM):
BAPI_<Business Object>_CHECKPASSWORD
SAP AG 1999
The Internet user is normally checked by means of a BAPI to which the Internet user ID and password
are passed.
(C) SAP AG
BC440
52
6.53
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
53
6.54
The R/3 Workbench Organizer and Transport System
An R/3 system landscape consists of at

least three systems:
DEV - Development of new objects
QAS - Consolidation (testing, quality

assurance)
PRD - Production operation
The original of each object is in the

system in which it was created
DEV
R
QAS
Any changes made to an object are

entered in the Workbench Organizer
(WBO) and transferred to subsequent
systems by the Transport System
PRD
SAP AG 2001
(C) SAP AG
BC440
54
6.55
AGate
R/3 System Landscape with ITS Integration (IACOR)
HTTP
ITS
DEV
AGate
HTTP
ITS
QAS
AGate
HTTP
ITS
PRD
SAP AG 1999
(C) SAP AG
BC440
55
6.56
Transporting an ITS Service
DEV
QAS
Add
Add
DEV
PRD
Get
Get
QAS
Get
Get
PRD
SAP AG 1999
Note: The SAP@Web Studio is not shown in the slide although all transports between R/3 and ITS
always run via SAP@Web-Studio.
There are four types of transport between R/3 and SAP@Web-Studio:
Add - create objects in R/3 (only executed once for each object)
Get - read objects from the R/3 System (Corrections not possible)
Check out - lock and read objects in R/3
Check in - write changed objects back to R/3 and remove lock
(C) SAP AG
BC440
56
6.57
Web
browser
AGate
WGate
Project - WBO Connection via SAP@Web Studio
HTTP
R/3
ITS
Check in
Check out
SAP@Web
Studio
test.srvc ìtab[i]`
MIMEs
Services
start
list
Templates Flow Files
Seats
seats
Texts
Project ITSxxx_Demo
SAP AG 1999
The SAP@Web Studio enables all the objects of a project to be transferred to the WBO or to the R/3
Transport system. These are transported together with the relevant ABAP programs.
Following the transport into the Consolidation or Production system, the objects can be loaded from R/3
into a project and copied to WGate and AGate using Publish.
(C) SAP AG
BC440
57
6.58
Add to the Development System
Project File View
2
Assign
Assign
WBO
WBOrequest
request
GLOBAL
(srvc)
BC440demo (srvc)
50
SAPBC440_100.html
SAPBC440_200.html
BC440demo_DE.htrc
DEV
Add
Add
R/3 Logon
for RFC from
SAP@Web Studio
into R/3
SAP@Web
Studio
SAP AG 2001
All the required objects are selected in the Project - File View of the SAP@Web Studio.
These objects are written by RFC to the R/3 database using Add.
The objects must be assigned to a development class and a development task in R/3. Languagedependent objects can be translated using R/3 translation tools.
With Add language-dependent objects are transferred only in the logon language to R/3.
With the R/3 translation tools text files of a service can be translated in R/3. Use the translation tools
for logical objects. Choose the Sie dazu logical object IARC. Use F4 input help to select the text
name.
Alternatively you can select the R/3 attribute multi-language. Then you can also use add to transfer
objects into R/3 in other languages.
For the latter way you have to use language-dependent MIME objects. These cannot be translated in
R/3.
The tables containing the objects belong to development class SBF_WEB.
(C) SAP AG
BC440
58
6.59
Corrections (Check Out and Check In)
Check
Checkout
out
Project File View
GLOBAL
(srvc)
BC440demo (srvc)
1
Assign
Assign
WBO
WBOrequest
request
50
SAPBC440_100.html
SAPBC440_200.html
BC440demo_DE.htrc
DEV
Check
Checkin
in
SAP@Web
Studio
SAP AG 2001
(C) SAP AG
BC440
59
6.60
AGate
Get from the Production System
R/3 Logon
for RFC from
SAP@Web Studio
into R/3
Publish
Publish
Get
Get
Project File View
PRD
ITS
HTTP
GLOBAL
(srvc)
BC440demo (srvc)
99
SAPBC440_100.html
SAPBC440_200.html
BC440demo_DE.htrc
SAP@Web
Studio
SAP AG 2001
With Get objects are read by RFC from the R/3 database into a project.
From the project these objects must be copied using "Publish" to the AGate and HTTP server.
Objects cannot be changed in SAP@WebStudio. The functions Check out and Check in can be used for
repairs. These functions can lock and unlock the objects for correction.
(C) SAP AG
BC440
60
6.61
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
61
6.62
Theme Different Layouts for a Screen
LH
SAP R/3
AGate
Airline carrier:
50
99
Airline carrier
LH
Airline carrier:
`SCARR-CARRID.label`<p>
<form ...> ... </form>
<img...src="...">
<img src="...">
... `SCARR-CARRID.label`<p>
50 <form ...> ... </form>
HTML
Business
templates
LH
100
ITS
...99
System Help
R/3
For each
screen:
1 theme =
1 template
SAP AG 1999
The whole business logic of an EasyWebTransaction is in R/3. However, the actual appearance (layout)
is determined by the HTMLBusiness templates used.
If the same EasyWebTransaction is to be used by different user groups, it may be necessary to provide
different screen layouts. The ITS uses themes for this.
A theme is a logical name for the screen layout of EasyWebTransactions. The name consists of two lines
(letters or digits). Any number of themes can be used for one EasyWebTransaction.
A theme is specified at the start of a service and it cannot be modified while the service is running.
(C) SAP AG
BC440
62
6.63
File Hierarchy - Themes
ITS (AGate)
GLOBAL
(srvc)
ITS050demo (srvc)
50
SAPITS050_100.html
SAPITS050_200.html
...
...
99
The theme determines

the look-and-feel of a
WebTransaction
For each screen a
template can (must) be
created for each theme
The name of a theme
consists of two digits or
characters
SAPITS050_100.html
SAPITS050_200.html
...
...
SAP AG 2001
All the objects in a WebTransaction are stored in the file system of the AGate and sorted by theme. The
directory name is the same as the name of the respective theme.
(C) SAP AG
BC440
63
6.64
Which Theme is Used?
No
~theme in
URL?
Yes
~theme in
<srvc>.srvc?
No
Yes
~theme in
Global.srvc?
No
Yes
Theme
Themefrom
from
Global.srvc
Global.srvc
Theme
Themefrom
from
<srvc>.srvc
<srvc>.srvc
Theme
Themefrom
from
URL
URL
General
Theme
Theme ==
Special
SAP AG 1999
The theme used by the ITS at runtime is determined by the value of the parameter ~theme in
Global.srvc or in the service file of the service. This value can still be changed by entering a value
for ~theme in the URL that starts the service.
If ~theme is not specified or is not set in the URL (~theme= " " ), no theme is used.
(C) SAP AG
BC440
64
6.65
Language Independency Through DDIC Reference
Flge anzeigen
Fluggesellschaft:LH
DE
AGate
System Hilfe
DE
Fluggesellschaft: LH
Display flights
System Help
EN
ITS
EN
Carrier:
LH
Carrier: LH
...
<img src="...">
<form ...> ... </form>
...
SAP AG 1999
1 Screen =
1 Template
HTML
Business
templates
If the same EasyWebTransaction is to be used by different user groups, different languages may be
required. The ITS also supports this requirement.
When a service is started, a language is determined that cannot be changed while the service is running.
This language is used to log on to the R/3 System.
All field labels on screens that have been created with Data Dictionary reference are automatically
displayed in R/3 in the correct language. The ITS uses these texts when the HTML Business templates are
converted into HTML pages.
Language-dependent screen texts are provided without any additional maintenance required.
(C) SAP AG
BC440
65
6.66
R/3 Window Title and Status Bar
Flge anzeigen
Flge anzeigen
DE
XY nicht bekannt
AGate
Fluggesellschaft:XY
System Hilfe
DE
XY nicht bekannt
Display flights
System Help
Display flights
EN
ITS
EN
XY unknown
Carrier: XY
XY unknown
SAP AG 1999
...
<em>`~windowTitle`</em>
<form ...> ... </form>
<em>`~messageLine`</em>
...
HTML
Business
templates
The window title and the messages in the status bar on the R/3 screen are also displayed in the logon
language.
The HTMLBusiness command ~windowTitle transfers the text displayed in the title bar on a screen
(ABAP: SET TITLE) to the relevant HTML page.
The HTMLBusiness command ~messageLine transfers the text displayed in the status bar on a screen
(ABAP: MESSAGE) to the relevant HTML page.
If the status bar is empty, ~messageLine is deleted (replaced by an empty character string).
(C) SAP AG
BC440
66
6.67
Language Independency Through Text Files
Flge anzeigen
DE
Testen Sie uns!
AGate
System Hilfe
DE
Display flights
System Help
EN
ITS
EN
Carrier:
LH
Carrier: LH
Test us!
SAP AG 1999
...
<img src="...">
1
<form ...> ... </form>
1
<font ...>`#slogan`</font>
...
HTML
LanguageBusiness dependent
templates
texts
Language =
Text file
If not all language-dependent texts can be fetched from the R/3 System, HTML Business enables
placeholders for language-dependent text to be used in templates. At runtime these placeholders
are replaced by the relevant text from language-dependent text files
(C) SAP AG
BC440
67
6.68
Language-Dependent Placeholders
Template for
service ITS100
... <table>
<tr>
<th>`#header1`</th>
<th>`#header2`</th>
<th>`#header3`</th>
</tr>
...
</table> ...
German text file:

ITS100_DE.htrc
header1
header2
header3
Nr.
Startort
Flughafen
English text file:

ITS100_EN.htrc
header1
header2
header3
No.
City from
Airport
SAP AG 2001
A placeholder for language-dependent texts is identified in HTML Business by `#<name>`. <name> can
be any character string with a maximum of 132 characters.
The Web Application Builder allows you to maintain placeholders in the original language only.
Placeholders are translated using the translation tool (SE63).
(C) SAP AG
BC440
68
6.69
Maintaining Language-Dependent Placeholders
SAP R/3
System Help
Internet service
ITS100Demo
ITS100Demo
Theme
99
Attributes
Parameters
Parameter
Value
header1
header2
header3
No.
City from
Airport
Theme 50
HTML templates
Theme 99
HTML templates
Translation of language-dependent placeholders for themes SE63
SAP AG 2001
For each theme, the Web Application Builder automatically provides for the maintenance of languagedependent placeholders.
You can use the Adjust parameters function to find all language-dependent placeholders in a theme that
are used in one of the HTMLBusiness templates.
Language-dependent placeholders are translated using the R/3 translation tool (SE63, Translation
-> Logical objects -> Logical objects -> Object type IARP).
(C) SAP AG
BC440
69
6.70
File Hierarchy - Texts
ITS (AGate)
GLOBAL
ITS100DEMO (srvc)
50
SAPITS100D_100.html
SAPITS100D_200.html
ITS100demo_DE.htrc
ITS100demo_EN.htrc
99
SAPITS100D_100.html
SAPITS100D_200.html
ITS100demo_DE.htrc
ITS100demo_EN.htrc
(srvc)
For each service, text

files for any number of
languages can be
created for each theme
SAP AG 2001
A text file is required for each language and for each theme to be provided in the Internet.
If no text is available for a placeholder at runtime, the placeholder is deleted (by replacing it with an
empty character string).
(C) SAP AG
BC440
70
6.71
Logon Language and Template Language
Logon language: ~language
Language to log on to R/3
You cannot log on if this language has not been

installed in R/3
Template language: ~templateLanguage
Language for templates
Allows communication with Internet users in a

language that has not been installed in R/3
Therefore, language-dependent texts from R/3

cannot be used
If ~templateLanguage has not been specified,

~language is used
R/3
R/3
AGate
AGate
SAP AG 2001
If a language to be used on the Internet is not available in R/3, different languages can be used for logon
to R/3 and for converting language-dependent texts (template language)
The disadvantage of this approach is that the field labels transferred from R/3 will not be in the same
language as the texts from the ITS text files.
(C) SAP AG
BC440
71
6.72
Which Logon Language is Used?
No
~language in
Global.srvc?
~language in
<srvc>.srvc?
No
No
Yes
~language=""
in <srvc>.srvc?
Yes
Yes
~language=""
in Global.srvc?
Yes
Yes
~language in
URL?
No
No
LL
LLfrom
from
Global.srvc
Global.srvc
LL
LLfrom
from
<srvc>.srvc
<srvc>.srvc
LL
LLfrom
from
URL
URL
General
Prompt
Promptfor
for
LL
LL
Special
SAP AG 1999
The language the ITS uses at runtime is determined by the value in the parameter ~language in
Global.srvc or in the relevant service file.
If ~language is set to "" (empty), the language can be specified be entering a value for ~language
in the URL.
If a language has not been specified either by the service file or by the URL when a service is started, the
ITS automatically generates an HTML form requesting the user to specify a language.
(C) SAP AG
BC440
72
6.73
Which Logon Language is Used?
~language
in URL?
No
Yes
~language
in <srvc>.srvc?
No
Yes
~language
in Global.srvc?
No
Yes
Logon
Logonlanguage
language Logon
Logonlanguage
language
from
Global.srvc
from
<srvc>.srvc
from Global.srvc from <srvc>.srvc
Logon
Logonlanguage
language
from
fromURL
URL
General
Prompt
Promptfor
for
logon
language
logon language
Special
SAP AG 1999
The language the ITS uses at runtime is determined by the value in the parameter ~language in
Global.srvc or in the relevant service file. This value can still be changed by entering a value for
~language in the URL that starts the service.
If no language has been set either by the service file or by the URL when a service is started, the ITS
automatically generates an HTML page requesting the user to specify a language.
(C) SAP AG
BC440
73
6.74
Web
browser
AGate
WGate
Publishing Language-Dependent Texts to the ITS
HTTP
ITS
R/3
IACOR Publish
abcd
test
MIMEs
Services
<b>ì`</b>
ìtab[i]`
Templates Flow Files
Seats
seats
Texts
SAP AG 1999
The language-dependent placeholders maintained in the Web Application Builder must be transferred to
the file system of the AGate to enable the ITS to generate the HTML pages based on the templates. This
process, called "Publish" is supported by the Web Application Builder.
The language-dependent placeholders are stored as text files (.htrc) in the file system of the AGate.
(C) SAP AG
BC440
74
6.75
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
75
6.76
Step Loop in R/3 (1)
PROCESS BEFORE OUTPUT.
Flow
logic
ITAB CARRID CONNID

AA
LH
LH
MODULE fill_itab.
LOOP.
MODULE read_line.
ENDLOOP.
77
400
402
SDYN_CONN
LH
MODULE read_line OUTPUT.
400
SAP R/3
count = offset + sy-stepl.

READ TABLE itab
INDEX count
INTO sdyn_conn.
...
Source
ENDMODULE.
System Help
AA
LH
LH
77
400
402
code
SAP AG 1999
Step loops are used to display tables on R/3 screens.

In the above example, an internal table is filled in the module fill_table ( for example, by accessing
a database table).
Step loops consists of several components:
Fields of a structure that ideally has the same row type as the internal table are placed as a row on a
screen. This row is converted into a step loop. Then the row is multiplied (to three rows in the
above example).
In the PBO component of the screen flow control, you must specify a module within the LOOP ...
ENDLOOP loop which is called once for each row of the step loop at runtime. The system field
SY-STEPL containing the number of the row to be filled is in this module. Fields are transferred to
the screen by comparing field names, the same way as "normal" screen fields are transferred.
There must also be a LOOP .... ENDLOOP loop in the PAI section of the screen flow control. A
module only has to be specified if the step loop is used for input.
The internal table that fills the step loop may contain more entries than can be shown on the screen at
one time. In this case a scroll logic can be programmed that allows the user to display all the rows of an
internal table in sequence.
(C) SAP AG
BC440
76
6.77
Loops to Output Multiple Lines
REPEAT loop
<table> `repeat with j from 1 to
SDYN_CONN-CONNID.max`
<tr> <td> `SDYN_CONN-CONNID[j].value` </td>
...
</tr>
ènd` </table>
FOR loop
<table> `for (i=1; i<=SDYN_CONN-CONNID.max; i++)`
<tr> <td> `SDYN_CONN-CONNID[i].value` </td>
...
</tr>
ènd` </table>
SAP AG 2001
The counter variable in the loops must be declared. As they are used in loops, they are implicitly defined.
The variable is still available after the loop has ended.
REPEAT - variations:
`repeat <expression> times` ... ènd`
<expression> - Fixed number or calculation standard processed at the start of the loop (more
information on standards later in this unit).
FOR - standard syntax:
`for ( <init>; <log. expr.>; <modify>)` ... ènd`
<init> - For expressions executed only before the loop is passed
<log. expr.> - Logical expression checked before each loop is passed. If the expression is
incorrect, the loop is ended.
<modify> - For expressions executed after each loop is passed.
Loops can be used without step loops.
(C) SAP AG
BC440
77
6.78
wgateURL() Usage in Hyperlinks (1)
HTMLBusiness template:
<a href="`wgateURL(~OkCode="PICK")`">
`#display` </a>
<a href=".../wgate/XY/~flNXlPTQ...MwMg==?
~OkCode=PICK">
Display </a>
SAP AG 2001
The hyperlink must send a function code to the R/3 System to start the PAI processing in R/3. As with
forms, ~OkCode is used.
(C) SAP AG
BC440
78
6.79
wgateURL() Usage in Hyperlinks (2)
<a href="`wgateURL(~OkCode="PICK",
CARRID=SDYN_CONN-CARRID[i].value)`">
`SDYN_CONN-CARRNAME[i].value` </a>
<a href=".../wgate/XY/~flNXlPTQ...MwMg==?
~OkCode=PICK&CARRID=LH">
Lufthansa </a>
SAP AG 2001
As well as the function code, a hyperlink can also enter values in other input and output fields in the
current screen.
Note: If hyperlinks are used in a form, only the data in the URL of the hyperlink is submitted, not the
data in the input elements of the form.
(C) SAP AG
BC440
79
6.80
Step Loop Without Scrolling Function
More entries in the

internal table than in
the step loop
77
400
AGate
AA
LH
CARRID
AA
LH
LH
SQ
CONNID
77
400
402
13
SAP R/3
System Help
AA
LH
ITS
77
400
R/3
SAP AG 1999
The ITS can only access the values in fields that are visible on the screen. If there are more entries in the
internal table than can be displayed on the screen, the Internet user cannot display all the table rows.
This problem can be solved with a transaction used by "true" GUI users which provides users with
scrolling keys that allow them to scroll page-wise. The next slide shows how this works.
Note: The maximum size of a DIAG data packet is 30KByte! More data cannot be displayed on one
screen. A step loop with scrolling functions can deal with this problem.
(C) SAP AG
BC440
80
6.81
Step Loop with Scrolling Function
More entries in the

internal table than in
the step loop
77
400
402
13
AGate
AA
LH
LH
SQ
CARRID
AA
LH
LH
SQ
SAP R/3
System Help
AA
LH
ITS
The ITS pages up/down the step

loop with the key combinations
Shift+F9 and Shift+F11
CONNID
77
400
402
13
77
400
SAP R/3
System Help
LH
SQ
402
13
SAP AG 1999
If a scrolling function exists for the step loop, the ITS uses it to forward the entire contents of the
internal table to the Internet user. The ITS proceeds as follows:
"Pressing" function key "Shift+F9" (first page).
"Pressing" function key "Shift+F11" (next page) as many times until the step loop no longer changes.
The ITS notes all the lines that are visible.
"Pressing" function key "Shift+F9" (first page).
The ITS fills the template corresponding to this screen with all the data that was visible beforehand.
The generated HTML page contains a "long" table with all rows from the internal table.
The HTML page containing the table can be scrolled in the browser.
Technically, the ITS requires that a GUI status is set in which the function keys "Shift+F9" and
"Shift+F11" are active. The ITS sends those function codes to the R/3 System that are stored for these
keys in the GUI status.
The scrolling icons are only used for testing in R/3 and are not recognized by the ITS.
(C) SAP AG
BC440
81
6.82
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
82
6.83
Embedding HTMLBusiness in HTML
Linking several HTMLBusiness tags with ";"

`repeat with i from 1 to 5` ì` ènd`
can be replaced with
`repeat with i from 1 to 5; i; end`
SAP AG 2001
(C) SAP AG
BC440
83
6.84
Functions in HTMLBusiness (1)
writeEnc() Output "URL-coded"

"`write(CITY.value)`" "`writeEnc(CITY.value)`"
"New York" - "New%20York
wgateURL()
Generates URLs for forms and hyperlinks
mimeURL()
Includes MIME objects stored in the file system
of the WGate
String functions
SAP AG 2001
The following string functions are available:

strCat
Link character strings
strCmp
Compare character strings
strCat
Copy character strings
striCmp Compare character strings (case-insensitive)
strLen
Length of character string
strLwr
Copy a character string to lower case
StrnCmp Compare the first characters of two character strings
striCmp Compare the first characters of two character strings (case-insensitive)
strStr
Search character sub-string
strSub
Copy character sub-strings
strLwr
Copy a character string to upper case
For more information refer to the application help documentation.
(C) SAP AG
BC440
84
6.85
Error Handling - assert() (1)
Error messages for an input field
<form action="`wgateURL()`">
<input type=text name=ÌD.name`>
àssert(ID.name)`
<input type=text name=`DATE.name`> àssert(DATE.name)`
</form> <p> `~messageLine`
~errorMarker
<img src="....">
SAP R/3
Invalid date!
Invalid date!
LH
11/31/00
Carrier
Date
LH
11/31/00
R/3
SAP AG 1999
A check against valid input can be added to each input field of a screen in R/3 Systems. A FIELD
statement for the input field is used in the flow logic of the screen and the input is checked in a PAI
module.
If the input is invalid, a message of type E (Error) is triggered. As a result, the screen is resent to the user
with only the invalid field ready for input. The message is displayed in the status bar of the screen.
On the HTML side, you can use the HTMLBusiness function assert() to display a text and/or an image
beside the field whose value was recognized as invalid in R/3. The service parameter ~errorMarker
determines by what the assert() function is replaced.
You can freely choose the value of the service parameter ~errorMarker for each service. As
~errorMarker is neither language- nor screen-dependent, you should use ~messageLine to
transfer the error message from the status bar on the R/3 screen to the HTML page.
R/3 screens on which an error message is issued can only be quit after the correct field values are entered
or a function code of type E is triggered. Since when synchronization is enabled, the function code sent
by the ITS (AWSS... or AWSY...) is not of type E, you should set the service parameter
~syncBehaviour to NoReSync if you use the assert() function.
(C) SAP AG
BC440
85
6.86
Operators in HTML Business (1)
Value assignment
=
(Help fields must not be declared)
Arithmetic operators
&
Links character strings
+, ++ Addition
*
Multiplication
-, --
Subtraction
Division
Modulo division
|| Logical OR
&&
Logical AND
SAP AG 2001
++ and -- have the same meaning as in C/C++, that is, increase by 1 and decrease by 1.
(C) SAP AG
BC440
86
6.87
Operators in HTML Business (2)
Relational operators
==
Equal to
!=
Not equal to
>
Greater than
<
Less than
>=
Greater than or equal to
<=
Less than or equal to
SAP AG 2001
Note: As in C/C++, "=" is used to assign values, not to compare values.
(C) SAP AG
BC440
87
6.88
Conditional Replacement
Basic form
ìf (SCARR-CARRID.value == "LH")`
<em> Lufthansa </em>
èlse`
<span id="blue"> other airline </span>
ènd`
Query different values in same field

ìf (SPFLI-CITYFROM.value == "New York")`
<em> Empire State Building </em>
èlseif (SPFLI-CITYFROM.value == "London")`
<b> Tower Bridge </b>
èlseif (SPFLI-CITYFROM.value == ...)`
...
ènd`
SAP AG 2001
If directly copying the value of a screen field is not sufficient, you can use the HTML Business expressions
above to make a conditional replacement.
else and elseif can be used together in a ìf ... end`.
Logical expressions are formulated the same as in C/C++.
Logical expressions are enclosed in round brackets
The logical operators ==, !=,<, <, >= and <= can be used.
Note: If a fixed value (literal) is to be compared as in the above example, enclose it in " ". Without
" the value of the screen field of the same name is compared.
Strings are case-sensitive.
(C) SAP AG
BC440
88
6.89
User-Defined Functions
Definition of a function:
`function button(text, fcode)
write("<input type=submit name=~OkCode=", fcode,
" value=", text, " >");
end`
Example of calling a function (at a later point in the same template)

... `button("Display details", "PICK")`
... `button(#exit, "/NEX")`
SAP AG 2001
The function definition must come before the first call in the template.
Since HTMLBusiness does not know local variables, the following applies:
All variables of the template can be read and changed in the function.
Variables that are used in the function and are therefore declared implicitly, are available for global
use once the function has been processed.
(C) SAP AG
BC440
89
6.90
Include Example
Template for screen 100
... Ìnclude(~name="button_functions.html")`
... `button("Cancel", "/NEX")`
File button_functions.html:
" value=", text, " >")
end`
SAP AG 2001
(C) SAP AG
BC440
90
6.91
Include Syntax
General syntax of include()

include([~service
[~theme
[~language
~name
=
=
=
=
<service>,]
<theme>, ]
<language>,]
<name>)
If parameters have not been specified, they are filled

with the current values in the service parameters
(~service, ~theme, ~templateLanguage)
SAP AG 2001
In the SAP@Web Studio the include statement can be created simply using Drag&Drop.
(C) SAP AG
BC440
91
6.92
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
92
6.93
MIME Objects for a WebTransaction
Use any MIME objects

Book id:
561966
(images, sounds, videos, ...)
50
MIME objects are stored

on the HTTP server
HTMLBusiness function
mimeURL() creates the
correct URL at runtime
99
Book id:
561966
Dependent on language
and theme
<img src="`mimeUrl(...)`">
SAP AG 2001
MIME objects can be linked to WebTransactions in several ways:

Static URL to access objects in the file system of the HTTP server
Dynamic URL using HTMLBusiness to access objects in the file system of the HTTP server
Send MIME objects from R/3 to the ITS
The second option has the following advantages:
The business logic of a WebTransaction can be developed in R/3 separately from the visual
appearance of the resulting HTML pages.
MIME objects can be included dependent on the selected theme and logon language at runtime.
In combination with language support customer-specific information can be presented on the Web.
The first option ideally should not be used. This topic focuses on the second option. The third option is
described in the topic "Macros".
(C) SAP AG
BC440
93
6.94
Logical File Hierarchy MIME Objects
ITS (WGate)
Global
ITS050DEMO
66
DE
banner.gif
EN
banner.gif
99
DE
EN
banner.gif
Hierarchy in the WGate file

system:
Service
Theme
Language
Name of the image
At each level:
The order is fixed
Individual levels can be

omitted
Images can be stored at

each level
SAP AG 2001
MIME objects can be stored in the file system of the HTTP server at any directory level below a service
node.
Language-dependent MIME objects are assigned to directory nodes whose name corresponds to the
language chosen for converting the templates.
The Web Application Builder does not (yet) support the administration of language-dependent MIME
objects. You can store MIME objects in the file system of the HTTP server and in the R/3 database using
the SAP@Web Studio. The steps involved are as follows:
Check out the service from R/3. This requires that the service has been assigned to an open transport
request.
Create language nodes in the service and assign the MIME objects to the language nodes.
Check in the service or add the MIME objects to R/3.
Publish the MIME objects to the ITS (function in the SAP@Web Studio).
(C) SAP AG
BC440
94
6.95
Structure of the "MIME URL" with ITS Support
Standard mimeURL()Syntax
mimeUrl([~service
[~theme
[~language
~name
=
=
=
=
<service>,]
<theme>, ]
<language>,]
<name>)
If parameters have not been specified, they are

filled with the current values in the service
parameters (~service, ~theme,
~templateLanguage)
URL for the highest level node in the MIME
hierarchy is determined in the service parameter:
~URLmime
SAP AG 1999
In SAP@Web Studio the mimeURL statement can be created simply using drag-and-drop.
(C) SAP AG
BC440
95
6.96
mimeULR() Example: Using Images
<img src="`mimeUrl(~language = "",
~name = "banner.gif")`">
HTML page at runtime:
(~service = BC440DEMO, ~theme = 99)
<img src=".../MIMES/BC440DEMO/99/banner.gif">
SAP AG 2001
(C) SAP AG
BC440
96
6.97
Web
Browser
HTTP
Start service
SAP@Web
Studio
AGate
WGate
Project MIME Objects
ITS
R/3
Publish
abcd.srvc
test.srvc
MIME
<b>ì`</b>
ìtab[i]`
Services Templates
seats
seats
Texts
Project BC440_Demo
SAP AG 1999
MIME objects are copied by "Publish" into the file system of the WGate, (the HTTP server).
(C) SAP AG
BC440
97
6.98
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
98
6.99
Motivation: HTML Select as "F4 Help"
<select
name=`SCARR-CARRID.name`>
`repeat with i from 1
to CARRID.max`
SCARR
<option
value="`CARRID[i].value`"
SAP R/3
>
`CARRNAME[i].value`
Carrier
ènd`
R/3
</select>
SAP AG 1999
Input help can be linked to each input field in the R/3 System. When the user selects the F4 key or the
appropriate icon, a list of possible entries for the input field is displayed.
In HTML, such an input help can be implemented as a <select>. The following slides show how
values for HTML <select> are compiled in R/3 and how they are sent to the ITS.
Sending the permitted values of a field with context macros is an alternative to the HTML Business function
searchhelp().
Advantages of searchhelp():
You can implement complex search helps (collective search helps).
Input help values are only requested if required.
Advantages of context macros
No additional communication required between the ITS and R/3 to display the search help
Full integration of the input help into the HTML page
(C) SAP AG
BC440
99
6.100
Transporting Data By RFC
RFC
HTTP
CGI
PBO
SAP R/3
DIAG
DIAG
HTTP
Web
browser
Carrier
CGI
HTTP
server
ITS
RFC
PAI
R/3
SAP AG 1999
As well as the data transport between the ITS and R/3 by DIAG, data can also be sent to the ITS by
RFC.
Fields, internal tables and MIME objects can be sent to the ITS in the event PBO or PAI.
Context fields of the ITS or MIME objects from R/3 can be read in the event PBO or PAI.
(C) SAP AG
BC440
100
6.101
ITS Context Fields
ITS context
HTTP
Fields in the HTTP request

Fields in the current screen
DIAG
Fields sent by RFC
RFC
System fields
AGate
SAP AG 1999
System fields are all possible service parameters on the one hand, and internal ITS parameters on the
other hand whose values are determined by the ITS at runtime.
The retention period of the ITS context is limited to one HTTP request/response cycle. Once the AGate
has generated the HTTP page to be sent, the ITS context is discarded.
(C) SAP AG
BC440
101
6.102
Macros for Transporting ITS Context Fields
Exporting ITS context fields (from R/3 into the ITS)

field-set <name> <index> <value>.
field-transport.
Importing ITS context fields (from the ITS into R/3)
field-get <name> <index> <itab> <length>.
Definition in include AVWRTCXM
SAP AG 1999
The macros field-set and field-transport (as well as others) are defined in the include
program AVWRTCXM (ALE via Web Runtime Context Macros).
field-set (Creation of a list containing all fields to be transported)
name
- Name of ITS context field (text)
index
- Number of ITS context field, beginning with 1 (numeric)
value
- Value of ITS context field (text)
field-transport (Actual transport of the data to the ITS through RFC)
field-get
name
- Name of ITS context field (text)
index
- Number of ITS context field, beginning with 1 (numeric)
itab
- Name of an internal table into which values are to be entered (text)
length - Name of the ABAP field into which the length of the ITS context field is to be
entered (numeric)
Unlike field-set, field-get is executed immediately.
(C) SAP AG
BC440
102
6.103
Exporting Context Fields to the ITS
CARRID
CARRNAME
CARRID
CARRNAME
1
1
2
2
...
CARRNAME
...
17
Context
ITS
AA
American Airlines
AC
Air Canada
SCARR
...
United Airlines
counter = 1.
LOOP AT itab into wa.
field-set 'CARRID'
counter wa-carrid.
field-set 'CARRNAME'
counter wa-carrname.
ADD 1 TO counter.
ENDLOOP.
field-transport.
SAP AG 1999
Sending mass data by RFC offers an alternative to transferring data using step loops with a scroll logic.
Advantages of step loops:
Formatting of internal data on the screen
Debugging supported
Transaction can be used with the SAP GUI
Advantages of RFC
Higher performance for large volumes of data (less communication steps between the R/3 and the
ITS)
(C) SAP AG
BC440
103
6.104
Usage in HTMLBusiness
CARRID CARRNAME
1 AA
American Airlines
2 AC
Air Canada
3 AF
Air France
...
dim UA
...
United Airlines
Context
ITS
American Airlines
Air Canada
Air France
...
United Airlines
<select name=`SCARR-CARRID.name`>
`repeat with i from 1 to CARRID.max`
<option value="`CARRID[i].value`">
`CARRNAME[i].value`
</option>
ènd`
</select>
SAP AG 1999
After field-transport the fields of the table sent can be processed in HTML Business in the same way
as if they had been transferred in a step loop.
Example above:
`carrid[1].value`
AA
`carrname[1].value` American Airlines
(C) SAP AG
BC440
104
6.105
GUI User or ITS?
CALL FUNCTION 'ITS_PING'

EXCEPTIONS
others
= 2.
IF sy-subrc = 0.
Read data,
field-set,
field-transport
ENDIF.
SAP AG 1999
Formatting data with field-set and sending data with field-transport only makes sense if the
communication partner of the R/3 System is an ITS.
By calling the function module ITS_PING you can determine whether the transaction is controlled by a
GUI or by an ITS.
ITS_PING encapsulates a C function that triggers a callback to the frontend, that is, to the ITS or the
GUI.
(C) SAP AG
BC440
105
6.106
HTML Select Pre-Assigned in R/3
<select name=`SCARR-CARRID.name`>
`repeat with i from 1 to CARRID.max`
<option value="`CARRID[i].value`"
ìf (CARRID[i].value ==
SCARR-CARRID.value)`
selected
ènd`
> `CARRNAME[i].value`
</option>
ènd`
</select>
SAP AG 1999
The above extract from an HTMLBusiness template generates an HTML select where not the first value is
preset, but the value in the relevant R/3 input field.
(C) SAP AG
BC440
106
6.107
Importing Context Fields from the ITS
CREW
1 Jonathan Riker
2 Dianna Troi
crewtab
3 Jean-Luc Picard
...
17 Beverly Crusher
Context
ITS
Jean
-Luc
Pic
ard
crewlength 15
TYPES line(4).
DATA: crewtab TYPE TABLE OF line,
crewlength TYPE i.
field-get 'CREW' 3
crewtab crewlength.
SAP AG 1999
Note that when ITS context fields are imported, the rows of a table of the ITS context must be read out
individually.
The contents of one table row are transferred into one internal table of the R/3 System. If the value of
the ITS context field to be read out exceeds the row length of the internal table, the value of the ITS
context field is split into several rows in the internal table (see example on slide).
The field crewlength specifies the length of the ITS context field in bytes.
(C) SAP AG
BC440
107
6.108
Web Transactions
Programming
Programming Model
Model
Theme
Theme and
and Language
Language
Service
Service and
and Templates
Templates
Output
Output with
with Step
Step Loop
Loop
Web
Web Debugger
Debugger
Business Functions
HTML
HTMLBusiness
Functions
and
Operators
and Operators
Synchronization
Synchronization
MIME
MIME Objects
Objects
Internet
Internet Users
Users
Context
Context Macros
Macros
Connection
Connection to
to the
the
Workbench
Organizer
Workbench Organizer
Frame
Frame Transactions
Transactions
SAP AG 1999
(C) SAP AG
BC440
108
6.109
R/3 Subscreens
SAP R/3
First name
System Help
Telephone
200
SAP R/3
Name
Meyer
address
Telephone 45678
Name
200
SAP R/3
address
System Hilfe
Name
First name Peter
System Help
Meyer
Post box
Post box 11334
Fax
Fax
300
address
67890
300
SAP AG 1999
Subscreens are rectangular areas on a screen reserved for displaying other screens at runtime. Another
screen (of type subscreen) can be displayed on each subscreen area at runtime.
(C) SAP AG
BC440
109
6.110
Calling Subscreens
Controlling the Main Screen

CALL SUBSCREEN address INCLUDING
sy-repid '200'.
...
PROCESS AFTER INPUT.
COPY_OK_CODE.
CALL SUBSCREEN address.
...
MODULE user_command_2000.
SAP AG 1999
At the time the event PBO is processed it is decided which screen is displayed for each subscreen area.
The standard syntax is:
CALL SUBSCREEN <subscreen-area> INCLUDING <prg> <dynpro_no>.
The PAI and PBO processing is executed for each subscreen in the same way as with "normal" screens.
The sequence of "CALL SUBSCREEN" calls in the flow logic of the main screen determines the
sequence in which the flow logic of individual subscreens is processed.
Note:
The function code can only be processed via the main screen
Subscreens do not have a command field of their own.
Subscreens must not set a GUI status.
(C) SAP AG
BC440
110
6.111
Frames Subscreens
<html> <head> ... </head>
SAP R/3
System Help
<frame name="F1"
src="...">
F1 F2
<frame name="F2"
src="...">
</frameset>
</html>
F1 F2
SAP AG 1999
R/3 subscreens are mapped to HTML pages via an HTML <frameset>:

A <frameset> in an HTMLBusiness template corresponds to the main screen.
An HTMLBusiness template corresponds to each subscreen.
The naming convention for the HTMLBusiness templates is(<prg>_<dynpro_no>.html.)
(C) SAP AG
BC440
111
6.112
Using wgateURL() in Framesets
<frame name = "F1"
src="`wgateURL(~FrameName="F1")`">
<frame name = "F1"
src=".../wgate/XY/~flQ...Mwg==?~FrameName=F1">
SAP AG 1999
wgateURL() must be used if you want the AGate to automatically generate the URL for the individual
frames.
(C) SAP AG
BC440
112
6.113
Interaction Between Frames and Subscreens
SAP R/3
System Help
F1
F1 F2
100
200
F2
SAP R/3
System Help
F1
F1 F2
F2
300
CALL SUBSCREEN ...
target="..."
100
SAP AG 1999
On the HTML side, the target parameter (parameter of the <a> tag) determines which frame contents
are replaced with the target of a hyperlink.
In the flow logic of the subscreen container of an R/3 transaction, the CALL SUBSCREEN...
command determines which subscreen is inserted in which subscreen area.
(C) SAP AG
BC440
113
6.114
Using wgateURL() for target
<a href="`wgateURL(~target="F2",
~okCode="DISPLAY")`">
`#display`</a>
<a href="/scripts/wgate/XY/~flNXlPTQ...MwMg==?
~target=F2&~okCode=DISPLAY"
target="F2">
Display </a>
SAP AG 1999
The parameter ~target in the function wgate() enables the target parameter to be automatically
generated in hyperlinks and forms.
The AGate generates two additions in the hyperlink:
The addition ~target=F2 is attached to the URL. As a result, the AGate converts only the
subscreen in subscreen area F2. The Web server sends only the corresponding HTML page
for this subscreen as the HTTP response.
The addition target="F2" is attached to the hyperlink. As a result, the browser replaces the
contents of frame F2 with the HTML page generated by the AGate.
(C) SAP AG
BC440
114
6.115
Calling the Subscreens Dynamically
Flow Control in the Main Screen

CALL SUBSCREEN f1 INCLUDING
sy-cprog dynpro_f1.
CALL SUBSCREEN f2 INCLUDING
sy-cprog dynpro_f2.
...
COPY_OK_CODE.
CALL SUBSCREEN f1.
CALL SUBSCREEN f2.
...
SAP AG 1999
If different subscreens are to be displayed dynamically at runtime on one subscreen area, a field must be
entered in the flow logic of the main screen for each subscreen area.
The value of this field determines which subscreen is to be displayed
(C) SAP AG
BC440
115
6.116
Synchronization Table
DATA sync_itab TYPE TABLE OF sitssync.
subsc
progid
dynnr
MAIN
sapmits100
2000
F1
sapmits100
100
F2
sapmits100
300
SAP AG 1999
Synchronizing a frame transaction requires that all subscreen areas and the frame contents displayed in
the browser are synchronized. For frame transactions, the AGate therefore returns a synchronization
table which contains one entry for the main screen and each subscreen area.
(C) SAP AG
BC440
116
6.117
Synchronization with Frames - ABAP Coding (1)
DATA sync_itab TYPE TABLE OF sitssync,

...
CASE save_ok_code(4).
WHEN 'AWSY' OR 'AWSS'.
TABLES
sync_info
= sync_itab
EXCEPTIONS
others
= 2.
See next slide
ENDCASE.
SAP AG 1999
To synchronize an EasyWebTransaction, the ITS sends a function code beginning with AWSY or AWSS.
The other characters are not relevant.
The function code AWSY is sent if the subscreen container needs to be synchronized.
The function code AWSS is sent if one or more subscreens need to be synchronized.
In the ABAP program the function module ITS_GET_SYNC_INFO must then be called. When the
function module ITS_GET_SYNC_INFO is called, the internal table is filled by an RFC from R/3 to the
ITS.
(C) SAP AG
BC440
117
6.118
Synchronization with Frames - ABAP Coding (2)
LOOP AT sync_itab INTO sync_wa.

CASE sync_wa-subsc.
WHEN 'MAIN'.
... " internal rollback
SET SCREEN sync_wa-dynnr.
WHEN 'F1'.
dynpro_f1 = sync_wa-dynnr.
WHEN 'F2'.
dynpro_f2 = sync_wa-dynnr.
ENDCASE.
ENDLOOP.
LEAVE SCREEN.
SAP AG 1999
(C) SAP AG
BC440
118
6.119
Web Transaction: Unit Summary

Describe the programming model
"WebTransaction"
Create and edit service files and HTML templates
Define methods of transferring data from HTML
forms to R/3 Systems
Implement synchronization in Web transactions
Use MIME objects
Transfer the components of Web transactions to
the R/3 Workbench Organizer
SAP AG 1999
(C) SAP AG
BC440
119
6.120Web Transaction: Exercises

Unit: WebTransactions
Topic: Designing a WebTransaction
Design a WebTransaction.
Specify the task flow of an online flight booking. Search for appropriate
BAPIs in R/3 and assign these to the task flow steps.
1-1
Paper and pencil:

1-1-1 Sketch the task flow for an online flight booking transaction.
Note: Think about the steps you are taken through in a normal travel agency.
1-2
R/3:
1-2-1 Go into the Business Object Repository and search for the BAPIs that provide the
objects SFLIGHT, SCUSTOMER, SBOOK and SAGENCY.
1-3
Paper and pencil:

1-3-1 Assign BAPI calls to the individual steps in your task flow. If necessary, modify
your task flow.
(C) SAP AG
BC440
120
Exercises
Topic: Creating Dialog Transactions in R/3
Preparations for the next exercises
Create a new development class. Copy a part finished R/3 transaction.

Create a new transaction code. Test your transaction.
2-1
R/3:
2-1-1 Create a new development class ZBC440_##. A task in a development request has
been set up for you.
From now on, you are going to work only with this development class, which will
be referred to as your development class.
2-1-2 Copy the program SAPBC440_WT_T_A with all its sub-objects (such as screens,
interface, includes) from the development class BC440 into your own
development class. Name your copy SAPMZBC440_WT_##A. From now on you
are going to work only with this copy, which will be referred to as your program.
(C) SAP AG
Screen
Function
100
Data input for departure city, destination and restrictions to one

carrier and afternoons only.
200
Displays list of suitable flights with a table control.
210
Displays same list with a step loop.
300
Displays details of one flight.
400
Requests customer number and booking (later asks for the

password of the customer number).
BC440
121
2-1-3 Navigate to the TOP include of your program. You have to change the data so that
bookings made with your transaction are also assigned to your travel agency.
Replace the number 100 in the marked row with your group number 1##.
2-1-4 Create the transaction code ZBC440_##A for screen 100 of your program.
From now on, this transaction will be referred to as your transaction".
2-1-5 Activate the sub-objects in your program.
2-1-6 Test your transaction. Book a flight with your customer number 4## (## = group
number) and the password that you assigned yourself in the exercise on user
maintenance.
(C) SAP AG
BC440
122
Exercises
Topic: Service Wizard
Use the Service Wizard
Create a new service with the service wizard. Use Publish to copy your
service onto the AGate.
3-1
Web Studio:
3-1-1 Using the Service Wizard create a new service ZBC440_##A for your transaction
in the R/3 System. View the contents of the service file.
From now on you are going to work only with this service, which will be referred
to as your service.
Path: File New File Wizards Service Wizard
3-2
Web Browser:
3-2-1 Open your service. The result is an error message from ITS saying that the service
does not exist.
Why does this happen?
3-3
Web Studio:
3-3-1 Use the entry "Publish" from the context menu in the hierarchy view of your
project to copy the service file to the AGate.
3-4
Web Browser:
3-4-1 Restart your service (select Refresh). The result is a new error message from the
ITS. Take a look at the error message to find out what went wrong this time.
(In the next exercise you will solve the problem).
(C) SAP AG
BC440
123
Exercises
Topic: Template Wizard
Use the Template Wizard
Using the TemplateWizard create a new Template for the screens in your
R/3 transaction. Improve the templates. Add a hyperlink to your travel
agency home page to open the service.
4-1
Web Studio:
4-1-1 Use the Template Wizard to create new HTMLBusiness templates for all the screens in
your program. Choose language-independent and theme 99. File New
File Wizards Template Wizard
4-1-2 Change your service to "Active Service" (context menu or Project Set
Active Service ZBC440_##A). Select Go to start your service.
4-2
Web Browser:
4-2-1 Book a flight. Use your customer number 1.81kg#.
4-3
Web Studio:
4-3-1 View the templates that the wizard has generated. Template 100 contains all the
possible input elements, template 300 is a typical output template.
The details of the table control and the step loop are provided later in this unit.
4-3-2 Create a new HTML button in all of the HTMLBusiness templates to send the function
code /NEX to R/3. This button ends your service.
The service parameter ~ exitURL determines which HTML page is displayed
after your service has ended. Add this parameter to your service file and set the
value to the URL of your frames.html from unit "HTML". This enables Internet
customers to return to the homepage of your travel agency after your service has
ended.
4-3-3 Select "Go" to start the service.
(C) SAP AG
BC440
124
4-4
Web Browser:
4-4-1 Cancel the current service by clicking on the new button to test if you can get to the
home page of your travel agency.
4-5
Notepad:
4-5-1 Open the HTML page, home.html from the Unit "HTML" and create a hyperlink
to start your service. Use target=_top.
4-6
Web Browser:
4-6-1 Load your frames.html from the Unit "HTML" and select the new hyperlink in
home.html to start your service.
(C) SAP AG
BC440
125
Exercises
Topic: Changing Input Elements
Change HTMLBusiness templates
Open the template for screen 100. Use hidden input fields and HTML
selects for entering data on departure and destination countries.
5-1
Web Studio:
5-1-1 Open the template 100 and search for the HTML commands that define the input
fields for the departure and destination countries. Change them so that the fields in
the Web browser are no longer displayed but that the "Departure country =
Germany" and "Destination country = USA" are still transferred to screen 100 in
your R/3 transaction.
5-1-2 Replace the input fields for departure city and destination city with HTML
selection lists (SELECT). Enter some names of cities in Germany or in the USA.
You can find valid cities in the R/3 table SGEOCITY.
How the lists of the cities are created online, suitable for the R/3 transaction, is
dealt with later in this unit.
(C) SAP AG
BC440
126
Exercises
Topic: Web Debugger and Synchronization
Use the Web debugger.
Implement synchronization in Web transactions.
Use the Web debugger to go through your Web transaction to find out
why the synchronization is not working. Implement the synchronization
in your R/3 transaction.
6-1
SAPlogon:
6-1-1 Create a new server entry "AGate Debugging" with the AGate as the
application server. Your instructor will tell you the instance numbers.
6-2
Web Studio/Web Browser/SAPlogon:

6-2-1 Select "Go" to start your service.
6-2-2 Start the Web debugger using the entry just created. Display the list in the table
control (200) in the browser. Select a flight and display its details. Select the Back
button and select a different flight from the list. Details of the first flight selected
are displayed again.
The debugger indicates the reason for this error: R/3 displays screen 300, even
though the ITS requires screen 200.
6-3
R/3:
6-3-1 Go to the PAI module user_command_300 of your program to implement the
necessary synchronization. The branch OTHERS already contains the call to the
subroutine special_ok_code. This subroutine is called from the modules
user_command_100, user_command_200, user_command_210 and
user_command_400, that is all the screens that are to be synchronized.
6-3-2 Go to the subroutine special_ok_code and complete the IF statement for the
function code AWSY.
Use the function module ITS_GET_SYNC_INFO, so that the ITS fills an internal
(C) SAP AG
BC440
127
table containing all the required synchronization details.

You have to define this table (row structure ) yourselves: .
Then read the rows from the internal table that is valid for the subsc = 'MAIN'.
Then you can display the screen required by the ITS with the command LEAVE
TO SCREEN....
6-4

6-4-1 No changes are needed. Start your service and start the Web debugger. Display
flight details again. Select Back and choose a different flight. The debugger
indicates that synchronization has worked this time. The correct information should
now be displayed.
(C) SAP AG
BC440
128
Exercises
Topic: Internet Users
Use Internet users in Web transactions
Enhance the Web transaction to query the password of a customer

number.
7-1
R/3:
7-1-1 Using the Screen Painter modify screen 400 of your program. The input field for
the customer number (customernumber) is on this screen.
Create a new input field for the password of an Internet user (input field
password, field label bapiuid-password). The field password is already
defined in theTOP include. Use the function Fetch from Dictionary/program.
Activate the attribute upper/lower case so that the data in this field is not
automatically converted into upper case.
Change the text for the button on the screen from Book to Logon and book.
In the flow logic insert the field password into the chain containing the
customernumber. This is necessary so that if the customer number or password
was entered incorrectly, the fields will be ready for input again
7-1-2 Go to the subroutine logon_and_book via the module
user_command_400. Modify this subroutine so that the customer number and
the password are checked when the BAPI of the business object SCUSTOMER is
called. If the check shows that the data entered is invalid, create an error message
(type E) that the BAPI returns in the export parameter return-type
7-2
Web Studio:
7-2-1 Insert an input field for the password in template 400. Think about what type of
input field would be best.
(C) SAP AG
BC440
129
7-2-3 Book a flight with your customer number (1.81kg#) and the password that you
assigned in the Unit "Internet Transaction Server". If you cannot remember it,
assign a new one (see exercise 2 in Unit "ITS").
(C) SAP AG
BC440
130
Exercises
Topic: Connection to the Workbench Organizer
Create service files and templates using the R/3 Workbench Organizer.
Send your service file and templates to R/3 and assign them to a WBO
task in R/3. Release your task in the request.
8-1
Web Studio:
8-1-1 Select Add to source control to send your service together with all the files to the
R/3 System.
8-2
R/3:
8-2-1 Assign the objects of your service to the change request created by your instructor.
8-2-2 Use the Workbench Organizer to release your task. Then the instructor will release
the joint development task. The originals of your service file and templates are in
the same system where your original program is.
(C) SAP AG
BC440
131
Exercises
Topic: Theme and Language
Define various themes for a Web transaction
Create a new theme in your service. Use placeholders for all the texts that
could not be transferred by R/3 screens.
9-0
Note:
As you transferred your service objects to the R/3 source control at the end of the previous
exercise, you have to assign them to a new change request in R/3, before you can make
changes with the Web Studio.
This procedure is explained here: Go into R/3, if you get the message "...not on an open
correction..." in the Web Studio.
9-1
Web Studio:
9-1-1 Using the Resource Wizard, create a text file in the language DE and for the theme
99.
9-1-2 Think of a suitable text to use for the button in template 100 that sends the
function code /NEX. As there is no pushbutton for this button on screen 100, the
ITS cannot transfer any text from R/3 for it at runtime.
When you enter the name of the placeholder `#...ìn the template, you are asked if
the placeholder is to be transferred into the text file just created. Answer Yes to this
question.
9-1-3 Open the text file and enter the text for the placeholder.
9-1-4 Modify all the templates as the button to end the service is used in each template.
As soon as you enter `#, the placeholder is offered to you in a selection list box.
9-1-5 Select "Go" to start the service. The text you have just created should be displayed.
(C) SAP AG
BC440
132
9-1-6 Create a text file in the language EN and for the theme 99. The placeholder from
the file created earlier in the language DE is copied over and you just have to
translate it.
9-1-7 You can not simply start your service in the language EN by attaching the
parameter, ~language=EN, to the URL. Beforehand you have to include
~language without a value in your service file to overwrite the default logon
language specified in Global.srvc.
9-1-8 Select "Go" to start the service. The ITS automatically generates an HTML form
which prompts you to select a logon language. To avoid this prompt, you can now,
for example, specify the logon language by including ~language=EN in the URL
to start the service.
9-1-9 Create the theme 66.
9-1-10 Copy all the files from theme 99 to the theme 66 and change the copied templates
to get a different screen display. For example, change the background color or the
headings.
9-1-11 Open your service with theme 66 by adding ?~language=DE&~theme=66 to
the URL that starts the service. Experiment with the URL.
9-2
Notepad:
9-2-1 Open the HTML page, home.html, from the Unit "HTML" and add more
hyperlinks so that Internet customers can open your service in different languages
and themes with one mouse click.
9-3
Web Browser:
9-3-1 Load your frames.html and start your service by clicking on the new hyperlink in
-home.html
(C) SAP AG
BC440
133
Exercises
Topic: Step Loop and Hyperlinks
Use step loops to display internal tables
Use hyperlinks to select a row
Display the table of suitable flights with a step loop instead of with a
table control. Enable users to select table rows by hyperlink.
10-1
Web Studio:
10-1-1 In R/3 the function code TC displays the flight list by table control on screen 200.
SL on the other hand, displays the list by step loop on screen 210.
Change the template 100. Copy the button that sends the function code TC.
Change the copy so that this button sends the function code SL.
10-1-2 Change the HTMLBusiness template for screen 210. Create a new column in the table
in which you display the loop counter (`j`). Select "Go" to start your service.
10-1-3 Use the HTML command <a>, and the HTMLBusiness function wgateURL() to
turn the loop counter into a hyperlink. Click on the loop counter to put the loop
counter value into the R/3 input field line_itab and also to send the function
code PICK to R/3. Select "Go" to start the service.
(C) SAP AG
BC440
134
Exercises
Topic: Scrolling in Step Loop
Use the ITS automatic scrolling of a step loop.
In your R/3 transaction, implement the scroll logic for the step loop so
that the ITS scrolls the step loop fully and sends a "long" page to the Web
browser.
11-0
Note:
As you have released your change request in an earlier exercise, you have to assign the
sub-objects of your R/3 program to a new change request, before you can save the
changes.
This procedure is explained here: Select the new change request when the system asks you
to.
11-1
R/3:
11-1-1 The individual lines in the step loop on screen 210 are filled in the module
itab_to_steploop. In this module a row is read from the body of the internal
table itab into the structure wa. The field line_itab = line_first +
sy-stepl - 1 determines the number of the first row to be displayed. In this
exercise you are going to implement a scrolling logic to modify the field
line_first.
11-1-2 First, change the status 210 of your program using the Menu Painter. Assign the
function FIRST_PAGE to the key combination Shift-F9 and the function
PAGE_DOWN to the key combination Shift-F11. Generate the status.
11-1-3 Modify the module user_command_0210. Include a WHEN branch to the newly
defined functions FIRST_PAGE and PAGE_DOWN in the CASE structure. Assign
an appropriate value in the field line_first. Activate the include.
(C) SAP AG
BC440
135
11-1-4 Start the transaction and enter the function code SL to go directly to screen 210.
You should be able to page down using the key combination Shift-F11 in the
step loop. Shift-F9 should display the first page again.
11-2
Web Studio:
11-2-1 No changes are needed. Select Go to start your service. More than ten flights
should now be displayed in the list..
(C) SAP AG
BC440
136
Exercises
Topic: Calculating with HTMLBusiness
Use HTMLBusiness for simple calculations and branching
Calculate the number of free seats on each flight and display this number
in color.
12-1
Web Studio:
12-1-1 Change the HTMLBusiness template for screen 210 (step loop) so that the number of
available seats can be displayed in a new column in the flight list. Use HTMLBusiness
to calculate this number.
12-1-2 The number of available seats should be displayed in different colors. Red - up to
10 free seats Orange - more than 10 free seats . Change the background color in the
table cell with <td bgcolor=...>.
12-1-3 Select Go to start your service.
12-2-4 Create a placeholder for the new column heading in the template and modify your
HTRC files accordingly.
(C) SAP AG
BC440
137
Exercises
Topic: Functions and Includes
Implement your own functions in HTMLBusiness
Use includes
Encapsulate the calculations of the free seats in one function. Create this
function in an include so that it can be used in both templates that display
the flight list.
13-1
Web Studio:
13-1-1 Open the template 210 again. At the beginning of the template define a function
"write_free_seats" with two input parameters seats_max and
seats_occ.
Copy the calculation and the IF statement from the last task in this function.
Change the names of the parameters. Use the function write() for the output.
Replace the calculation and the IF statement in the HTML table with the function
call just created.
13-1-3 To be able to also use the function in the template 200, create a new file in your
service in the theme 99. Name the file functions.html.
13-1-4 Copy the function from the template 210 into the new file.
13-1-5 Delete the function in the template 210 and instead use the include command for
functions.html. Move the file functions.html from your project
hierarchy into the template 210 and delete the file at the beginning of the template.
13-1-7 Open template 200 (table control). Also use the include command for
functions.html (by drag & drop) in this template and the function call
write_free_seats.
Create a new heading for the new column.
(C) SAP AG
BC440
138
(C) SAP AG
BC440
139
Exercises
Topic: MIME Objects
Use MIME objects in Web transactions
Add language and theme-dependent background images to your

templates. Display the image of the airplane used next to the flight
details.
14-1
Web Browser:
14-1-1 Enter the following URL:
http://<Web-Server:Port>/sap/mimes.
Click through the subdirectories and display some MIME objects. Look especially
in the directories of the service BC440_Global.
14-2
Web Studio:
14-2-1 Import the service BC440_Global into your project. You should find the same
images that you saw earlier in the Web browser.
14-2-2 Now open the template 100. Search for the tag <body>. Change this tag to
<body background="">. Move the image online.gif from the service
BC440_Global into the template. Put it exactly between the " " in <body
background="">.
14-2-4 The command mimeURL()generated by Web Studio does function but is static in
the sense that language and theme are almost predefined. Change the parameter in
mimeURL, so that the image URL is dependent on the theme and language.
14-2-5 Select Go to start your service. Attach ?~language=EN or ?~theme=66 to the
URL at the start of your service to test whether another background image is
actually displayed for a different language or theme.
(C) SAP AG
BC440
140
14-2-6 Copy the changes from template 100 into the remaining templates (200, 210,
300 and 400).
14-2-7 Change the template 300, so that a picture of the airplane used is displayed next to
the flight details.
Use the HTML command <img src=""> and move one of the airplane images
from the service BC440_Global to between the "" in <img src="">. This is
how an image is selected statically.
Think about how you could assign online the correct file name of the current
airplane to the parameter ~name in mimeURL(). Tip: You can insert character
strings in HTMLBusiness with &.
(C) SAP AG
BC440
141
Exercises
Topic: Context Macros
Use context macros to send data by RFC to the ITS.
Determine all the German and American cities known to R/3 and send
them to the ITS. Then use this data to dynamically create selects for the
city selection.
15-1
R/3:
15-1-1 Insert the instruction include avwrtcxm into the include
zbc440_wt_##atop. You can then use the context macros field-set and
field-transport.
15-1-2 Go to the PBO module preset_cities of screen 100 and further to the
subroutine send_cities_to_its.
Insert additional coding that sends the list of available German/US cities to the ITS.
First read with the command SELECT to read one German city after another from
the table sgeocity in the field string wa_city. Use the macro field-set
between SELECT and ENDSELECT.
Then read out all the US cities from the table sgeocity using another SELECT
command. Use the macro field-set between SELECT and ENDSELECT.
Use the macro field-transport after the second ENDSELECT to send both
city lists by RFC to the ITS.
15-2
Web Studio:
15-2-1 Change the HTMLBusiness template for screen 100. Use a repeat loop in
HTMLBusiness to dynamically generate the <option ...> entries in the HTML
Select commands for departure and destination cities.
(C) SAP AG
BC440
142
15-2-3 Make sure that in both HTML-SELECTs the cities that appear as the suggested
value are the same as those suggested in the input fields of your R/3 transaction.
To do this use the parameter selected within the <option> command in the
HTML-Select.
15-3
R/3:
15-3-1 Enhance the subroutine send_cities_to_its. Only read the cities from the
database, if your transaction is used by an ITS. Use the function module
ITS_PING for this.
(C) SAP AG
BC440
143
Exercises
Topic: HTML Frames and
R/3 Subscreens
Create a Web transaction that uses HTML frames
Copy an R/3 program that uses subscreens. Create a new service file and
copy all the templates from your old service. Use the Template Wizard to
generate a template for the screen container. Change the names of all your
frame templates.
16-1
R/3:
16-1-1 Copy the program SAPBC440WT_T_B with all its sub-objects (such as screens,
interface, includes) from the development class BC440 into your own
development class. Name your copy SAPMZBC440WT_##B. From now on you are
going to work only with this copy, which will be referred to as your second
program. The program you have been working with up to now will be referred to
as your first program.
16-1-2 Navigate to the TOP include of your second program. You have to change the data
so that bookings made with your transaction are also assigned to your travel
agency.
Replace the number 100 in the marked row with your group number 1##.
16-1-3 Create the transaction code ZBC440_##B for screen 2000 of your second
program.
From now on, this transaction will be referred to as your second transaction". The
transaction you have been working with up to now will be referred to as your first
transaction.
16-1-4 Activate the sub-objects in your program.
16-1-5 Test your second transaction. Book a flight (customer number 4##).
16-2
Web Studio:
16-2-1 Using the Service Wizard create a new service ZBC440_##B for your transaction
in the R/3 System. View the contents of the service file.
(C) SAP AG
BC440
144
Path: File New File Wizards Service Wizard

From now you will work only with this service that is called "your second service.
The transaction you have been working with up to now will be referred to as your
first transaction.
16-2-2 Use the Template Wizard to create new HTMLBusiness templates for screens 10, 20
and 2000 in your second program. Choose language-independent and theme
99. File New File Wizards Service Wizard
16-2-3 Copy all the files from your first service to your second service. Change the names
of the files to suit the second service.
16-2-4 Change your second service to "Active Service" (context menu or Project Set
Active Service ZBC440_##A). Select "Go" to start your service. As you are
testing you will ascertain that your transaction has not yet been modified for
frames.
16-2-5 Make the modifications by inserting ~target=... into the function
wgateURL()in the HTML forms or hyperlinks. Choose suitable names for the
frames.
16-2-6 Start your service with Go and book a flight. Also test error cases and cancel
buttons in the various frames.
16-2-7 Delete the old cancel buttons from the various templates and create a new cancel
button for screen 20. Now your second transaction is complete.
16-2-8 If you want, you can make more improvements to the screen. Increase the size of
the ~messageLine in the template for screen 10, so that the message cannot be
missed. Delete the texts "Dummy" and "Banner" from the templates for screens 10
and 20 and use mimeURL() to display background images.
Select Go to start your service.
(C) SAP AG
BC440
145
Exercises
Topic: Synchronization with Frames
Implement synchronization in Web transactions with frames
Use the Web debugger to go through your Web transaction to find out
why the synchronization is not working. Implement the synchronization
in your R/3 transaction.
17-1
Web Studio:
17-1-1 Select "Go" to start your service.
17-1-2 Start the Web debugger using the entry in SAPlogon. Display the list in the
browser. Select a flight and display its details. Select the Back button and select a
different flight from the list. The ITS incorrectly sends the complete frameset again.
This is because your second transaction has not yet been synchronized
17-2
R/3:
17-2-1 Go to the PAI module user_command_2000 of your program to implement the
necessary synchronization. The branch OTHERS already contains the call to the
subroutine special_ok_code.
17-2-2 Go to the subroutine special_ok_code and complete the IF statement for the
function codes AWSY and AWSS.
Use the function module ITS_GET_SYNC_INFO, so that the ITS fills an internal
table containing all the required synchronization details.
You have to define this table (row structure ) yourselves: .
Evaluate the rows of the table and enter the values required by the ITS into the
fields, dynpro_right1 and dynpro_right2.
Activate the include.
17-3

17-3-1 No changes are needed. Start your service and start the Web debugger. Display
flight details again. Select Back and choose a different flight. The debugger
(C) SAP AG
BC440
146
indicates that synchronization has worked this time. The correct information should
now be displayed.
(C) SAP AG
BC440
147
6.121WebTransaction Solutions
Unit: Web Transaction
Overview of All Solutions in This Unit
All programs belong to development class BC440.
All services can be transferred by AGate.

Project Add To Project Import Import Service From Site
Exercise
Service
Program
Transaction
1 Design
2 Copy transaction
in R/3
SAPBC440_WT_S_A_COPY
BC440S_A_COPY
3 Service wizard
bc440s_wiz_s
4 Template wizard
bc440s_wiz_t
5 Select and hidden
bc440s_input
6 Debugger and
Synchronization
bc440s_sync
SAPBC440_WT_S_A_SYNC
BC440S_A_SYNCH
7 Internet user
bc440s_user
SAPBC440_WT_S_A_USER
BC440S_A_USER
8 WBO
9 Theme and
language
bc440s_theme
SAPBC440_WT_S_A_PAGING
BC440S_A_PAGING
10 Step loop
bc440s_sl
11 Scrolling
bc440s_sl_pag
12 Calulations
bc440s_calc
13 Functions and
include
bc440s_func
14 MIMEs
bc440s_mime
15 Field set
bc440s_macro
SAPBC440_WT_S_A_MACRO
BC440S_A_MACRO
16 Frames
bc440s_frame
SAPBC440_WT_S_B_FRAME
BC440S_B_FRAME
17 Frames with
synchronization
bc440s_frame_s
SAPBC440_WT_S_B_FRAME_SYNC
BC440S_B_FRAME_SYNC
(C) SAP AG
BC440
148
Solutions
Topic: Designing a Web Transaction
Design a Web Transaction
Determine the task flow of an online flight booking. Search for

appropriate BAPIs in R/3 and assign them to the steps in the task flow.
You will find the solution to this exercise on the last page of this unit.
(C) SAP AG
BC440
149
Solutions
Topic: Creating Dialog Transactions in R/3
Preparations for the next exercises
Create a development class. Copy a partly completed R/3 transaction.

Create a transaction code. Test the transaction.
Main program (SAPBC440_WT_S_A_COPY):

*&---------------------------------------------------------------------*
*& Modulpool
SAPBC440_WT_S_A_COPY
*&
*
*
*&---------------------------------------------------------------------*
INCLUDE bc440_wt_s_a_copytop.
INCLUDE bc440_wt_s_a_copyo01.
INCLUDE bc440_wt_s_a_copyi01.
INCLUDE bc440_wt_s_a_copyf01.
Global data (BC440_WT_S_A_COPYTOP):

*&---------------------------------------------------------------------*
*& Include BC440_WT_S_A_COPYTOP
*&---------------------------------------------------------------------*
PROGRAM sapbc440_wt_s_a_copy.
DATA agencynum LIKE bapisbdtin-agencynum VALUE '100'.
** Screen fields
(C) SAP AG
BC440
150
DATA:
ok_code LIKE sy-ucomm,

save_ok LIKE ok_code.
TABLES sdyn_conn.
CONSTANTS checked VALUE 'X'.
DATA
cities_initial VALUE checked.
DATA list_screen LIKE sy-dynnr.

* 100 - Input
DATA: rb_aa,
rb_lh,
rb_any VALUE checked.
* 200 - List via Table Control
CONTROLS: my_tc TYPE TABLEVIEW USING SCREEN 0200.
* 210 - List via Step Loop with automatic paging by ITS
DATA: line_first
line_itab
LIKE sy-stepl,
LIKE line_first.
* 300 - Details
* 400 - Logon and Book
DATA: customernumber LIKE
password
LIKE
bapiscdeta-id,
bapiuid-password.
"#EC NEEDED
** Internal tables and matching work area

DATA:
itab TYPE TABLE OF bapisflist,

wa
TYPE bapisflist,
my_flightdata TYPE bapisfdeta.
(C) SAP AG
BC440
151
PBO-Module (BC440_WT_S_A_COPYO01):
*----------------------------------------------------------------------*
*& Include BC440_WT_S_A_COPYO01
*----------------------------------------------------------------------*
*&---------------------------------------------------------------------*
*&
Module
STATUS_0100
OUTPUT
*&---------------------------------------------------------------------*
*
Set status and titlebar for screen 100
*----------------------------------------------------------------------*
MODULE status_0100 OUTPUT.
SET PF-STATUS '0100_MAIN'.
SET TITLEBAR
'0100'.
ENDMODULE.
" STATUS_0100
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
STATUS_0210
OUTPUT
*&---------------------------------------------------------------------*
*
*----------------------------------------------------------------------*
SET TITLEBAR
'0210'.
ENDMODULE.
" STATUS_0210
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
ITAB_TO_STEPLOOP
OUTPUT
*&---------------------------------------------------------------------*
*
Fill one step-loop line from internal table
*----------------------------------------------------------------------*
MODULE itab_to_steploop OUTPUT.
line_itab = line_first + sy-stepl - 1.
(C) SAP AG
BC440
152
READ TABLE itab INDEX line_itab INTO wa.

IF sy-subrc <> 0.
EXIT FROM STEP-LOOP.
ELSE.
MOVE-CORRESPONDING wa TO sdyn_conn.
ENDIF.
ENDMODULE.
" ITAB_TO_STEPLOOP
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
STATUS_0200
OUTPUT
*&---------------------------------------------------------------------*
*
text
*----------------------------------------------------------------------*
SET TITLEBAR '0200'.
ENDMODULE.
" STATUS_0200
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
ITAB_TO_TABLECONTROL
OUTPUT
*&---------------------------------------------------------------------*
*
Fill one TableControl line from internal table
*----------------------------------------------------------------------*
MODULE itab_to_tablecontrol OUTPUT.
ENDMODULE.
" ITAB_TO_TABLECONTROL
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
STATUS_0300
OUTPUT
*&---------------------------------------------------------------------*
*
*----------------------------------------------------------------------*
(C) SAP AG
BC440
153

ENDMODULE.
" STATUS_0300
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
PRESET_CITIES
OUTPUT
*&---------------------------------------------------------------------*
*
Set default values for cities
Set list of cities to ITS
*----------------------------------------------------------------------*
MODULE preset_cities OUTPUT.
IF cities_initial = checked.
CLEAR cities_initial.
sdyn_conn-countryfr = 'DE'.
"#EC NOTEXT
sdyn_conn-cityfrom
"#EC NOTEXT
= 'WALLDORF'.
sdyn_conn-countryto = 'US'.
"#EC NOTEXT
sdyn_conn-cityto
"#EC NOTEXT
= 'NEW YORK'.
ENDIF.
PERFORM send_cities_to_its.
ENDMODULE.
" PRESET_CITIES
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
RESET_LINE_ITAB
OUTPUT
*&---------------------------------------------------------------------*
*
Initialize line selector
*----------------------------------------------------------------------*
MODULE reset_line_itab OUTPUT.
CLEAR line_itab.
ENDMODULE.
" RESET_LINE_ITAB
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
STATUS_0400
OUTPUT
*&---------------------------------------------------------------------*
*
*----------------------------------------------------------------------*
(C) SAP AG
BC440
154

ENDMODULE.
" STATUS_0400
OUTPUT
*&---------------------------------------------------------------------*
*&
Module
CLEAR_PASSWORD
OUTPUT
*&---------------------------------------------------------------------*
*
Initialize password
*----------------------------------------------------------------------*
MODULE clear_password OUTPUT.
CLEAR password.
ENDMODULE.
" CLEAR_PASSWORD
OUTPUT
PAI-Module (BC440_WT_S_A_COPYI01):
*----------------------------------------------------------------------*
*& Include BC440_WT_S_A_COPYI01
*----------------------------------------------------------------------*
*&---------------------------------------------------------------------*
*&
Module
EXIT_COMMAND
INPUT
*&---------------------------------------------------------------------*
*
Process "exit" ok codes for all screens
*----------------------------------------------------------------------*
MODULE exit_command INPUT.
CASE sy-dynnr.
WHEN '0100'.
LEAVE TO SCREEN 0.
WHEN '0200'.
CASE ok_code.
WHEN 'EXIT'.
LEAVE PROGRAM.
(C) SAP AG
BC440
155
WHEN 'CANCEL'.
LEAVE TO SCREEN 100.
WHEN 'STEP_BACK'.
ENDCASE.
WHEN '0210'.
CASE ok_code.
WHEN 'EXIT'.
LEAVE PROGRAM.
WHEN 'CANCEL'.
WHEN 'STEP_BACK'.
ENDCASE.
WHEN '0300'.
CASE ok_code.
WHEN 'EXIT'.
LEAVE PROGRAM.
WHEN 'CANCEL'.
WHEN 'STEP_BACK'.
LEAVE TO SCREEN list_screen.
ENDCASE.
WHEN '0400'.
(C) SAP AG
BC440
156
CASE ok_code.
WHEN 'EXIT'.
LEAVE PROGRAM.
WHEN 'CANCEL'.
WHEN 'STEP_BACK'.
ENDCASE.
ENDCASE.
ENDMODULE.
" EXIT_COMMAND
INPUT
*&---------------------------------------------------------------------*
*&
Module
COPY_OK_CODE
INPUT
*&---------------------------------------------------------------------*
* Copy ok code to internal data field
*----------------------------------------------------------------------*
MODULE copy_ok_code INPUT.
save_ok = ok_code.
CLEAR ok_code.
ENDMODULE.
" COPY_OK_CODE
INPUT
*&---------------------------------------------------------------------*
*&
Module
USER_COMMAND_0100
INPUT
*&---------------------------------------------------------------------*
*
Process ok codes for screen 100
*----------------------------------------------------------------------*
MODULE user_command_0100 INPUT.
CASE save_ok.
WHEN 'BACK'.
(C) SAP AG
BC440
157
LEAVE TO SCREEN 0.
WHEN 'TC' OR 'SL'.

PERFORM fill_itab.
IF save_ok = 'TC'.
SET SCREEN 200.
ELSE.
SET SCREEN 210.
ENDIF.
LEAVE SCREEN.
WHEN OTHERS.
PERFORM special_ok_code.
ENDCASE.
ENDMODULE.
" USER_COMMAND_0100
INPUT
*&---------------------------------------------------------------------*
*&
Module
USER_COMMAND_0210
INPUT
*&---------------------------------------------------------------------*
*
*----------------------------------------------------------------------*
PERFORM process_back.
" Same coding for all screens
CASE save_ok.
WHEN 'EXIT'.
" User want's to leave after saving
LEAVE PROGRAM.
* --* Implement step loop paging here!

* --(C) SAP AG
BC440
158
WHEN 'PICK'.
PERFORM read_itab.
WHEN 'STEP_BACK'.
WHEN OTHERS.
ENDCASE.
ENDMODULE.
" USER_COMMAND_0210
INPUT
*&---------------------------------------------------------------------*
*&
Module
USER_COMMAND_0200
INPUT
*&---------------------------------------------------------------------*
*
*----------------------------------------------------------------------*
CASE save_ok.
WHEN 'EXIT'.
LEAVE PROGRAM.
WHEN 'PICK'.
PERFORM read_itab.
WHEN 'STEP_BACK'.
WHEN OTHERS.
(C) SAP AG
BC440
159
ENDCASE.
ENDMODULE.
" USER_COMMAND_0200
INPUT
*&---------------------------------------------------------------------*
*&
Module
USER_COMMAND_0300
INPUT
*&---------------------------------------------------------------------*
*
*----------------------------------------------------------------------*
CASE save_ok.
WHEN 'EXIT'.
LEAVE PROGRAM.
WHEN 'BOOK'.
WHEN 'STEP_BACK'.
LEAVE TO SCREEN list_screen.
WHEN OTHERS.
ENDCASE.
ENDMODULE.
" USER_COMMAND_0300
INPUT
*&---------------------------------------------------------------------*
*&
Module
GET_MARKED_LINE
INPUT
*&---------------------------------------------------------------------*
(C) SAP AG
BC440
160
Save selected line from TableControl
*----------------------------------------------------------------------*
MODULE get_marked_line INPUT.
IF sdyn_conn-mark = 'X'.
line_itab = my_tc-current_line.
ENDIF.
ENDMODULE.
" GET_MARKED_LINE
INPUT
*&---------------------------------------------------------------------*
*&
Module
USER_COMMAND_0400
INPUT
*&---------------------------------------------------------------------*
*
*----------------------------------------------------------------------*
CASE save_ok.
WHEN 'EXIT'.
LEAVE PROGRAM.
WHEN 'LOGON'.
PERFORM logon_and_book.
WHEN 'STEP_BACK'.
WHEN OTHERS.
ENDCASE.
ENDMODULE.
(C) SAP AG
" USER_COMMAND_0400
BC440
INPUT
161
Subroutines (BC440_WT_S_A_COPYF01):
*----------------------------------------------------------------------*
*& Include BC440_WT_S_A_COPYF01
*----------------------------------------------------------------------*
*&---------------------------------------------------------------------*
*&
Form
PROCESS_BACK
*&---------------------------------------------------------------------*
*
Process ok code BACK for all subsequent screens
*----------------------------------------------------------------------*
FORM process_back.
IF save_ok = 'BACK'.
ENDIF.
ENDFORM.
" PROCESS_BACK
*&---------------------------------------------------------------------*
*&
Form
FILL_ITAB
*&---------------------------------------------------------------------*
*
Call BAPI to get a list of flights
*----------------------------------------------------------------------*
FORM fill_itab.
DATA
my_return TYPE bapiret2.
CLEAR
"Return structure for BAPI call
itab.
CASE checked.
WHEN rb_aa.
sdyn_conn-carrid = 'AA'.
WHEN rb_lh.
sdyn_conn-carrid = 'LH'.
WHEN OTHERS.
CLEAR sdyn_conn-carrid.
ENDCASE.
(C) SAP AG
BC440
162
CALL FUNCTION 'BAPI_SFLIGHT_GETLIST'

EXPORTING
fromcountrykey = sdyn_conn-countryfr
fromcity
= sdyn_conn-cityfrom
tocountrykey
= sdyn_conn-countryto
tocity
= sdyn_conn-cityto
airlinecarrier = sdyn_conn-carrid
afternoon
= sdyn_conn-mark
IMPORTING
return
= my_return
TABLES
flightlist
= itab.
* sy-subrc is always 0. However return-type may indicate an error.
IF my_return-type <> ' ' AND my_return-type <> 'S'.

MESSAGE ID
my_return-id
TYPE
my_return-type
NUMBER my_return-number
WITH
my_return-message_v1 my_return-message_v2
my_return-message_v3 my_return-message_v4.
ENDIF.
line_first = 1.
"First visible line in step loop on 210
DESCRIBE TABLE itab LINES my_tc-lines. " Last line for TableControl
ENDFORM.
" FILL_ITAB
*&---------------------------------------------------------------------*
*&
Form
READ_ITAB
*&---------------------------------------------------------------------*
*
Get the selected line from the internal table
*----------------------------------------------------------------------*
FORM read_itab.
DATA: line_sel LIKE sy-stepl.
(C) SAP AG
BC440
163
DATA
IF line_itab IS INITIAL.
* Mark column not used
GET CURSOR LINE line_sel.
IF line_sel > 0.
* Use cursor postion for selecting (R/3 only, not ITS)
IF sy-dynnr = 200.
line_itab = my_tc-top_line + line_sel - 1.
ELSE.
line_itab = line_first + line_sel - 1.
ENDIF.
ELSE.
* No line selected
MESSAGE s319(bc440).
"
Please mark one line
LEAVE SCREEN.
ENDIF.
ENDIF.

IF sy-subrc <> 0.
* illegal line number via input field on 210
"
LEAVE SCREEN.
ENDIF.
CALL FUNCTION 'BAPI_SFLIGHT_GETDETAIL'

EXPORTING
airlinecarrier
= wa-carrid
connectionnumber = wa-connid
dateofflight
= wa-fldate
IMPORTING
return
= my_return
flightdata
= my_flightdata.

(C) SAP AG
BC440
164

MESSAGE ID
my_return-id
TYPE
my_return-type
WITH
ENDIF.
MOVE-CORRESPONDING my_flightdata TO sdyn_conn.
list_screen = sy-dynnr. "Remember if user wants to return to here.

ENDFORM.
" READ_ITAB
*&---------------------------------------------------------------------*
*&
Form
SPECIAL_OK_CODE
*&---------------------------------------------------------------------*
*
ITS synchronization
FORM special_ok_code.
* data: sync_itab ...
IF save_ok(4) = 'AWSY'.
*--* Implement synchronization here

*---
ENDIF.
ENDFORM.
" SPECIAL_OK_CODE
*&---------------------------------------------------------------------*
*&
Form
LOGON_AND_BOOK
*&---------------------------------------------------------------------*
(C) SAP AG
BC440
165
Check userno and password
Book the flight (if possible)
*----------------------------------------------------------------------*
FORM logon_and_book.
DATA
DATA: my_bookingdata LIKE bapisbdeta,

my_bookingdata_in LIKE bapisbdtin,
temp LIKE sy-msgv1.
*--* Check Customerno and password here!

*---
MOVE-CORRESPONDING my_flightdata TO my_bookingdata_in.
my_bookingdata_in-customid
= customernumber.
my_bookingdata_in-class
= 'Y'.
" economy class
my_bookingdata_in-agencynum = agencynum.
CALL FUNCTION 'BAPI_SBOOK_CREATEFROMDATA'

EXPORTING
bookingdata_in = my_bookingdata_in
IMPORTING
return
= my_return
bookingdata
= my_bookingdata.
IF my_return-type <> 'S'.

IF my_return-number = 155.
" flight booked out
my_return-type = 'S'.
MESSAGE ID
TYPE
my_return-id
my_return-type
(C) SAP AG
BC440
166
WITH
my_return-message_v1
my_return-message_v4.
PERFORM fill_itab.
SET SCREEN list_screen.
ELSE.
MESSAGE ID
my_return-id
TYPE
my_return-type
WITH
ENDIF.
ELSE.
CONCATENATE my_bookingdata-carrid my_bookingdata-connid
INTO temp.
MESSAGE ID 'BC440'
TYPE
'S'
NUMBER 160
WITH
" booking created
my_bookingdata-customid
temp
my_bookingdata-fldate
my_bookingdata-bookid.
CALL FUNCTION 'BAPI_TRANSACTION_COMMIT'.

ENDIF.
(C) SAP AG
BC440
167
ENDFORM.
" LOGON_AND_BOOK
*&---------------------------------------------------------------------*
*&
Form
SEND_CITIES_TO_ITS
*&---------------------------------------------------------------------*
*
Dynamic list of city for ITS
*----------------------------------------------------------------------*
FORM send_cities_to_its.
*--* Send cities to ITS via RFC here

*
* DATA city LIKE sgeocity-city.
* SELECT city FROM sgeocity INTO city WHERE...
*---
ENDFORM.
(C) SAP AG
" SEND_CITIES_TO_ITS
BC440
168
(C) SAP AG
BC440
169
(C) SAP AG
BC440
170
(C) SAP AG
BC440
171
(C) SAP AG
BC440
172
(C) SAP AG
BC440
173
Flow logic screen 100:

* Set status and title bar
MODULE status_0100.
* Default values for cities
MODULE preset_cities.
* -----------------------------------------------------------------PROCESS AFTER INPUT.
* Process all at exit commands
MODULE exit_command AT EXIT-COMMAND. " Called by all screens
* Save the ok code value
MODULE copy_ok_code.
" Called by all screens
* Process user command after all checks completed

CHAIN.
FIELD:
sdyn_conn-countryfr, sdyn_conn-cityfrom,
sdyn_conn-countryto, sdyn_conn-cityto,
rb_aa, rb_lh, rb_any,
sdyn_conn-mark.
ENDCHAIN.

MODULE status_0200.
LOOP AT itab INTO wa WITH CONTROL my_tc.
* Copy one line from ITAB to TableControl
MODULE itab_to_tablecontrol.
ENDLOOP.
* Forget last choice
MODULE reset_line_itab.
(C) SAP AG
BC440
174

LOOP AT itab.
* Get marked line
FIELD sdyn_conn-mark MODULE get_marked_line on input.
ENDLOOP.
(C) SAP AG
BC440
175

MODULE status_0210.
LOOP.
MODULE itab_to_steploop.
ENDLOOP.
LOOP.
ENDLOOP.

MODULE status_0300.
(C) SAP AG
BC440
176



MODULE status_0400.
* Forget last password
MODULE clear_password.

CHAIN.
FIELD: customernumber.
ENDCHAIN.
(C) SAP AG
BC440
177
Solutions
Topic: Service Wizard
Using the service wizard
Use the service wizard to create a new service. Use publish to copy the
service to AGate.
Service-Datei bc440s_wiz_s:
~transaction
(C) SAP AG
bc440s_a_copy
BC440
178
Solutions
Topic: Template Wizard
Using the template wizard
Use the template wizard create templates for the screens in your R/3
transaction. Improve the templates. Add a hyperlink to the homepage of
your travel agency to start your service.
HTMLBusiness template for screen 100:

<html>
<head>
<title>`~windowtitle`</title>
</head>
<body>
`~messageLine`
<form method="post" action="`wgateURL()`">
<p>
`SDYN_CONN-COUNTRYFR.label`
<input type=text name="`SDYN_CONN-COUNTRYFR.name`" value="`SDYN_CONNCOUNTRYFR.value`" maxlength="003" size="003">àssert(SDYN_CONN-COUNTRYFR.name)`
<p>
`SDYN_CONN-CITYFROM.label`
<input type=text name="`SDYN_CONN-CITYFROM.name`" value="`SDYN_CONNCITYFROM.value`" maxlength="020" size="020">àssert(SDYN_CONN-CITYFROM.name)`
<p>
`SDYN_CONN-COUNTRYTO.label`
<input type=text name="`SDYN_CONN-COUNTRYTO.name`" value="`SDYN_CONNCOUNTRYTO.value`" maxlength="003" size="003">àssert(SDYN_CONN-COUNTRYTO.name)`
<p>
`SDYN_CONN-CITYTO.label`
<input type=text name="`SDYN_CONN-CITYTO.name`" value="`SDYN_CONNCITYTO.value`" maxlength="020" size="020">àssert(SDYN_CONN-CITYTO.name)`
(C) SAP AG
BC440
179
<p>
<table>
<tr>
<td>
<input type=radio name="`RB_AA.group`" value="`RB_AA.name`"
ìf(RB_AA.selected)` checked ènd`>`RB_AA.label`
</td>
</tr>
<tr>
<td>
<input type=radio name="`RB_LH.group`" value="`RB_LH.name`"
ìf(RB_LH.selected)` checked ènd`>`RB_LH.label`
</td>
</tr>
<tr>
<td>
<input type=radio name="`RB_ANY.group`" value="`RB_ANY.name`"
ìf(RB_ANY.selected)` checked ènd`>`RB_ANY.label`
</td>
</tr>
</table>
<p>
<input type="hidden" name="`SDYN_CONN-MARK.name`" value=" ">

<input type=checkbox name="`SDYN_CONN-MARK.name`" value="X" ìf(SDYN_CONNMARK.selected)` checked ènd`>
`SDYN_CONN-MARK.label`
<p>
<input type=submit name="~okcode=TC" value="`BUTTON100.label`">
</form>
</body>
</html>
(C) SAP AG
BC440
180

<html>
<head>
</head>
<body>
`~messageline`
<form method="post" action="`wgateurl()`">
<p>
`SDYN_CONN-COUNTRYFR.value`
<p>
`SDYN_CONN-CITYFROM.value`
<p>
`SDYN_CONN-COUNTRYTO.value`
<p>
`SDYN_CONN-CITYTO.value`
<p>
<table>
<thead>
<tr>
<td></td>
`repeat with j from 1 to MY_TC.columncount`
<td>`MY_TC-column[j].title`</td>
ènd`
</tr>
</thead>
<tbody>
`repeat with j from MY_TC.firstvisible to MY_TC.lastvisible`
<tr>
<td><input type=radio name="MY_TC" value="MY_TC-rowselect[`j`]"
ìf(MY_TC-rowselect[j].selected)` checked ènd`></td>
<td>`SDYN_CONN-CONNID[j].value`</td>
<td>`SDYN_CONN-FLDATE[j].value`</td>
<td>`SDYN_CONN-AIRPFROM[j].value`</td>
<td>`SDYN_CONN-AIRPTO[j].value`</td>
(C) SAP AG
BC440
181
<td>`SDYN_CONN-DEPTIME[j].value`</td>
<td>`SDYN_CONN-SEATSMAX[j].value`</td>
<td>`SDYN_CONN-SEATSOCC[j].value`</td>
</tr>
ènd`
</tbody>
<tfoot>
<tr>
<table>
<tr>
<td><input type=submit name="~control=MY_TC,~event=toppage"
value="first page"></td>
<td><input type=submit name="~control=MY_TC,~event=prevpage"
value="prev page"></td>
<td><input type=submit name="~control=MY_TC,~event=nextpage"
value="next page"></td>
<td><input type=submit name="~control=MY_TC,~event=lastpage"
value="last page"></td>
</tr>
</table>
</tr>
</tfoot>
</table>
<p>
<input type=submit name="~okcode=PICK" value="`BUTTON200.label`">
</form>
</body>
</html>

<html>
<head>
</head>
<body>
`~messageline`
<p>
(C) SAP AG
BC440
182
<p>
<p>
<p>
<p>
<table>
<thead>
<tr>
<td>`SFLIGHT-CARRID.label`</td>
<td>`SFLIGHT-CONNID.label`</td>
<td>`SFLIGHT-FLDATE.label`</td>
<td>`SPFLI-AIRPFROM.label`</td>
<td>`SPFLI-AIRPTO.label`</td>
<td>`SPFLI-DEPTIME.label`</td>
<td>`SFLIGHT-SEATSMAX.label`</td>
<td>`SFLIGHT-SEATSOCC.label`</td>
</tr>
</thead>
<tbody>
`repeat with j from 1 to SDYN_CONN-CARRID.max`
<tr>
</tr>
ènd`
</tbody>
</table>
<p>
(C) SAP AG
BC440
183
<input type=text name="`LINE_ITAB.name`" value="`LINE_ITAB.value`"

maxlength="004" size="004">àssert(LINE_ITAB.name)`
<input type=submit name="~okcode=PICK" value="`BUTTON210.label`">
</form>
</body>
</html>

<html>
<head>
</head>
<body>
`~messageline`
<p>
`SDYN_CONN-CARRID.label`
`SDYN_CONN-CARRID.value`
<p>
`SDYN_CONN-CONNID.label`
`SDYN_CONN-CONNID.value`
<p>
`SDYN_CONN-FLDATE.label`
`SDYN_CONN-FLDATE.value`
<p>
<p>
`SDYN_CONN-AIRPFROM.label`
`SDYN_CONN-AIRPFROM.value`
<p>
<p>
`SDYN_CONN-AIRPTO.label`
`SDYN_CONN-AIRPTO.value`
<p>
`SDYN_CONN-DISTANCE.label`
`SDYN_CONN-DISTANCE.value`
(C) SAP AG
BC440
184
`SDYN_CONN-DISTID.value`
<p>
`SDYN_CONN-DEPTIME.label`
`SDYN_CONN-DEPTIME.value`
<p>
`SDYN_CONN-ARRTIME.label`
`SDYN_CONN-ARRTIME.value`
<p>
`SDYN_CONN-FLTIME.label`
`SDYN_CONN-FLTIME.value`
<p>
`SDYN_CONN-PRICE.label`
`SDYN_CONN-PRICE.value`
`SDYN_CONN-CURRENCY.value`
<p>
`SDYN_CONN-PLANETYPE.label`
`SDYN_CONN-PLANETYPE.value`
<p>
`SDYN_CONN-SEATSMAX.label`
`SDYN_CONN-SEATSMAX.value`
<p>
`SDYN_CONN-SEATSOCC.label`
`SDYN_CONN-SEATSOCC.value`
<p>
<input type=submit name="~okcode=BOOK" value="`BUTTON300.label`">
</form>
</body>
</html>

<html>
<head>
</head>
<body>
`~messageline`
<p>
`SCUSTOM-ID.label`
(C) SAP AG
BC440
185
<input type=text name="`CUSTOMERNUMBER.name`" value="`CUSTOMERNUMBER.value`"

maxlength="008" size="008">àssert(CUSTOMERNUMBER.name)`
<p>
<input type=submit name="~okcode=LOGON" value="`BUTTON400.label`">
</form>
</body>
</html>
(C) SAP AG
BC440
186
Solutions
Topic: Changing Input Elements
Using HTMLBusiness templates.
Change the template for screen 100. Use hidden input fields and HTML
selects to input departure country and city and destination country and
city.
HTMLBusiness template for screen 100 (changes in bold):

<html>
<head>
</head>
<body>
<h1>`~messageLine`</h1>
<input type=hidden name="`SDYN_CONN-COUNTRYFR.name`" value="`SDYN_CONNCOUNTRYFR.value`" >
<input type=hidden name="`SDYN_CONN-COUNTRYTO.name`" value="`SDYN_CONNCOUNTRYTO.value`" >
<table>
<tr> <td> `SDYN_CONN-CITYFROM.label`
<td> <select name="`SDYN_CONN-CITYFROM.name`">
<option>Berlin
<option>Hamburg
(C) SAP AG
BC440
187
<option selected>Walldorf
</select>
<tr> <td>
<td> <select name="`SDYN_CONN-CITYTO.name`">

<option>Atlanta
<option selected>New York
<option>San Francisco
</select>
</table>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
<p>

<table height="61" width="100%" border="0" cellspacing="0" cellpadding="0">

<tr>
<td background="`mimeURL("system", "", "", "IAC_Menu_Tile.gif" )`"
height="30">
<table> <tr> <td width=5></td>
<td width=473 nowrap><font face=arial size="-1" color=white>ITS System
Information</font></td>
</tr> </table>
</td>
<td rowspan=2 width=122 height=61 valign=top><img src="`mimeURL("system", "",
"", "Theme+SAPLogo.jpg")`" width=122 height=61 border=0 alt=""></td>
</tr> <tr>
<td background="`mimeURL("system", "", "", "IAC_graybar_Tile.jpg")`"
height="31">
</td> </tr> </table>
(C) SAP AG
BC440
30

<br><br> <table width=600> <tr> <td width=50 nowrap></td> <td>
File tail.html (changes are in bold)

<table>
<tr>
<td width=50 nowrap></td>
<td nowrap>
<FONT SIZE=-1>
Return to <a href="/BC440/">BC440</a>.
</FONT>
</body>
</html>
(C) SAP AG
BC440
31
Exercises
Topic: ITS Administration Tool
Use the ITS Administration Tool
Use the ITS Administration Tool to display the ITS settings and protocols
used in your training course.
2-1-1 Start the ITS Administration Tool Your instructor will tell you the TCP port,
user name and password for the logon.
2-1-2 Use the ITS Administration Tool to find the answers to the following questions:
(dependent on training system)
(C) SAP AG
BC440
32
9
Summary and Outlook
Contents:
Comparison of the programming models
Comparison of the tools
ITS and mySAP.com
Adjusting existing scenarios
SAP AG 1999
(C) SAP AG
BC440
9.2
Summary and Outlook
7 WebRFC
8 Administration
2 Preface
1 Course Overview
6 Web
Transaction
4 HTML
SAP AG 1999
(C) SAP AG
BC440
9.3
Overview: ITS and mySAP.com
Comparison
Comparison of
of the
the Programming
Programming Models
Models
Comparison
Comparison of
of the
the Tools
Tools
ITS
ITS and
and mySAP.com
mySAP.com
Adjusting
Adjusting Existing
Existing Scenarios
Scenarios
SAP AG 1999
(C) SAP AG
BC440
9.4
R/3 Client/Server Architecture with ITS
Presentation
Application
Database
SAP GUI
ITS
...
Web
server
...
Web browser
HTTP
(HTML)
DIAG
SAP AG 1999
The Internet Transaction Server extends the three-tier client/server structure of the R/3 System to the
Internet.
With a SAP GUI the R/3 System can be used simultaneously with the Internet Transaction Server.
(C) SAP AG
BC440
9.5
Communication with
R/3
HTTP
the HTTP server
the R/3 application

server

logon
Internet
Transaction
server
Conversion of data on R/3

screens into HTML pages
Status management
SAP AG 1999
The Internet Transaction Server (ITS) links one or more HTTP servers with one or more R/3 Systems.
Internet and Intranet users can run Web-enabled transactions, Web-enabled function modules, or any
ABAP reports in R/3 using the ITS.
(C) SAP AG
BC440
9.6
ITS Admin Tool - A Special Virtual ITS
ABC
HTTP
ITS
DEV
FGH
Browser
HTTP
ITS
QAS
ADM
URL to start the

Admin Tool:
HTTP
ITS
http://.../scripts/wgate/admin/!
SAP AG 1999
Functions in the ITS Admin Tool

Overview - Overview of all the virtual Internet Transaction Servers on one page
Hits, hits/sec, turn-around-time, sessions, workthreads
Control - Start and stop the ITS and Web servers
Performance - Detailed display
Configuration - Performance settings, service files, log functions, debugging, registry
Security - NT security (files), communication (WGate to AGate, AGate to R/3)
Utilities - Flush logs, clear templates cache
View Templates
View Logs
System View - Overview of NT server
Administration - Admin tool user management
(C) SAP AG
BC440
9.7
Components of an ITS Service
Web
browser
CGI
TCP/IP
HTTP
server
ITS
MIME
objects
Service
files
AGate
HTTP
WGate
DIAG
RFC
R/3
application
server
HTML
Business
templates
SAP AG 2001
A service the Internet Transaction Server provides for Internet users consists of:
Administering logon information to the R/3 System (name of system, user details)
Running a transaction in R/3 or calling a function module or report
Converting R/3 data (screens or lists) to HTML pages
When a service is started, a SAP GUI or RFC session is internally started:
The ITS assigns the HTTP requests for a service to the correct session
A user context corresponds to each session in the R/3 System
A session ends when the service ends (by logoff or timeout in ITS)
(C) SAP AG
BC440
9.8
Service Files
Global.srvc
~systemName
~login
~password
~client
~language
...
abcd.srvc
~transaction
ABCD
its050.srvc
~transaction
test.srvc
~initialTemplate start
~theme
99
XYP
Meier
***
400
DE
ABCD
zits050_00.srvc
~transaction
Z234
~login
~language
SAP AG 1999
Service files are text files that are stored in the AGate file system. They contain the settings that the ITS
requires to connect to the R/3 System to start a transaction or a WebRFC-enabled function module.
The structure of service files is as follows: Each line contains a parameter name with a value separated
by at least one space or TAB. These files can be edited with any text editor. The SAP@Web Studio and
the Web Application Builder provide table-type maintenance for this.
The file Global.srvc is a special service file. It contains global settings - all those common to all
individual services. When a <service> is started, the file Global.srvc is always imported first and
then the file <service>.srvc. The values from <service>.srvc are added to or override the
values from Global.srvc.
(C) SAP AG
BC440
9.9
Transaction Attributes
WebTransactions
Standard R/3 Transaction
Simple!
Processing is efficient in all

possible situations
Intended for use by everyone

(large number of users)
Users do not need to be
trained
Intended for professional

users
Users must be trained
Uses multimedia
and hyperlinks
to other systems
SAP AG 1999
A WebTransaction makes a small part of the entire R/3 functions available to Internet users. This means
that untrained Internet users can also use this functionality.
(C) SAP AG
BC440
9.10
IACs and SAP GUI for HTML
IAC
IAC
Internet
Internet
Application
Application
Components
Components
WebTransactions
WebTransactions
Transactions
for
WebTransactions
WebRFC
WebRFC
Function
modules
for WebRFC
SAP
SAP GUI
GUI
for
for HTML
HTML
Entire R/3
functionality
R/3
R/3
SAP AG 1999
With the Internet Transaction Server, R/3 functions can be mapped into the Internet in three different
ways:
If an R/3 program is created especially for Internet users, it is called an Internet Application
Component (IAC). These include WebTransactions and WebRFC. IACs are not complex and they are
easy to use.
WebTransaction - special internet-enabled transactions that make a part of the whole R/3
functionality available to Internet users.
WebRFC - special function modules that can read and present data directly to the Internet user
The SAP GUI for HTML enables you to use almost all the R/3 functions in the Web browser. The
high level of complexity of R/3 transactions is also supported.
(C) SAP AG
BC440
10
9.11
SAP R/3
System Help
CGI
LH
Carrier ID:
HTTP
DIAG
SAP R/3
System Hilfe
100
HTTP
Web
browser
CGI
HTTP
server
DIAG
ITS
Carrier name:
Lufthansa
200
1 Screen =
1 Template =
1 HTML page
R/3
HTML
Service Business
file
templates
SAP AG 1999
on the above slide.
transaction.
(C) SAP AG
BC440
11
9.12
Synchronization - Comfortable Solution
SAP R/3
LH 400
01.06.00
03
LH 400
LH 400
LH 400
02
01.06.00
02.06.00
05.06.00
Details
LH 400
05.06.00
ID Scrn.
01 100
02 200
03 300
04 300
300
SAP R/3
LH 400 01.06.00
LH 400 02.06.00
LH 400 05.06.00
200
PICK
ITS
AGate
8
LH 400
01.06.00
AWSY...
SAP R/3
04
LH 400
05.06.00
300
R/3
SAP AG 1999
Synchronization in detail (example):

The ITS receives screen 300 by DIAG.
browser.
The user chooses the BACK button in the browser. The ITS is not aware of this action. The Web
browser sends a completed HTML form to the ITS via the HTTP server.
The ITS checks the status number 02 and determines that synchronization is necessary. The ITS then
sends the function code AWSY<prog><screen_no> to the R/3 System.
The ABAP program uses SET SCREEN to display the correct screen 200. The ITS receives the
correct screen 200 by DIAG.
The ITS fills the input fields and sends the associated function code.
The input is processed in R/3 and the result screen 300 is sent by DIAG to the ITS. The ITS receives
screen 300 by DIAG.
browser.
Note: The ITS sends AWSY... only once - R/3 has only one chance to send the correct screen.
(C) SAP AG
BC440
12
9.13
SAP@Web Studio
Working methods are projectoriented

Used for creating, managing,
maintaining and publishing:
SAP@Web
Studio
Projects
Service files
Language dependencies
(text files)
MIME objects
(administration and display
functions only )
ITS flow files
SAP AG 2001
In the SAP@Web Studio, all the components of EasyWebTransactions and scenarios required outside the
R/3 System can be maintained using ITS flow logic. They include:
Service files
MIME objects (such as images, sound, video)
Files with language-dependent placeholders
ITS flow files
The SAP@Web Studio is a component of the ITS installation.
(C) SAP AG
BC440
13
9.14
Web
browser
Start service
SAP@Web
Studio
AGate
WGate
Publish with the SAP@Web Studio
HTTP
R/3
ITS
Web Studio publish
test.srvc ìtab[i]`
MIMEs
Services
start
list
Templates Flow files
Seats
seats
Texts
Project ITSxxx_Demo
SAP AG 2001
MIME objects are copied by "Publish" into the file system of the WGate (the HTTP server).
(C) SAP AG
BC440
14
9.15
Syntax in HTMLBusiness
HTMLBusiness syntax is very similar to C programming

language
HTMLBusiness commands appear in "normal" HTML and are
enclosed between ` (backticks)
`SDYN_BOOK-NAME.LABEL` <p>
<em> `SDYN_BOOK-NAME` </em>
The SAP@Web Studio displays HTMLBusiness commands in
blue.
SAP AG 1999
HTMLBusiness expressions are case-insensitive.

The character ` (backtick) was chosen because it has no special usage in "normal" HTML.
Another way of embedding HTMLBusiness in HTML is described later.
(C) SAP AG
BC440
15
9.16
Template Wizard
R/3 System
Program
ABC
XYZ
GHJ
sapbc440d
TZU
Screen Number 100; 200

Service
BC440Demo
Theme
99
Language
<none>
<body>
<form action="`wgateURL()`"...>
...
</form>
`~messageLine`
</body>
HTML
Business
templates
R/3 Logon
SAP@Web
SAP@Web
Studio
Studio
R/3
SAP AG 1999
The Template Wizard automatically creates an HTMLBusiness template for each R/3 screen.
HTMLBusiness expressions are automatically created for all the input fields, output fields and field labels.
The Wizard also embeds these fields into an HTML form using <input type=text ...>
Depending on the application, some HTML commands may have to be deleted.
The HTMLBusiness command ~messageLine is described later in this Unit.
The ITS manages templates according to theme and language. (discussed later in Unit). Basically, the
theme is determined by the service parameter ~theme and the language by the service parameter
~language. The parameter values should be passed to the Template Wizard.
The tempaltes are generated in R/3. The SAP@Web Studio must establish an RFC connection to an R/3
System to run a program from here. You can chose the R/3 System. All user data required for logon must
be specified.
The automatically generated templates can be modified at any time.
(C) SAP AG
BC440
16
9.17
Theme Different Layouts for a Screen
LH
SAP R/3
AGate
Airline carrier:
50
99
Airline carrier
LH
Airline carrier:
<form ...> ... </form>
<img...src="...">
<img src="...">
... `SCARR-CARRID.label`<p>
50 <form ...> ... </form>
HTML
Business
templates
LH
100
ITS
...99
System Help
R/3
For each
screen:
1 theme =
1 template
SAP AG 1999
The whole business logic of an EasyWebTransaction is in R/3. However, the actual appearance (layout)
is determined by the HTMLBusiness templates used.
If the same EasyWebTransaction is to be used by different user groups, it may be necessary to provide
different screen layouts. The ITS uses themes for this.
A theme is a logical name for the screen layout of EasyWebTransactions. The name consists of two lines
(letters or digits). Any number of themes can be used for one EasyWebTransaction.
A theme is specified at the start of a service and it cannot be modified while the service is running.
(C) SAP AG
BC440
17
9.18
Language Independency Through Text Files
Flge anzeigen
DE
Testen Sie uns!
AGate
System Hilfe
DE
Display flights
System Help
EN
ITS
EN
Carrier:
LH
Carrier: LH
Test us!
SAP AG 1999
...
<img src="...">
1
<form ...> ... </form>
1
<font ...>`#slogan`</font>
...
HTML
LanguageBusiness dependent
templates
texts
Language =
Text file
If not all language-dependent texts can be fetched from the R/3 System, HTML Business enables
placeholders for language-dependent text to be used in templates. At runtime these placeholders
are replaced by the relevant text from language-dependent text files
(C) SAP AG
BC440
18
9.19
MIME Objects for a WebTransaction
Use any MIME objects

Book id:
561966
(images, sounds, videos, ...)
50
MIME objects are stored

on the HTTP server
HTMLBusiness function
mimeURL() creates the
correct URL at runtime
99
Book id:
561966
Dependent on language
and theme
<img src="`mimeUrl(...)`">
SAP AG 2001
MIME objects can be linked to WebTransactions in several ways:

Static URL to access objects in the file system of the HTTP server
Dynamic URL using HTMLBusiness to access objects in the file system of the HTTP server
Send MIME objects from R/3 to the ITS
The second option has the following advantages:
The business logic of a WebTransaction can be developed in R/3 separately from the visual
appearance of the resulting HTML pages.
MIME objects can be included dependent on the selected theme and logon language at runtime.
In combination with language support customer-specific information can be presented on the Web.
The first option ideally should not be used. This topic focuses on the second option. The third option is
described in the topic "Macros".
(C) SAP AG
BC440
19
9.20
Include Example
File button_functions.html:
" value=", text, " >")
end`
SAP AG 2001
(C) SAP AG
BC440
20
9.21
AGate
R/3 System Landscape with ITS Integration (IACOR)
HTTP
ITS
DEV
AGate
HTTP
ITS
QAS
AGate
HTTP
ITS
PRD
SAP AG 1999
(C) SAP AG
BC440
21
9.22
RFC
RFC
ITS
(AGate)
QUERY_STRING
R/3
NAME
VALUE
_function
...
...
...
HTML
<HTML><HEAD>
<TITLE>...</HTML>
CONTENT_TYPE
Function module
text/html
Service
WebRFC
RETURN_CODE
WebRFC-enabled
function module
SAP AG 1999
The AGate enters the name and value of all the parameters in the URL into the table
QUERY_STRING. This table is forwarded to WWW_DISPATCH_REQUEST.
In response the AGate receives:
A complete HTML page as a table HTML or a binary object as table MIME.
the MIME type of the result, text/html
A return code that states whether the AGate should remain connected:
RETURN_CODE = 0: close
RETURN_CODE = 1: keep open
RETURN_CODE = 3: close and also close ITS session
(C) SAP AG
BC440
22
9.23
WebRFC-enabled function module

1
WWW_HTML_MERGER
R/3
Template name and data for place holders
HTML page with place holders
HTML page
WWWDATA
SAP AG 1999
Table HTML can also be filled using templates. Unlike Web Transaction templates, the templates
used in WebRFC are kept in the table WWWDATA in R/3, not in the file system of AGate.
The function module WWW_HTML_MERGER generates a filled HTML table from a template and data for
the placeholders.
(C) SAP AG
BC440
23
9.24
SAP Web Repository - HTML Templates
General functions
Maintain MIME types
Assign MIME editors
Maintaining HTML templates in table WWWDATA
WWWDATA
SAP AG 2001
As well as the MIME objects used for WebRFC, the HTML templates for WebRFC applications are also
kept in the database table WWWDATA.
SAP templates should not be directly modified, they should first be copied to the customer name space
(beginning with Z).
(C) SAP AG
BC440
24
9.25
SAP Web Repository - MIME Objects
General functions
Maintain MIME types
Assign MIME editors
Maintaining MIME objects in table WWWDATA
WWWDATA
SAP AG 2001
All MIME objects used for WebRFC are in the database table WWWDATA.
If objects are to be saved in this table, the MIME type must also exist. A MIME type is therefore
assigned to each required file extension. The MIME type is automatically saved when objects are
imported into R/3.
(C) SAP AG
BC440
25
9.26
Summary and Outlook
Summary
Summary
What's
What's Next?
Next?
SAP AG 1999
(C) SAP AG
BC440
26
9.27
ITS and mySAP.com Workplace
WebServer process(es)
Cookies
TopTier
HTTPserver
launch via temp. starter

Employee Work Place (AP)
1 Sep, 1999
Technical infrastructure of EWP
... if SAP GUI

runs 'within'
Browser
HTTP(S) / HTML
Work
Place
User
Block diagram
Portal configurator
HTTPserver
MTS
(Microsoft
Transaction
Server)
+
DCOM CC
Other backend
Systems

A-Gate
R
W Gate
WebGUI
Work place
server
(based on
BW/KW?)
RFC
Top tier database

(ODS)
ISAPI
Browser
(WebGUI)
Backend systems
DCOM
Users frontend(s)
Portal Middleware
Users machine
Server site
Users immediate environment
WebRFC
SAPGUI
Advantages of RFC
BW
R/3 Core
HTML
Files
SAP GUI
for Java
SAPGUI Prot./
RFC
Windows
Terminal
Client
Proprietary
Protocol
SAP GUI
for Windows
Java
Citrix
VM
Plug ins
APO
Templates
KW
Frontend server
Windows
Terminal
server
Windows
GUI
SAPGUI Prot./
SAPGUI Prot./
RFC
SAP AG 1999
(C) SAP AG
BC440
27
10
Appendix
Contents
Additional slides
SAP AG 1999
(C) SAP AG
BC440
10.2
Appendix
This section contains additional material

to be used for reference purposes.
This material is not part of the
standard course.
Therefore, it may not be covered
during the course presentation.
SAP AG 2003
(C) SAP AG
BC440
10.3
Appendix
Internet,
Internet, Intranet
Intranet and
and WWW
WWW
Using
Using the
the SAP@Web
SAP@Web Studio
Studio Without
Without IACOR
IACOR
WebRFC
WebRFC
Installation
Installation and
and Administration
Administration
System
System Environment
Environment for
for Training
Training
SAP AG 1999
(C) SAP AG
BC440
10.4
From The Domain Name to The IP Address
What is the IP address of the computer pc12.wdf.sap.com?
2
DNS server
Domain xyz.com
LAN
Router
4
DNS servers
Domain com
A42
a42.xyz.com
Internet
8
9
DNS server
Domain wdf.sap.com
5
6
DNS servers
Domain sap.com
Router
LAN
PC12
pc12.wdf.sap.com
SAP AG 2001
Domain names are assigned to an IP address using a distributed database. Each Domain Name Server
only knows the IP addresses of the computers with domain names directly below it in the domain
hierarchy. It also knows the IP address of the Domain Name Server directly above it in the hierarchy. At
each level, servers are duplicated to maximize failure safety and to ensure shorter response times.
To connect to a computer for which only the domain name is known, the computer's IP address has to be
identified. IP Address In the example above this is done as follows:
A42 makes a request (1) to the DNS server (2) in its network. If this server already knows the
answer (target is local or in the cache), it passes it to A42. If not, it forwards the request from A42
(3), then passes the result to A42 and also copies it to a local cache. Other requests for the same
name can be responded to immediately with the cache.
With (4) the ascent from .de to the DNS server for wdf.sap.com begins. Each DNS server in the
hierarchy only knows the IP addresses of the DNS servers in the domain in the next level down.
From .de (5) the request is passed via sap.de (6+7) down to wdf.sap.com (8).
Eventually the DNS server for wdf.sap.com knows the IP address of PC12 and passes this
address back. On the return route via the DNS servers sap.com, .de etc. it can be loaded into a
cache at any time.
Finally the response arrives at A42.
(C) SAP AG
BC440
10.5
HTTP Cache Process
Principle: present
GET from client
Response in cache?
No
Yes
Cache current?
No
HEAD to server
Yes
Cache valid?
No
GET to server
Yes
Select current cache
Response in cache
Response to client
SAP AG 1999
When are the contents of a cache no longer up to date?

The stated expiration date has passed GET request to server necessary
The contents have been in the cache for a 'long time'
HEAD request to server can be sent
The HTTP specification (RFC 2068) states how long a data object can be stored in a cache.
POST requests cannot be stored in any cache.
(C) SAP AG
BC440
10.6
Cookies - Improper Use (1)
http://c/logo.gif
PC12
Movement profile
4711 A 11.12.97
GET logo.gif (referer: A)
Logo
4711
SAP AG 1999
The servers A, B and C are working in cooperation. There are documents on servers A and B containing
embedded images that are on server C.
The above process is as follows:
The Web browser first sends a request to server A and receives the requested page in response.
The browser recognizes that an image is required from server C and sends a request to server C.
The name in the request header (here: A) is sent to the server from which the page containing the
image originates.
Server C creates a cookie and stores the cookie number, name of the server (in this case A) and the
current date. A) A movement profile is produced.
In response, the browser receives the image from server C and a persistent cookie.
(C) SAP AG
BC440
10.7
Cookies - Improper Use (2)
A
PC12
http://c/logo.gif
Movement profile
4711 A 10.12.97
4711
4711 B 11.12.97
GET logo.gif (referer: B)
Logo
4711
SAP AG 1999
Continuation of previous process (not necessarily during the same browser session):
The Web browser sends a request to server B and, in response, receives the page requested.
The browser recognizes that an image is required from server C and sends a request to server C. It
must not necessarily be the same image. What is important is that the image is located on server C.
Not only the name of the server (B) from which the page with the embedded image comes is sent
with the request, the cookie sent with the first response from server C and saved on the local hard
drive, is also sent.
Server C recognizes the cookie number and stores the server name (now B) and current data. A)
The movement profile is extended.
The browser receives the image from server C as the response. Although the cookie sent earlier
does not have to be sent at the same time, it usually is.
If users enter their name or address on one of the three servers (for example, because they want to order
something), this information can be assigned to the anonymous (until this point) movement profile.
(C) SAP AG
BC440
10.8
Confidentiality - Symmetrical Encryption
Client and server define one shared key
Used for encryption and decryption
Exchanged outside the Internet or via a secure connection
Internet
Client
Server
SAP AG 2001
Advantage of symmetrical encryption:

Fast algorithms
Disadvantages:
The shared key must first be exchanged via a secure connection.
Anyone who intercepts the key can corrupt the message data as well as read it. The message
receiver will not be aware of this.
Example of an implementation:
DES (Data Encryption Standard) uses a 56 bit key, that is, there are 2 56 different keys.
(C) SAP AG
BC440
10.9
Confidentiality, Authenticity - Asymmetrical
Encryption
The server generates one pair of keys
(public key and private key)
Encryption with one key requires decryption with the other
The client is only notified of the public key
Public key (server)
Private key (server)
Internet
Client
Server
SAP AG 2001
Advantage of asymmetrical encryption:

Messages can neither be read nor corrupted
Disadvantages:
Complex algorithms
Public keys of all communication partners need to be administered
Example of an implementation:
RSA (named after the inventors Rivest, Shamir and Adleman) uses prime number arithmetic to
create the pair of keys. One key cannot be calculated from the knowledge of the other. See also
(http://www.rsa.com).
(C) SAP AG
BC440
10.10
Certification Server
The server generates one pair of keys

A certification server (C server)
generates one pair of keys
The server sends its public key to the
C server and receives a certificate
encrypted with the private key of the C server
containing the public key of the server
Certification server in the Internet:

www.verisign.com
SAP AG 2001
(C) SAP AG
BC440
10
10.11
SSL - Setting Up the Connection (1)
The client calls the server (not shown)
Hash code
Private key (C server)
Internet
Hash code
ID
=?
Public key (server)
Client
Message
Public key (C server)
Certificate
The server responds with the certificate, test message and ID
Server
SAP AG 2001
(C) SAP AG
BC440
11
10.12
SSL Setting Up the Connection (2)
The client sends a shared key via the secure connection to

the server
Symmetrical encryption is then used
Public key (server)
Internet
Client
Server
SAP AG 2001
(C) SAP AG
BC440
12
10.13
SRGB - Standard RGB Palette for the WWW
Requirement:
Display images with identical quality in all browsers
Assumptions:
A color palette with 256 different colors is available
Each color can be chosen from 16 million colors

Red: 0...255, Green: 0...255, Blue: 0...255 (24 bit)
The browser (and other programs) requires some colors for

windows and dialog boxes
Color palette:
6 grades per color channel

Dec. 000, 051, 102, 153, 204, 255 and hex. 00, 33, 66, 99, CC, FF
6 * 6 * 6 = 216 colors for images, 40 for windows and dialog boxes
http://www.w3.org/Graphics/Color/SRGB.html
SAP AG 2001
(C) SAP AG
BC440
13
10.14
Appendix
Internet,
Internet, Intranet
Intranet and
and WWW
WWW
Using
Using the
the SAP@Web
SAP@Web Studio
Studio Without
Without IACOR
IACOR
WebRFC
WebRFC
Installation
Installation and
and Administration
Administration
System
System Environment
Environment for
for Training
Training
SAP AG 1999
(C) SAP AG
BC440
14
10.15
Appendix
Internet,
Internet, Intranet
Intranet and
and WWW
WWW
Using
Using the
the SAP@Web
SAP@Web Studio
Studio Without
Without IACOR
IACOR
WebRFC
WebRFC
Installation
Installation and
and Administration
Administration
System
System Environment
Environment for
for Training
Training
SAP AG 1999
(C) SAP AG
BC440
15
10.16
System Environment for Training
Participants' PCs
Instructor's PC
Web server
ITSxxx
TCP port 1081
Training server
DIAG
HTTP
Web server
ADM
Network
TCP port 1080
Adminstration
RFC
HTML
SAP GUI
Web browser
HTTP demo
Notepad
Web Studio
Project
ITSxxx_WWW
ADM_WWW
WGate
WGate
AGate
AGate
ITSxxx_ITS
ADM_ITS
ITS
ITSxxx
ITS
ADM
R/3
application
server
SAP AG 1999
(C) SAP AG
BC440
16

BC440 DevelopingInternetApplicationComponents

Caricato da

Informazioni sul documento

Titolo originale

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

BC440 DevelopingInternetApplicationComponents

Caricato da

Copyright:

Formati disponibili

BC440 DevelopingInternet

Release 640 04/05/2006

Copyright 2004 SAP AG. All rights reserved.

CA610 (Rel. 4.0) 2 days

Project teams with ABAP experience who want to know how

SAP consultants and partners working with customers who

This course will prepare you to:

R/3 with the World Wide Web

At the conclusion of this course, you will be able to:

Internet, Intranet and

HTML, CSS and

SAP GUI for HTML

ITS Flow Logic

Summary and Outlook

9 Summary and Outlook

Each course participant will develop their own on-

line travel agency with:

Containing hyperlinks, images, and forms

CSS and JavaScript

Online flight information system with

At the conclusion of this unit, you will be able to:

3 Internet, Intranet and WWW

9 Summary and Outlook

the HTTP server

the R/3 application

User administration for R/3

Booking no. 561966

GUI for Internet Application

HTML 3.2 or later

Microsoft Internet Explorer 4.0

Netscape Communicator 4.0

Interface to the World

Third party suppliers

Supported Web servers:

Link between the

Converts R/3 data

Server based on Intel

(server components CD)

For details about availability and up-to-date information see:

Instead of R/3, you can

You are now able to:

At the conclusion of this unit, you will be able to:

3 Internet, Intranet and WWW

9 Summary and Outlook

The Internet is a network of computer networks. It is operated by:

TCP/IP =Transmission Control Protocol / Internet Protocol

IP - Internet Protocol has the following task:

A four-byte address that uniquely identifies each computer

Network ID (1-3 bytes)

Two network cards

Two IP addresses (one from each network)

IP addresses are difficult to remember and change frequently

A globally unique name is assigned to an IP address (letters and

World Wide Web (WWW)

File transfer (FTP)

Software used to access the Internet

Requests data from Internet servers (client/server structure)

Presents the information received (such as text, pictures and sound)

Sends data to Internet servers (such as mail and news)

Access to different data objects in the Internet

URLs for mail and news

One of the services on

HTTP is the application protocol of the WWW service