Workshop ITS



Palestrantes: Carlos Eduardo D. Ferreira
              Matheus Brito Faggioli
Para que serve o ITS?


   Com o ITS os usuários da internet/intranet
podem executar transações, módulos de
funções e relatórios do R/3, com páginas
html interativas.
Arquitetura R/3 Cliente/Servidor


 Presentation
                          SAPGUI




 Application




  Database
Arquitetura R/3 Cliente/Servidor
            com ITS
  Presentation

                          WEB BROWSER
      SAPGUI




                          WEB SERVER

                            Internet

                           Transaction

                             Server




  Application




  Database
Hardware e Software
                      Web          ITS       R/3
                      Server




      Web
      Browser




                                 SAP @Web
                                 Studio


Web browser                    - Interface de componentes gráficos (GUI) para
                               componentes de aplicação na Internet
Web Server                     - Interface para o World Wide Web
ITS    (Internet   Transaction - Link entre o WWW e o R/3
Server)                           Converte dados do R/3 em páginas HTML
R/3                            - Release 3.1 ou superior
                                  Internet Applications Components (IAC)
Divisão do ITS
 ITS – consiste do wgate e do agate
 •Wgate – faz a comunicação com o http server
 •Agate – faz a comunicação com o R/3 server

                                                                          DIAG

          HTTP
                          CGI
                                        TCP/ IP




                                WGATE




                                                      AGATE
                                                                          RFC



 Web
browser          HTTP                                                               R/3
                                          ITS

                 server                                                          application

                                                                                   server


                                        Arquivos de            HTML
                                          serviços
                                                               business
                                                              templates
Visão geral do funcionamento
      http://<server>/<path>/WGATE/ <serviço>/!


Para cada serviço é criado um arquivo de serviço (extensão
.srvc) no computador do Agate (na publicação) . Os templates do
HTML business requeridos pela transações Web também são
gravados no Agate.

SAP@WebStudio permite fazer manutenções nas descrições de
serviços e templates de HTML business.

SU05 - Ferramentas - Administração - Manutenção de usuários -
Usuário Internet

Os dados do usuários são armazenados na tabela BAPIUSW01.
Visão geral do funcionamento
Consiste de três componentes:
•Transação R/3 especial para internet
•Arquivo de serviço (service file)
•Templates do HTML business

Web Transaction:
•Pode utilizar objetos de negócios da SAP (Bapi)
•Deve exibir dados em telas simples
•Deve ter sincronização com o ITS
•Tratamento especial para F4 (matchcode/search help)
•Pode ser utilizada pelos usuários da internet

Templates do HTML business
•Apresenta dados exibidos pelas telas do R/3
•Cada tela da transação deve ter um template, que será convertido em
uma página html em tempo de execução.
Visão geral do funcionamento

              HTTP                   ITS           R/3

              server


                                                            SAP@Web

                                                             Studio



       MIME            Serviços        Templates   Textos

                           Projeto BC440


•Possui wizards que ajudam na criação de novos objetos
•Possibilita que todos os objetos criados sejam repassados para o R/3
Workbench Organizer e consequentemente transportados.
•Componente da instalação do ITS
•É instalado no desktop
Visão geral do funcionamento
                            <body>

                            <form action = `wgate()`>
 Program         SAPBC440
                            ....
 Screen Number   100;200
                            <body>
 Service         BC440

 Theme           99

 Language        <demo>

                                   Templates do
 Logon R/3                         HTML Busines




                                                        SAP@We
                                                        SAP@
                                                         bStudio
                      R/3
Tema
Tema é recurso necessário quando se tem diferentes
layouts das telas de uma mesma Webtransaction.

            ITS (Agate)

              GLOBAL      (srvc)
              BC440demo (srvc)

                           50
                                    SAPBC440_100.html
                                    SAPBC440_200.html
                                   ...
                                   ...
                           99
                                    SAPBC440_100.html
                                    SAPBC440_200.html
                                   ...
                                   ...
Linguagem

HTML Business

• É um enhancement para inserir dados do R/3 nas
páginas HTML

• Provem transferência de dados dos formulários HTML
para o R/3

• Similar a programação em C

• Utilizados nas página HTML e os comandos são
escritos entre ` ` (crase)
Linguagem
ITS é o programa CGI para input via HTML



  <form action=`wgateURL()`>

     <input type=text name=CUSTOMER ...>

     <select name=CARRID>

        <Option value=“LH”> Lufthansa

          ...

     </select>

     <input type=radio name=DURATION ...>

     <input type=CHECKBOX name=NONSTOP...>

     <input type=SUBMIT ...>

  </form>

Convertendo dados no Agate em tempo de execução (exemplo):


  Action= “/scripts/wgate/XY/....”
Linguagem

HTML Form                            Tela R/3




Nome            Meyer
                                     Nome
Senha           *******




                             AGATE
                                     Senha
Duração
                                     Duração
4 horas
12 horas                             Vôos diretos
Outros                       ITS
Somente Vôos diretos
Linguagem

Template                                                   Tela R/3

    <input type=submit

     name=“~OKCODE=DISP”                                           DISP
                                                            Nome           Meyer
     value=“#display”>
     value=“#display”>                                                     abap
                                                           Senha

                                                           Duração          12

                                                           Vôos             X
                                                           diretos          LH
                                                           Cia Aérea
 Query string (exemplo)

    ~OKCODE=DISP=display                                                  R/3


< a href = "`wgateURL(~Okcode="DISP")`"> `#display` </a>
Funções
• wgateURL() - cria URL para formulários e hyperlinks

• mimeURL() - Integra objetos MIME que estão armazenados no arquivo de sistema
do Wgate

• archiveURL() - inclui objetos de uma arquivo de sistema | XOS

• assert() - exibe o texto ERROR ao lado do campo cujo valor é inválido no R/3

<form action = "`wgateURL()`">
<input type=text name=ID>               `assert(ID)`
<input type=text name=DATE>                       `assert(DATE)`
</form> <p> `~messageLine`
~messageLine = captura a mensagem de erro que aparece na barra de status da
tela do R/3
~errorMaker = variável do serviço que contém o valor que será exibido no texto de
erro.
Condicionais
`if (SCARR-CARRID == "LH") `
         <em> Lufthansa </em>
`else`
         <font color = "blue"> Other Carrier </font>
`end`



`if (SPFLI-CITYFROM == "New York") `
          <em> Empire State Building </em>
`elseif (SPFLI-CITYFROM == "London") `
          <em> Tower Bridge </em>
`elseif (SPFLI-CITYFROM == ...) `
 ...
`end`
Objetos MIME
<img src= "`mimeurl(...)`">

Objetos Mime:
- Podem ser imagens, sons, vídeos.
- São armazenados no HTTP server
- São dependentes da linguagem e tema

MimeURL( [~service      = <serviço>, ]
         [~theme        =<tema>,     ]
         [~language     =<linguagem>,]
          ~name         =<nome>)

< img src="`mimeURL( ~name = "plane.gif", ~language = "DE")`">
Objetos MIME
ITS (Agate)                                    Hierarquia no arquivo do Wgate

  GLOBAL           (srvc)
                                               1- Serviço
  BC440demo (srvc)
                                               2- Tema

                     99                        3- Linguagem

                                  DE           4 - Nome da imagem

                                 Plane.gif
                                             Imagens podem ser armazenadas
  BC440demo (srvc)                            em qualquer nível


              99

                            DE
                            Plane.gif


              EN


     Plane.gif
MACROS
• Como o ITS não enxerga o comando F4 de help do
R/3, teremos que codificá-lo. Para isso podemos utilizar
macros já pré-definidas para isso

• Os dados são transportados entre o ITS e R/3 via RFC

• Campos, tabelas internas e objetos Mime são enviados
para o ITS dentro do evento PBO

• Campos de contexto do ITS e os objetos Mime são
lidos do ITS dentro do evento PAI

Macros para Help F4
Field-set e field-transport são definidas no include AVWRTCXM
Carrid

AA
              Carrname

              American Airlines
                                  MACROS
AC            Air Canada

AF            Air France

...           ...

UA            United Airlines
                                                         SCARR

                                  counter = 1.

         Contexto                 Loop at itab.

                                     FIELD-SET ‘CARRID’

                                                  counter itab-carrid.
                           RFC
                                     FIELD-SET ‘CARRNAME’

                                                  counter itab-carrname.
           ITS
                                     Add 1 to counter.

                                  Endloop.

                                  Field-transport.
MACROS
      Carrid     Carrname

1      AA        American Airlines
                                                 American Airlines
2      AC               Air Canada
                                                 Air Canada
3      AF               Air France
                                                 Air France
...   ...        ...
                                                 ...
Dim UA           United Airlines
                                                 United Airlines




                                     <select name = SCARR-CARRID>

            Contexto                 `repeat with i from 1

                                             to CARRID.dim`

                                        <option value= `CARRID[i]`”>

                                         `CARRNAME[i]`

             ITS                     `end`

                                     </select>
FRAMES
<frame name="F1" src="`wgateURL(~frameName=F1)`">

Sincronização com Frames - Código ABAP

MODULE ... INPUT .
       " Sync_itab like DDIC structure SITSSYNC
       save_ok_code = ok_code.
       Clear ok_code.
       Case save_ok_code(4).
                 ...
                 when ' AWSS'.
                           Call function 'ITS_GET_SYNC_INFO'
                           Tables
                              SYNC_INFO = SYNC_ITAB.
       Endcase.
ENDMODULE.

OBS: Função ITS_GET_SYNC_INFO resulta em uma tabela interna
contendo a atribuição de área de subtelas e telas para o ITS.
TRANSPORTE
                DEV                   QA             PRD




                      Add     Check        Check           Get

                              out          in




Todos os transportes entre o R/3 e o ITS são feitos via SAP@WebStudio.
Existem 4 tipos de transporte entre o R/3 e o SAP@WebStudio:

Add         Cria objetos no R/3 (é executado somente uma vez para cada objeto)
Get         Lê os objetos do R/3
Check out   Bloqueia e lê os objetos do R/3
Check in    Envia os objetos alterados de volta ao R/3 e retira o bloqueio
Agradecimentos




OBRIGADO

Workshop its

  • 1.
    Workshop ITS Palestrantes: CarlosEduardo D. Ferreira Matheus Brito Faggioli
  • 2.
    Para que serveo ITS? Com o ITS os usuários da internet/intranet podem executar transações, módulos de funções e relatórios do R/3, com páginas html interativas.
  • 3.
    Arquitetura R/3 Cliente/Servidor Presentation SAPGUI Application Database
  • 4.
    Arquitetura R/3 Cliente/Servidor com ITS Presentation WEB BROWSER SAPGUI WEB SERVER Internet Transaction Server Application Database
  • 5.
    Hardware e Software Web ITS R/3 Server Web Browser SAP @Web Studio Web browser - Interface de componentes gráficos (GUI) para componentes de aplicação na Internet Web Server - Interface para o World Wide Web ITS (Internet Transaction - Link entre o WWW e o R/3 Server) Converte dados do R/3 em páginas HTML R/3 - Release 3.1 ou superior Internet Applications Components (IAC)
  • 6.
    Divisão do ITS ITS – consiste do wgate e do agate •Wgate – faz a comunicação com o http server •Agate – faz a comunicação com o R/3 server DIAG HTTP CGI TCP/ IP WGATE AGATE RFC Web browser HTTP R/3 ITS server application server Arquivos de HTML serviços business templates
  • 7.
    Visão geral dofuncionamento http://<server>/<path>/WGATE/ <serviço>/! Para cada serviço é criado um arquivo de serviço (extensão .srvc) no computador do Agate (na publicação) . Os templates do HTML business requeridos pela transações Web também são gravados no Agate. SAP@WebStudio permite fazer manutenções nas descrições de serviços e templates de HTML business. SU05 - Ferramentas - Administração - Manutenção de usuários - Usuário Internet Os dados do usuários são armazenados na tabela BAPIUSW01.
  • 8.
    Visão geral dofuncionamento Consiste de três componentes: •Transação R/3 especial para internet •Arquivo de serviço (service file) •Templates do HTML business Web Transaction: •Pode utilizar objetos de negócios da SAP (Bapi) •Deve exibir dados em telas simples •Deve ter sincronização com o ITS •Tratamento especial para F4 (matchcode/search help) •Pode ser utilizada pelos usuários da internet Templates do HTML business •Apresenta dados exibidos pelas telas do R/3 •Cada tela da transação deve ter um template, que será convertido em uma página html em tempo de execução.
  • 9.
    Visão geral dofuncionamento HTTP ITS R/3 server SAP@Web Studio MIME Serviços Templates Textos Projeto BC440 •Possui wizards que ajudam na criação de novos objetos •Possibilita que todos os objetos criados sejam repassados para o R/3 Workbench Organizer e consequentemente transportados. •Componente da instalação do ITS •É instalado no desktop
  • 10.
    Visão geral dofuncionamento <body> <form action = `wgate()`> Program SAPBC440 .... Screen Number 100;200 <body> Service BC440 Theme 99 Language <demo> Templates do Logon R/3 HTML Busines SAP@We SAP@ bStudio R/3
  • 11.
    Tema Tema é recursonecessário quando se tem diferentes layouts das telas de uma mesma Webtransaction. ITS (Agate) GLOBAL (srvc) BC440demo (srvc) 50 SAPBC440_100.html SAPBC440_200.html ... ... 99 SAPBC440_100.html SAPBC440_200.html ... ...
  • 12.
    Linguagem HTML Business • Éum enhancement para inserir dados do R/3 nas páginas HTML • Provem transferência de dados dos formulários HTML para o R/3 • Similar a programação em C • Utilizados nas página HTML e os comandos são escritos entre ` ` (crase)
  • 13.
    Linguagem ITS é oprograma CGI para input via HTML <form action=`wgateURL()`> <input type=text name=CUSTOMER ...> <select name=CARRID> <Option value=“LH”> Lufthansa ... </select> <input type=radio name=DURATION ...> <input type=CHECKBOX name=NONSTOP...> <input type=SUBMIT ...> </form> Convertendo dados no Agate em tempo de execução (exemplo): Action= “/scripts/wgate/XY/....”
  • 14.
    Linguagem HTML Form Tela R/3 Nome Meyer Nome Senha ******* AGATE Senha Duração Duração 4 horas 12 horas Vôos diretos Outros ITS Somente Vôos diretos
  • 15.
    Linguagem Template Tela R/3 <input type=submit name=“~OKCODE=DISP” DISP Nome Meyer value=“#display”> value=“#display”> abap Senha Duração 12 Vôos X diretos LH Cia Aérea Query string (exemplo) ~OKCODE=DISP=display R/3 < a href = "`wgateURL(~Okcode="DISP")`"> `#display` </a>
  • 16.
    Funções • wgateURL() -cria URL para formulários e hyperlinks • mimeURL() - Integra objetos MIME que estão armazenados no arquivo de sistema do Wgate • archiveURL() - inclui objetos de uma arquivo de sistema | XOS • assert() - exibe o texto ERROR ao lado do campo cujo valor é inválido no R/3 <form action = "`wgateURL()`"> <input type=text name=ID> `assert(ID)` <input type=text name=DATE> `assert(DATE)` </form> <p> `~messageLine` ~messageLine = captura a mensagem de erro que aparece na barra de status da tela do R/3 ~errorMaker = variável do serviço que contém o valor que será exibido no texto de erro.
  • 17.
    Condicionais `if (SCARR-CARRID =="LH") ` <em> Lufthansa </em> `else` <font color = "blue"> Other Carrier </font> `end` `if (SPFLI-CITYFROM == "New York") ` <em> Empire State Building </em> `elseif (SPFLI-CITYFROM == "London") ` <em> Tower Bridge </em> `elseif (SPFLI-CITYFROM == ...) ` ... `end`
  • 18.
    Objetos MIME <img src="`mimeurl(...)`"> Objetos Mime: - Podem ser imagens, sons, vídeos. - São armazenados no HTTP server - São dependentes da linguagem e tema MimeURL( [~service = <serviço>, ] [~theme =<tema>, ] [~language =<linguagem>,] ~name =<nome>) < img src="`mimeURL( ~name = "plane.gif", ~language = "DE")`">
  • 19.
    Objetos MIME ITS (Agate) Hierarquia no arquivo do Wgate GLOBAL (srvc) 1- Serviço BC440demo (srvc) 2- Tema 99 3- Linguagem DE 4 - Nome da imagem Plane.gif Imagens podem ser armazenadas BC440demo (srvc) em qualquer nível 99 DE Plane.gif EN Plane.gif
  • 20.
    MACROS • Como oITS não enxerga o comando F4 de help do R/3, teremos que codificá-lo. Para isso podemos utilizar macros já pré-definidas para isso • Os dados são transportados entre o ITS e R/3 via RFC • Campos, tabelas internas e objetos Mime são enviados para o ITS dentro do evento PBO • Campos de contexto do ITS e os objetos Mime são lidos do ITS dentro do evento PAI Macros para Help F4 Field-set e field-transport são definidas no include AVWRTCXM
  • 21.
    Carrid AA Carrname American Airlines MACROS AC Air Canada AF Air France ... ... UA United Airlines SCARR counter = 1. Contexto Loop at itab. FIELD-SET ‘CARRID’ counter itab-carrid. RFC FIELD-SET ‘CARRNAME’ counter itab-carrname. ITS Add 1 to counter. Endloop. Field-transport.
  • 22.
    MACROS Carrid Carrname 1 AA American Airlines American Airlines 2 AC Air Canada Air Canada 3 AF Air France Air France ... ... ... ... Dim UA United Airlines United Airlines <select name = SCARR-CARRID> Contexto `repeat with i from 1 to CARRID.dim` <option value= `CARRID[i]`”> `CARRNAME[i]` ITS `end` </select>
  • 23.
    FRAMES <frame name="F1" src="`wgateURL(~frameName=F1)`"> Sincronizaçãocom Frames - Código ABAP MODULE ... INPUT . " Sync_itab like DDIC structure SITSSYNC save_ok_code = ok_code. Clear ok_code. Case save_ok_code(4). ... when ' AWSS'. Call function 'ITS_GET_SYNC_INFO' Tables SYNC_INFO = SYNC_ITAB. Endcase. ENDMODULE. OBS: Função ITS_GET_SYNC_INFO resulta em uma tabela interna contendo a atribuição de área de subtelas e telas para o ITS.
  • 24.
    TRANSPORTE DEV QA PRD Add Check Check Get out in Todos os transportes entre o R/3 e o ITS são feitos via SAP@WebStudio. Existem 4 tipos de transporte entre o R/3 e o SAP@WebStudio: Add Cria objetos no R/3 (é executado somente uma vez para cada objeto) Get Lê os objetos do R/3 Check out Bloqueia e lê os objetos do R/3 Check in Envia os objetos alterados de volta ao R/3 e retira o bloqueio
  • 25.