Configurando o ContextHub

O ContextHub é uma estrutura para armazenar, manipular e apresentar dados de contexto. Para obter mais detalhes sobre o ContextHub, consulte a documentação do desenvolvedor. O ContextHub substitui Contexto do cliente na interface de usuário de toque.

Configure a barra de ferramentas ContextHub para controlar se ela aparece no modo de Pré-visualização, para criar armazenamentos do ContextHub e adicionar módulos de interface usando a interface otimizada ao toque.

Desabilitando o ContextHub

Por padrão, o ContextHub está ativado em uma instalação AEM. O ContextHub pode ser desabilitado para impedir que ele carregue js/css e inicialize. Há duas opções para desativar o ContextHub:

  • Edite a configuração do ContextHub e marque a opção Desativar o ContextHub

    1. No painel, clique ou toque em Ferramentas > Sites > ContextHub
    2. Clique ou toque no Container de configuração padrão
    3. Selecione Configuração do ContextHub e clique ou toque em Editar Elemento Selecionado
    4. Clique ou toque em Desativar ContextHub e clique ou toque em Salvar

ou

  • Use a CRXDE Lite para definir a propriedade disabled como true em /libs/settings/cloudsettings
OBSERVAÇÃO

Devido à reestruturação do repositório no AEM 6.4, o local das configurações do ContextHub mudou de /etc/cloudsettings para:

  • /libs/settings/cloudsettings
  • /conf/global/settings/cloudsettings
  • /conf/<tenant>/settings/cloudsettings

Mostrar e ocultar a interface do usuário do ContextHub

Configure o serviço OSGi do Adobe Granite ContextHub para mostrar ou ocultar a interface do usuário do ContextHub em suas páginas. O PID deste serviço é com.adobe.granite.contexthub.impl.ContextHubImpl.

Para configurar o serviço, você pode usar o Console da Web ou usar um nó JCR no repositório:

  • Console da Web: Para mostrar a interface do usuário, selecione a propriedade Mostrar interface do usuário. Para ocultar a interface do usuário, limpe a propriedade Ocultar interface do usuário.
  • nó JCR: Para mostrar a interface do usuário, defina a com.adobe.granite.contexthub.show_ui propriedade booleana como true. Para ocultar a interface do usuário, defina a propriedade como false.

Ao mostrar a interface do usuário do ContextHub, ela só aparece nas páginas AEM instâncias do autor. A interface do usuário não aparece nas páginas das instâncias de publicação.

Adicionando módulos e módulos de interface do usuário do ContextHub

Configure os modos e módulos de interface que aparecem na barra de ferramentas do ContextHub no modo de Pré-visualização:

  • Modos da interface: Grupos de módulos relacionados
  • Módulos: Widgets que expõem dados de contexto de uma loja e permitem que os autores manipulem o contexto

Os modos de interface são exibidos como uma série de ícones no lado esquerdo da barra de ferramentas. Quando selecionados, os módulos de um modo de interface aparecem à direita.

chlimage_1-319

Os ícones são referências da biblioteca de ícones IU Coral.

Adicionando um modo de interface

Adicione um modo de interface para agrupar módulos ContextHub relacionados. Ao criar o modo de interface do usuário, você fornece o título e o ícone exibidos na barra de ferramentas do ContextHub.

  1. No painel Experience Manager, clique ou toque em Ferramentas > Sites > Context Hub.

  2. Clique ou toque no Container de configuração padrão.

  3. Clique ou toque em Configuração do Context Hub.

  4. Clique ou toque no botão Criar e, em seguida, clique ou toque em Modo de interface do usuário do Context Hub.

    chlimage_1-320

  5. Forneça valores para as seguintes propriedades:

    • Título do modo da interface do usuário: O título que identifica o modo da interface do usuário
    • Ícone Modo: O seletor para o ícone IU Coral a ser usado, por exemplo coral-Icon--user
    • Ativado: Selecione para mostrar o modo da interface na barra de ferramentas do ContextHub
  6. Clique ou toque em Salvar.

Adicionando um módulo de interface

Adicione um módulo de interface do ContextHub a um modo de interface do usuário para que ele apareça na barra de ferramentas do ContextHub para visualizar o conteúdo da página. Ao adicionar um módulo de interface, você está criando uma instância de um tipo de módulo que está registrado no ContextHub. Para adicionar um módulo de interface, é necessário saber o nome do tipo de módulo associado.

AEM fornece um tipo de módulo de interface de usuário base, além de vários tipos de exemplo de módulo de interface de usuário nos quais você pode basear um módulo de interface de usuário. A tabela a seguir fornece uma breve descrição de cada uma. Para obter informações sobre como desenvolver um módulo de interface personalizado, consulte Criando módulos de interface do usuário do ContextHub.

As propriedades do módulo de interface incluem uma configuração detalhada na qual você pode fornecer valores para propriedades específicas do módulo. Você fornece a configuração detalhada no formato JSON. A coluna Tipo de módulo na tabela fornece links para informações sobre o código JSON necessário para cada tipo de módulo de interface.

Tipo de módulo Descrição Armazenar
contexthub.base Um tipo de módulo de interface genérica Configurado nas propriedades do módulo da interface do usuário
contexthub.browserinfo Exibe informações sobre o navegador surferinfo
contexthub.datetime Exibe informações de data e hora datetime
contexthub.device Exibir o dispositivo cliente emuladores
contexthub.location Exibe a latitude e a longitude do cliente, bem como o local em um mapa. Permite alterar o local. geolocalização
contexthub.screen-orientation Exibe a orientação da tela do dispositivo (paisagem ou retrato) emuladores
contexthub.tagcloud Exibe estatísticas sobre tags de página tagcloud
granite.perfil Exibe as informações do perfil para o usuário atual, incluindo authorizedID, displayName e familyName. Você pode alterar o valor de displayName e familyName. o perfil do visitante
  1. No painel Experience Manager, clique ou toque em Ferramentas > Sites > ContextHub.

  2. Clique ou toque no Container Configuração ao qual deseja adicionar um módulo de interface do usuário.

  3. Clique ou digite a Configuração do ContextHub à qual você deseja adicionar o módulo da interface.

  4. Clique ou toque no modo de interface do usuário ao qual você está adicionando o módulo de interface.

  5. Clique ou toque no botão Criar e, em seguida, clique ou toque em Módulo de interface do usuário do ContextHub (genérico).

    chlimage_1-321

  6. Forneça valores para as seguintes propriedades:

    • Título do módulo da interface do usuário: Um título que identifica o módulo da interface do usuário
    • Tipo de módulo: O tipo de módulo
    • Ativado: Selecione para mostrar o módulo da interface na barra de ferramentas do ContextHub
  7. (Opcional) Para substituir a configuração de armazenamento padrão, insira um objeto JSON para configurar o Módulo de interface.

  8. Clique ou toque em Salvar.

Criação de uma loja do ContextHub

Crie um repositório do Context Hub para manter os dados do usuário e acessar os dados conforme necessário. As lojas do ContextHub são baseadas em candidatos a lojas registradas. Ao criar a loja, você precisa do valor de storeType com o qual o candidato da loja foi registrado. (Consulte Criando Candidatos à Loja Personalizada.)

Configuração de armazenamento detalhada

Quando você configura uma loja, a propriedade Configuração de detalhes permite que você forneça valores para propriedades específicas da loja. O valor é baseado no parâmetro config da função init do armazenamento. Portanto, se você precisa fornecer esse valor e o formato do valor depende da loja.

O valor da propriedade Detail Configuration é um objeto config no formato JSON.

Amostra de candidatos à loja

AEM fornece os seguintes candidatos de armazenamento de amostra nos quais você pode basear uma loja.

Tipo de armazenamento Descrição
aem.segmentation Armazenar para segmentos do ContextHub resolvidos e não resolvidos. Recupera automaticamente segmentos do ContextHub SegmentManager
aem.resolvedsegmentos Armazena os segmentos resolvidos no momento. Escuta o serviço ContextHub SegmentManager para atualizar automaticamente a loja
contexthub.geolocation Armazena a latitude e a longitude do local do navegador.
contexthub.datetime Armazena a data, a hora e a estação atuais para o local do navegador
granite.emuladores Define as propriedades e os recursos de vários dispositivos e detecta o dispositivo cliente atual
contexthub.generic-jsonp Recupera e armazena dados de um serviço JSONP
granite.perfil Armazena dados do perfil para o usuário atual
contexthub.surferinfo Armazena informações sobre o cliente, como informações do dispositivo, tipo de navegador e orientação da janela
contexthub.tagcloud Armazena tags de página e contagens de tags
  1. No painel Experience Manager, clique ou toque em Ferramentas > Sites > ContextHub.

  2. Clique ou toque no container de configuração padrão.

  3. Clique ou toque em Configuração do Contexthub

  4. Para adicionar uma loja, clique ou toque no ícone Criar e, em seguida, clique ou toque em Configuração da Loja ContexHub.

    chlimage_1-322

  5. Forneça valores para as propriedades de configuração básicas e clique ou toque em Avançar:

    • Título da configuração: o título que identifica a loja
    • Tipo de Armazenamento: O valor da propriedade storeType do candidato de armazenamento no qual basear a loja
    • Obrigatório: Selecionar
    • Ativado: Selecione para ativar a loja
  6. (Opcional) Para substituir a configuração de armazenamento padrão, digite um objeto JSON na caixa Configuração de detalhes (JSON).

  7. Clique ou toque em Salvar.

Exemplo: Usando um serviço JSONP

Este exemplo ilustra como configurar uma loja e exibir os dados em um módulo de interface do usuário. Neste exemplo, o serviço MD5 do site jsontest.com é usado como uma fonte de dados para uma loja. O serviço retorna o código de hash MD5 de uma determinada string, no formato JSON.

Um repositório contexthub.generic-jsonp está configurado de modo que armazene dados para a chamada de serviço https://md5.jsontest.com/?text=%22text%20to%20md5%22. O serviço retorna os seguintes dados exibidos em um módulo de interface do usuário:

{
   "md5": "919a56ab62b6d5e1219fe1d95248a2c5",
   "original": "\"text to md5\""
}

Criação de uma loja contexthub.generic-jsonp

O candidato do repositório de amostra contexthub.generic-jsonp permite recuperar dados de um serviço JSONP ou de um serviço da Web que retorna dados JSON. Para o candidato a esta loja, use a configuração da loja para fornecer detalhes sobre o serviço JSONP a ser usado.

A função init da classe ContextHub.Store.JSONPStore Javascript define um objeto config que inicializa este candidato de armazenamento. O objeto config contém um objeto service que inclui detalhes sobre o serviço JSONP. Para configurar a loja, forneça o objeto service no formato JSON como o valor da propriedade Detail Configuration.

Para salvar dados do serviço MD5 do site jsontest.com, use o procedimento em Criação de uma loja do ContextHub usando as seguintes propriedades:

  • Título da configuração: md5

  • Tipo de loja: contexthub.generic-jsonp

  • Obrigatório: Selecionar

  • Ativado: Selecionar

  • Configuração detalhada (JSON):

    {
     "service": {
     "jsonp": false,
     "timeout": 1000,
     "ttl": 1800000,
     "secure": false,
     "host": "md5.jsontest.com",
     "port": 80,
     "params":{
     "text":"text to md5"
         }
       }
     }
    

Adicionando um módulo de interface para o md5 Data

Adicione um módulo de interface à barra de ferramentas do ContextHub para exibir os dados armazenados no armazenamento md5 de exemplo. Neste exemplo, o módulo contexthub.base é usado para produzir o seguinte módulo de interface:

chlimage_1-323

Use o procedimento em Adicionar um módulo de interface para adicionar o módulo de interface a um modo de interface de usuário existente, como o exemplo de Modo de interface de usuário Perona. Para o Módulo de interface, use os seguintes valores de propriedade:

  • Título do módulo de interface: MD5

  • Tipo de módulo: contexthub.base

  • Configuração detalhada (JSON):

    {
     "icon": "coral-Icon--data",
     "title": "MD5 Converstion",
     "storeMapping": { "md5": "md5" },
     "template": "<p> {{md5.original}}</p>;
                  <p>{{md5.md5}}</p>"
    }
    

Depuração do ContextHub

Um modo de depuração do ContextHub pode ser habilitado para permitir a solução de problemas. O modo de depuração pode ser ativado pela configuração do ContextHub ou pelo CRXDE.

Através da Configuração

Edite a configuração do ContextHub e marque a opção Depurar

  1. No painel, clique ou toque em Ferramentas > Sites > ContextHub
  2. Clique ou toque no Container de configuração padrão
  3. Selecione Configuração do ContextHub e clique ou toque em Editar Elemento Selecionado
  4. Clique ou toque em Depurar e clique ou toque em Salvar

Via CRXDE

Use a CRXDE Lite para definir a propriedade debug como true em:

  • /conf/global/settings/cloudsettings ou
  • /conf/<tenant>/settings/cloudsettings
OBSERVAÇÃO

Para configurações do ContextHub ainda localizadas em seus caminhos herdados, o local para definir debug property é /libs/settings/cloudsettings/legacy/contexthub.

Modo silencioso

O modo silencioso suprime todas as informações de depuração. Ao contrário da opção de depuração normal, que pode ser definida independentemente para cada configuração do ContextHub, o modo silencioso é uma configuração global que tem precedência sobre qualquer configuração de depuração no nível de configuração do ContextHub.

Isso é útil para a sua instância de publicação, onde você não quer nenhuma informação de depuração. Como é uma configuração global, ela é ativada via OSGi.

  1. Abra a Configuração do Adobe Experience Manager Web Console em http://<host>:<port>/system/console/configMgr
  2. Procure Adobe Granite ContextHub
  3. Clique na configuração Adobe Granite ContextHub para editar suas propriedades
  4. Marque a opção Modo silencioso e clique em Salvar

Recuperando configurações do ContextHub após atualizar

Quando uma atualização para AEM é executada, o backup das configurações do ContextHub é feito e armazenado em um local seguro. Durante a atualização, as configurações padrão do ContextHub são instaladas, substituindo as existentes. O backup é necessário para preservar quaisquer alterações ou adições feitas.

As configurações do ContextHub são armazenadas em uma pasta chamada contexthub nos seguintes nós:

  • /conf/global/settings/cloudsettings
  • /conf/<tenant>/settings/cloudsettings

Após uma atualização, o backup é armazenado em uma pasta chamada contexthub abaixo de um nó chamado:

/conf/global/settings/cloudsettings/default-pre-upgrade_yyyymmdd_xxxxxxx ou
/conf/<tenant>/settings/cloudsettings/default-pre-upgrade_yyyymmdd_xxxxxxx

A parte yyyymmdd do nome do nó é a data em que a atualização foi realizada.

Para recuperar suas configurações do ContextHub, use o CRXDE Lite para copiar os nós que representam suas lojas, modos de interface e módulos de interface do usuário de abaixo do nó default-pre-upgrade_yyyymmdd_xxxxxx para abaixo:

  • /conf/global/settings/cloudsettings ou
  • /conf/<tenant>/settings/cloudsettings

Nesta página

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free