terça-feira, 20 de agosto de 2019

Configuração do REST

Sempre "RESTa" algum algum detalhe que enrosca na hora de usar o REST.

Toda vez que tenho que programar uma chamada REST sempre acabo enroscando em algum pelinho e lá se vai o precioso tempo e a paciência. Desta vez, máquina nova, IIS ainda não totalmente configurado, primeiro um erro 500.19 resolvido com o URLRewrite, e em seguida um chato e persistente erro 404.

Desta vez, nem mesmo os artigos 'antigos' do Genexando deram conta de me ajudar, rs. Estavam certo, mas faltava a configuração do ambiente.

Resolvi assim:

1) Configurar o IIS, em Ativar ou Desativar Recursos do Windows.
2) Instalar o URL Rewrite
3) Ligar o Windows Communication Foundation (era isso que não estava ok)


Para testar o REST utilizo o programa POSTMAN.

1) Configurei o POSTMAN, com POST, a palavra REST e sem o tradicional .aspx no final, fiz isso para uma procedure.



2) Definir o Content-type para application/json.


3) Definir no BODY, um JSON para passar o parâmetro para a procedure, mesmo sendo uma variável simples, o parâmetro deve ter formato de JSON.

4)  Escrever a procedure normalmente, com regra Parm.


5) As propriedades da procedure devem ser:

6) Finalmente, compilado e configurado no POSTMAN, o resultado, depois de algum tempo enroscado no Windows WFC, veio a tão esperada resposta.

Os demais artigos 'complementam' o que estava faltando neste.
Estou meio enferrujado.

sábado, 7 de outubro de 2017

Bootstrap Navbar

Nosso artigo Menu Recursivo foi o que trouxe a maior repercussão no Genexando ao longo dos anos, pois foram mais de 12 mil visualizações desde sua concepção em 2010, e ainda é procurado. Casos de sucesso, mais que comemorados, devem nos servir para apontar o interesse da nossa pequena comunidade, sendo assim, vamos revisitar o conceito do menu, agora com mais recursos.

O fato é que desde 2010, algumas coisas mudaram no mundo Genexus. Olhando nosso artigo, já ancião, chegamos à conclusão que ele já não se encaixa mais na nova geração de aplicações. O User Control JsCookMenu com certeza foi um sucesso nas nossas aplicações, agradecimentos ao Daniel Coellar, mas hoje, com o advento da responsividade, Bootstrap e outros, ficou no passado.

A pergunta é, como montar um menu para nossa aplicação? Creio que a pergunta já indicaria um caminho, pois, atualmente as aplicações se suportam sobre um tipo distinto de menu: Navbar, e neste sentido, temos um pequeno problema, pois Genexus não oferece um User Control que faça isso nativamente.


Este controle, ao ser apresentado em uma MasterPage, por exemplo, permitiria acessar às interfaces do sistema, por meio de uma barra superiora, visualmente bem formatada e visivel.

Bootstrap

Um caminho para se chegar ao Navbar é utilizar as classes nativas do Bootstrap, que disponibiliza um componente muito simples para se construir a barra (mais informações aqui), baseado em tags e classes do framework. É um mecanismo muito simples, porém envolve HTML e CSS.

Nem todos controles Bootstrap poderemos construir com a estratégia simplificada que estaremos apresentando neste artigo, porém, Navbar cabe perfeitamente, porque o que deveremos criar são textos com links, não havendo a necessidade de retornar alguma coisa ao Genexus ou mesmo controlar eventos.

A implementação de User Controls sempre será a melhor opção, e já oferecemos nossa contribuição à comunidade, pois os argumentos em seu benefício seriam a reutilização em projetos com facilidade, a possibilidade de comunicação e retorno de eventos. E o lado negativo dos controles é, em meu ponto de vista, a rigidez visual ou operacional implementada no código, que é muito difícil de ajustar. O fato é que para criar um User Control, precisaremos estudar um pouco, umas 500 páginas, e depois que se aprende poderemos dizer que é simples, mas para um contato inicial soa bastante complexa a quantidade de definições e detalhes.

Temos, por outro lado a possibilidade de implementar código HTML diretamente na nossa interface, e para isso somente precisamos de um único controle Textblock, definido como HTML. Poderíamos buscar outras metodologias mais ‘bonitinhas’, mas vamos simplificar um pouco aqui.

Desta forma, vamos, neste exemplo implementar um Navbar com Bootstrap e Textblock, e para incluir uma cerejinha no topo, GAM Menu.

GAM Menu

Outro recurso que nasceu foi o GAM Menu, um mecanismo que permite criar o menu do sistema com as permissões do próprio GAM. Isto foi implementado no Genexus 15. Aqui alguns links que tratam do assunto, inclusive um que liga o GAM Menu com o JsCookMenu (muito interessante!):
No GAM Menu deveremos criar uma lista de itens, associando a cada um deles o link correspondente à uma permissão do GAM. Isto se faz no GAMHome - Applications - Menu - Add

A permissão é uma referência a uma interface na Kb. Por exemplo build_Execute é a permissão ao objeto build (WebPanel), e cada item do Menu deverá apontar para uma permissão.


Não vou gastar muita energia explicando tudo isso, porque GAM é um dos temas mais documentados de Genexus, basta acessar ao Wiki e terá muita documentação à sua disposição.

O que deveremos fazer, neste exemplo, é acessar os itens definidos no nosso menu GAM, e para isso necessitaremos de algumas coisas, a primeira é o GUID da nossa aplicação, e também o GUID do nosso menu. 

Ambos os valores são gerados quando criamos um novo Menu e quando aplicamos o GAM à nossa Kb. Poderemos obter o ApplicationId via programação, mas também, se você não tiver muita paciência para programar o GAM, pegar o valor diretamente nas Preferences da Kb e no GAMHome, e fixar no código.


Via programação, o &ApplicationGUID pode ser obtido pela sessão do usuário conectado na aplicação e o &MenuGUID, a partir da GAMApplication identificada. O problema é se houver mais que um menu associado à aplicação, então teremos que alterar o item(1), para se apontar para o menu correto.

GAMDefinitions:
Rules:
parm(&ApplicationGUID, &MenuGUID);

Source:
&GAMSession = GAMSession.Get(&GAMErrors)
for &GAMApplication in  &GAMRepository.GetApplications(&GAMApplicationFilter, &GAMErrors)
 if &GAMSession.ApplicationId = &GAMApplication.Id
  exit
 endif
endfor
&ApplicationGUID = &GAMApplication.GUID

&GAMApplicationMenus = &GAMApplication.GetMenus(&GAMApplicationMenuFilter, &GAMErrors)
if &GAMApplicationMenus.Count>0
  &MenuGUID = &GAMApplicationMenus.Item(1).GUID.ToString()
endif

A seguir as variáveis utilizadas no programa.


Programamos esta operação em uma procedure que chamamos de GAMDefinitions. E esta é chamada antes de se obter o menu, com outra operação simples, veja a seguir.

GAMDefinitions(&ApplicationGUID, &MenuGUID)
&GAMMenuOptionList = GAMRepository.GetApplicationMenu(&ApplicationGUID, &MenuGUID, &GAMErrors)

Onde &GAMMenuOptionList é a lista de itens do menu, (do tipo GAMMenuOptionList). Neste objeto temos uma opção Nodes com a definição de todos os itens do menu.

Criando o NavBar

A criação do NavBar é um pouco estranha, porque teremos que definir uma estrutura HTML e incluir nesta nossos itens de Menu. Programei uma procedure chamada Navbar, com o seguinte conteúdo

Navbar:
Rules:
parm(&Menu);

Source:
//navbar
&Menu  = '<div class="container-fluid">'
&Menu += ' <nav class="navbar navbar-default navbar-fixed-top " role="navigation">'

// collapse menu, 
&Menu += '  <div class="navbar-header navbar-left pull-left" style="">'
&Menu += '   <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">'
&Menu += '    <span class="icon-bar" ></span>'
&Menu += '    <span class="icon-bar" ></span>'
&Menu += '    <span class="icon-bar" ><span>'
&Menu += '   </button>'
&Menu += '   <a class="navbar-brand" href="#">logo</a>'
&Menu += '   <div class="navbar-brand">sistema</div>'
&Menu += '  </div>'

// barra do menu
&Menu += '  <div id="navbar" class="navbar-collapse collapse">'
do 'gammenu'
&Menu += '  </div>'

// encerramento
&Menu += ' </nav>'
&Menu += '</div>'

sub 'gammenu'
 GAMDefinitions(&ApplicationGUID, &MenuGUID)
 &GAMMenuOptionList = GAMRepository.GetApplicationMenu(&ApplicationGUID, &MenuGUID, &GAMErrors)
  NavbarItens(&GAMMenuOptionList, &Menu)
endsub

Em negrito destacamos a parte dinâmica do menu, em si, na qual estaremos agregando os itens obtidos do GAM Menu.

As variáveis da procedure são apresentas a seguir.

Os diversos itens do Navbar são alcançados por uma outra procedure chamada NavBarItens que deve ser recursiva. Observe que antes do endfor, colocamos a chamada recursiva para pegar os itens associados ao elemento corrente.

NavbarItens:
Rules:
parm(&GAMMenuOptionList, &Menu);

Source:
for &GAMMenuOption in &GAMMenuOptionList.Nodes
 &link = &GAMMenuOption.Link.ReplaceRegEx(' ','')
 &Menu += '   <ul class="nav navbar-nav">'
 &Menu += '   <li class="nav navbar-item"><a href="'+&link+'">'+&GAMMenuOption.Name+'</a></li>'
 &Menu += '   </ul>'
 MenuSubGAM(&GAMMenuOption, &Menu)
endfor

A procedure recebe a variável &Menu (Longvarchar) e a passa para a MenuSubGAM, e cada chamada irá complementar o Navbar com o item no menu. Abaixo as variáveis programadas.


MasterPage

Para utilizar essa maluquice toda, precisaremos apenas de um Textblock, marcado como HTML, na MasterPage da nossa Kb.

Event Start
   textblock1.caption = Navbar()
Endevent  

O resultado será a apresentação do primeiro Menu definido no GAMHome com todas as suas opções vinculadas no NavBar.

Restrições

  • Neste primeiro exemplo não estamos tratando os submenus, ou seja, Dropdown que venham a ser vinculados a certo item de menu. E não fizemos isto porque não fica muito claro no GAM a identificação dos níveis de menus. Aguardemos as cenas dos próximos capítulos.
  • Este exemplo funciona naturalmente no Genexus 15, se for aplicado ao Genexus Ev3 a operação somente funcionará em modo Smooth.

XPZ

Antes de importar o xpz é necessário aplicar o GAM na sua Kb e em seguida definir a partir do GAMHome um menu para a sua aplicação. Se você não aplicar o GAM e também não definir o menu, a importação do mesmo causará erro.

O xpz com os exemplos apresentados encontra-se aqui.

Após a importação é necessário que altere a master page do seu sistema para o objeto NavbarMasterPage.





sábado, 30 de setembro de 2017

Parm & Json

Tem muita gente que não é chegada em queijo. Não podemos negar que é um super alimento, e devido aos diversos tipos existentes no mundo, podemos dizer que sempre existe um tipo que combina muito bem com qualquer coisa.

Neste artigo vamos explorar um pouco dos nossos dotes culinários (inexistente, no meu caso) e desenvolver uma nova receita com dois ingredientes: Parm para passagem e recebimento de parâmetros, e JSON um mecanismo de registro de informação e também para transferência de dados.

Nosso problema surge quando desejamos transmitir um JSON para um serviço REST, pois quando combinamos: SDT, PARM, REST teremos um pouco de dificuldade para se atingir o ponto ideal do prato.

Veremos que da combinação desses dois ingredientes simplesmente temos “o nascer de uma nova culinária internacional”, rs.

Parm

O primeiro ingrediente que iremos incluir na nossa receita é a regra parm, que já utilizamos pelo menos um milhão de vezes ao longo do tempo em que programamos o Genexus. Eu mesmo nunca parei para pensar como a coisa funcionava, a não ser que tínhamos que enviar o mesmo número e tipo de parâmetros entre os objetos para que ocorresse a correspondência entre eles.

Porém nesta altura do campeonato um novo cenário se consolidou, e com ele a necessidade de se pensar no parm de maneira totalmente diferente do que havíamos até então aprendido, e que havia sido deixado no canto, esquecido por aí, como aquela latinha de atum que está na despensa há mais ou menos três anos.

JSON

Já discutimos JSON aqui no Genexando em muitas ocasiões, não vamos tomar seu precioso tempo para aprofundar neste tema, pois nosso foco, aqui é apenas utilizá-lo para transferir algum tipo de informação estruturada entre sistemas.

{"nome":"Joao da Silva", "endereco":"Rua Um, 2", "cidade":"São Paulo"}

Para alcançar o JSON precisaremos em Genexus criar um SDT, e em seguida criar uma variável do mesmo tipo.


Uma vez carregado o conteúdo, poderemos formatar o conteúdo como JSON, mediante o ToJson().

&sdt.nome="Joao da Silva"
&sdt.endereco="Rua Um, 2"
&sdt.cidade="São Paulo"
&json = &sdt.tojson()

O resultado desta operação, como sabemos, é um texto formatado no padrão JSON, ou seja, saímos do conceito da variável SDT e passamos para texto simples.

A combinação que não funciona

Como na química e na culinária, temos certos elementos que não combinam, temos no Parm e no SDT uma difícil tarefa de encaixá-los.

Se tentarmos transmitir uma variável SDT como parâmetro em um objeto Web (WebPanel ou Transação) teremos um erro, informando que não é possível. E por outro lado, se fizermos a comunicação entre Procedures, este problema não aparecerá.

Esta restrição não é do Genexus, a própria Web na verdade não aceita que sejam passadas variáveis SDT, Vetores ou Coleções nas chamadas HTTP/S, quer seja por conta das dimensões limites do protocolo. Não é possível passagem por referência na Web, e a saída que todos propõem é a serialização da informação no formato JSON (ou XML), ou seja, transformar o conteúdo em texto.

Vamos ao Problema

Feitas as considerações iniciais, vamos à questão fundamental: Como transferir um JSON em chamadas REST, e recebendo-os como parâmetros, considerando, que teremos vários cenários distintos de linguagens e soluções que poderão ser utilizadas para consumir nosso serviço.

Primeiramente teremos que ter uma Procedure ou Data Provider configurado como REST, o que é muito simples fazer, pois teremos apenas que definir duas propriedades: Expose as Web Service = true, e REST Protocol = true.



Nosso objetivo é receber informações diretamente em uma variável SDT, o que vimos ser difícil de se implementar nas chamadas Web. Para isso será necessária uma regra Parm com nossa variável SDT. Neste caso &sdt é uma variável criada com um tipo SDT.


Vimos que esta operação é impossível de se realizar na Web, mas quando falamos REST estaremos submetendo informações para uma procedure, mas claro, de um sistema externo para nossa procedure.

Como fazer isso? Para se chamar uma procedure REST teremos que ter algum tipo de cliente, que pode ser, por exemplo, o Postman. Ao se programar uma chamada REST neste programa o que necessitamos é definir o Método (POST), a URL (http://localhost/teste/rest/wsrestexemplo), para a nossa procedure wsrestexemplo em construção (observe o /rest/ na URL). O Header indicando a passagem do tipo Content-Type: application/json e no Body a informação a ser postada no serviço.


No Body é que está o segredinho da nossa receita, pois deveremos combinar o nosso JSON original, com os dados que queremos transmitir:

{"nome":"douglas", "endereco":"Rua 1, 2", "cidade":"São Paulo"}

Com informações sobre a regra Parm do nosso serviço. Isso quer dizer que se programarmos uma regra Parm(in:&sdt) deveremos produzir outro JSON para representar a nossa variável de entrada &sdt. Estranho isso não?

{"sdt": ... }

A combinação das duas coisas nos leva a solução:

{"sdt": {"nome":"douglas", "endereco":"Rua 1, 2", "cidade":"São Paulo"} }

Ou seja, nosso cliente deverá reproduzir o nome da variável de entrada da Parm.

Recebendo parâmetros

E assim como enviamos, podemos receber também parâmetros, na própria regra Parm, como por exemplo uma variável texto &resposta.


O interessante é que o mesmo comportamento de Json de envio também aparece na mensagem de retorno, e se programarmos &resposta = 'retorno da mensagem '+&sdt.nome, teremos como retorno:

Ou seja, um JSON de retorno, que inicia com o nome da variável &retorno.


Em Genexus

Finalmente em Genexus, para se programar o cliente com o httpClient, deveremos adicionar no body o mesmo formato da chamada.

&service = 'wsrestexemplo'
&httpclient.Host = 'localhost/'
&httpclient.Port = 80
&httpclient.BaseUrl = '/teste/rest/'
&httpclient.AddHeader('content-type','application/json')
&body = '{"sdt":'+ &sdt.ToJson() +'}'
&httpclient.AddString(&body)
&httpclient.Execute('POST', &service)
if &httpclient.ErrCode<>200
   &retorno.FromJson(&httpclient.ToString())
endif


Voilá, nous avons notre chef-d'œuvre avec du parmesan

Ou em português claro, enfim, temos nossa obra prima com parmesão, ou melhor, com parm & json.

Bom, antes de fechar a conta, preciso confessar que essa receita, na verdade eu copiei de dois outros chefs famosos, o Bruno Camargo e o Gonzalo Gallotti, que já estavam curiosos com a culinária envolvendo parmesão. https://es.stackoverflow.com/questions/67187/webservice-rest-con-sdt-por-par%C3%A1metro


quinta-feira, 9 de março de 2017

Debug no Genexus

Debugar programas no Genexus é um desafio. A ferramenta sempre acaba enroscando em algum detalhe e quase sempre não executa a ação corretamente. É uma enorme frustração ao tentar debugar um programa, e no final das contas, muitos, inclusive eu, recorrem aos msg('passei aqui'), para tentar identificar o problema.

Depois de sofrer bastante para identificar o problema, a conclusão é que Genexus não tem muita culpa nessa história, pois a própria configuração do computador leva a esta chata situação.

A seguir os passos necessários para que o Debug execute em seu Genexus, sem maiores problemas. Ao que parece quem trava o Debug é o Firewall, e consegui resolver a questão com os seguintes passos.

  1. Desligar o Firewall, ou adicionar a exceção que bloqueia o programa Debug.
  2. Remover proteção UAC do Windows.
  3. Desligar o Genexus
  4. Abrir Genexus em modo administrador
  5. Definir modo DEBUG para a execução
  6. Abrir o programa desejado e incluir os breakpoints
  7. Executar o programa 
O passo (2) é meio incógnita, mas tive que fazer isso para que o Debug de fato operasse.

Fiz o teste no gerador .NET e Java e em ambas as situações o DEBUG abriu.