Histórico da Página
...
Integrando sua widget com armazenamento de dados.
Interno (Formulários)
Armazenamento
Frequentemente é necessário armazenar dados além daqueles que a plataforma Fluig já guarda nativamente e não faz sentido esperar que toda pessoa que precisar de tal recurso tenha de saber ou contratar alguém que saiba configurar novas tabelas no banco de dados. Pensando nisso, o Fluig disponibiliza uma forma de guardar seus dados de forma simples e ágil. Estamos falando da customização de formulários.
É um recurso valioso do Fluig e preparado para realizar soluções completas e complexas. Entretanto pode ser usado de forma bastante descomplicada para atender a demandas mais simples. Utilizando datasets, o processo de armazenamentos de seus dados torna-se rápido. Imagine que você deseja guardar o nome, dia e mês do aniversário do colaboradores de sua empresa. Considere os passos abaixo:
- Siga os passos para criar um formulário
- No arquivo html do formulário inclua três campos (para detalhamento na forma de apresentação, veja na sessão controles visuais):
Bloco de código | ||
---|---|---|
| ||
<form name="form" role="form">
...
<input name="newTitle" id="newTitle">
...
<input name="newDescription" id="newDescription">
...
<input name="newsSourceURL" id="newsSourceURL">
...
</form>
|
Feito isso, basta agora seguir os passos de exportação de um artefato Fluig para um Servidor Fluig e seu formulário já estará pronto para armazenamento. Por padrão, os formulário localizam-se em Documentos / Formulários Fluig. Seu formulário se encotrará lá exibindo o nome escolhido no momento da criação.
Utilização
Com seu formulário pronto e alimentado com os dados desejados, basta buscar a identificação do seu formulário no início do arquivo javascript. Em posse da identidade do registro, é simples buscar os dados desse. Em seu arquivo .js execute uma chamada ao DatasetFactory. Abaixo um exemplo simples:
Bloco de código | ||
---|---|---|
| ||
var datasetReturned = DatasetFactory.getDataset({codigo-do-seu-formulario}, null, null, null); |
Onde:
Elemento | Descrição |
---|---|
datasetReturned | Objeto contendo os registros do formulário retornados |
{codigo-do-seu-formulario} | Código escolhido para o seu formulário (definido aqui ) |
O consumo desses registros pode ser efetuado da seguinte forma:
Bloco de código | ||
---|---|---|
| ||
if(datasetReturned != null && datasetReturned.values != null && datasetReturned.values.length > 0){
var records = datasetReturned.values;
for (var index in records) {
var record = records[index];
// ... restanto do código omitido
}
} |
Onde:
Elemento | Descrição |
---|---|
datasetReturned | Objeto contendo os registros do formulário retornados |
records | Um array de objetos ( Object[ ] ) contendo os registros |
index | Índice do registro corrente conforme o laço (for) avança pelo array |
record | É o registro, ou seja, o Objeto contendo as propriedades de um registro de formulário. Considerando o exemplo do formulário de notícias, podemos assumir para esse caso que as propriedades desse objeto serão as seguintes:
|
Externo (REST)
Para obter dados de uma fonte externa ao seu sistema, a forma mais aconselhável é via chamada REST. Vamos criar um rest dentro da própria widget, para isso devemos seguir alguns passos.
Primeiro devemos criar uma classe chamada ApplicationConfig que extende a classe Application.
Bloco de código | ||
---|---|---|
| ||
package com.fluig.kitintranet.news.proxy.rest.config;
import javax.ws.rs.ApplicationPath;
import javax.ws.rs.core.Application;
@ApplicationPath("api/rest")
public class ApplicationConfig extends Application{
//não é necessário código, precisamos apenas para o @ApplicationPath
} |
Em seguida devemos criar a classe REST que desejamos acessar.
Bloco de código | ||
---|---|---|
| ||
package com.fluig.kitintranet.news.proxy.rest;
import com.totvs.technology.wcm.sdk.rest.WCMRest;
import javax.ws.rs.Consumes;
import javax.ws.rs.POST;
import javax.ws.rs.Path;
import javax.ws.rs.Produces;
import javax.ws.rs.core.MediaType;
import javax.ws.rs.core.Response;
@Path("/news")
public class NewsRest extends WCMRest {
@POST
@Path("feed")
@Produces(MediaType.APPLICATION_JSON)
@Consumes(MediaType.APPLICATION_JSON)
public Response getRSSFeedTest(String requestParams) {
//código
}
} |
Em seguida temos de alterar os arquivos jboss-web.xml
Bloco de código | ||
---|---|---|
| ||
<?xml version="1.0" encoding="UTF-8"?>
<jboss-web>
<context-root>/news</context-root>
<disable-cross-context>false</disable-cross-context>
<security-domain>TOTVSTech</security-domain>
<security-role>
<role-name>user</role-name>
<principal-name>totvstech</principal-name>
</security-role>
<security-role>
<role-name>totvstech</role-name>
<principal-name>totvstech</principal-name>
</security-role>
<security-role>
<role-name>sysadmin</role-name>
<principal-name>wcmadmin</principal-name>
</security-role>
<security-role>
<role-name>admin</role-name>
<principal-name>wcmadmin</principal-name>
</security-role>
<valve>
<class-name>com.totvs.technology.auth.saml.TOTVSAuthenticatorValve</class-name>
</valve>
</jboss-web> |
Também temos de alterar o arquivo web.xml para que possamos acessar esse REST.
Bloco de código | ||
---|---|---|
| ||
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
version="3.0">
<session-config>
<session-timeout>
30
</session-timeout>
</session-config>
<!-- REST -->
<security-constraint>
<display-name>REST</display-name>
<web-resource-collection>
<web-resource-name>REST</web-resource-name>
<description>REST</description>
<url-pattern>/api/rest/*</url-pattern>
</web-resource-collection>
<auth-constraint>
<description>REST</description>
<role-name>user</role-name>
</auth-constraint>
</security-constraint>
<login-config>
<auth-method>FORM</auth-method>
<realm-name>TOTVSTech</realm-name>
<form-login-config>
<form-login-page>/login.jsp</form-login-page>
<form-error-page>/loginfail.jsp</form-error-page>
</form-login-config>
</login-config>
<security-role>
<role-name>totvstech</role-name>
</security-role>
<security-role>
<role-name>user</role-name>
</security-role>
<security-role>
<role-name>sysadmin</role-name>
</security-role>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app> |
Após isso estamos capazes de utilizar o REST que se encontra dentro da widget utilizando um método chamado WCMAPI.Read que iremos utilizá-lo para fazer chamadas REST.
Bloco de código | ||
---|---|---|
| ||
var that = this;
WCMAPI.Read({
type: "POST",
url: WCMAPI.getServerURL() + '/news/api/rest/news/feed',
async: true,
data: feed,
success: function funcao(data) {
that.appendNews(data.content.channel.items);
},
error: function () {
that.showLoadingError();
}
}); |
O método WCMAPI.getServerURL() traz a url do server que utilizaremos para montar a url da chamada rest. Em seguida concatenamos o caminho do REST que pretendemos chamar, neste caso utilizamos o seguinte caminho '/news/api/rest/news/feed'. Sendo:
'/news' o código da widget.
'/api/rest' é o @Path da classe ApplicationConfig.java.
'/news' é o @Path da classe NewsRest.java.
Para aprender a integrar sua widget com fomulários do Fuig, siga este guia.
Externo utilizando serviços REST
Para fazer a integração de sua widget com serviços REST, siga este guia.
Externo utilizando serviços SOAP
Para fazer a integração com serviços SOAP, basta seguir este guia'/feed' é o @Path do método que desejamos chamar da classe NewsRest.java.
Exportar a widget no servidor Fluig
...