Show Menu
TÓPICOS×

Criação de sites para dispositivos móveis

A Adobe recomenda usar o Editor SPA para projetos que exigem renderização do lado do cliente baseada em estrutura de aplicativo de página única (por exemplo, Reagir). Saiba mais .
A criação de um site móvel é semelhante à criação de um site padrão, pois também envolve a criação de modelos e componentes. Para obter mais detalhes sobre como criar modelos e componentes, consulte as seguintes páginas: Modelos , componentes e introdução ao desenvolvimento de sites AEM. A principal diferença consiste em ativar as funcionalidades móveis incorporadas do AEM no site. Isso é feito criando um modelo que depende do componente de página móvel.
Você também deve considerar o uso do design Design responsivo para páginas da Web responsivo, criando um único site que acomoda vários tamanhos de tela.
Para começar, consulte o Site de demonstração do We.Retail Mobile disponível no AEM.
Para criar um site móvel, proceda da seguinte forma:
  1. Crie o componente de página:
    • Defina a sling:resourceSuperType propriedade como wcm/mobile/components/page Dessa forma, o componente depende do componente de página móvel.
    • Crie o body.jsp com a lógica específica do projeto.
  2. Crie o modelo de página:
    • Defina a sling:resourceType propriedade como o componente de página recém-criado.
    • Defina a allowedPaths propriedade.
  3. Crie a página de design para o site.
  4. Crie a página raiz do site abaixo do /content nó:
    • Defina a cq:allowedTemplates propriedade.
    • Defina a cq:designPath propriedade.
  5. Nas propriedades da página raiz do site, defina os grupos de dispositivos na guia Móvel .
  6. Crie as páginas do site usando o novo modelo.
O componente de página móvel ( /libs/wcm/mobile/components/page ):
  • Adiciona a guia Móvel à caixa de diálogo de propriedades da página.
  • Por meio de sua solicitação, head.jsp ele recupera o grupo de dispositivos móveis atual da solicitação e, se um grupo de dispositivos for encontrado, usa o drawHead() método do grupo para incluir o componente de inicialização do emulador associado do grupo de dispositivos (somente no modo de autor) e o CSS de renderização do grupo de dispositivos.
A página raiz do site móvel precisa estar no nível 1 da hierarquia do nó e é recomendável estar abaixo do nó /content.

Criar um site móvel com o Multi Site Manager

Use o Multi Site Manager (MSM) para criar uma live copy móvel de um site padrão. O site padrão é automaticamente transformado em um site móvel: o site móvel tem todos os recursos dos sites móveis (por exemplo, edição dentro de um emulador) e pode ser gerenciado em sincronia com o site padrão. Consulte a seção Criação de uma Live Copy para diferentes Canais na página Multi Site Manager.

API móvel do lado do servidor

Os pacotes Java que contêm as classes móveis são:

Componentes móveis

O Site de demonstração móvel We.Retail usa os seguintes componentes móveis, localizados abaixo /libs/foundation/components :
Nome Grupo Características
mobilefoter oculto - rodapé
mobileimage Móvel - com base no componente de base de imagem - renderiza uma imagem se o dispositivo for capaz de
mobilizista Móvel - com base no componente da base de lista - listitem_teaser.jsp renderiza uma imagem se o dispositivo for capaz de
mobilelogo oculto - baseado no componente de fundação do logotipo - renderiza uma imagem se o dispositivo for capaz de
mobilereference Móvel
- semelhante ao componente de alicerce de referência
- mapeia um componente de texttimage para um mobiletextimage um e um componente de imagem para um mobileimage one
mobiletextimage Móvel - com base no componente da base de tempo de textura - renderiza uma imagem se o dispositivo for capaz de
mobiletopnav oculto
- com base na componente da fundação de topnav
- somente renderiza o texto

Criação de um componente móvel

A estrutura móvel do AEM permite desenvolver componentes sensíveis ao dispositivo que emite a solicitação. Os exemplos de código a seguir mostram como usar a API móvel do AEM em um componente jsp e, em particular, como:
  • Obtenha o dispositivo da solicitação: Device device = slingRequest.adaptTo(Device.class);
  • Obtenha o grupo de dispositivos: DeviceGroup deviceGroup = device.getDeviceGroup();
  • Obtenha os recursos do grupo de dispositivos: Collection<DeviceCapability> capabilities = deviceGroup.getCapabilities();
  • Obtenha os atributos do dispositivo (chave/valores do recurso bruto do banco de dados WURFL): Map<String,String> deviceAttributes = device.getAttributes();
  • Obtenha o agente do usuário do dispositivo: String userAgent = device.getUserAgent();
  • Obtenha a lista de grupos de dispositivos (grupos de dispositivos atribuídos ao site pelo autor) da página atual: DeviceGroupList deviceGroupList = currentPage.adaptTo(DeviceGroupList.class);
  • Verifique se o grupo de dispositivos suporta imagens if (deviceGroup.hasCapability(DeviceCapability.CAPABILITY_IMAGES)) { ... OU if MobileUtil.hasCapability(request, DeviceCapability.CAPABILITY_IMAGES) { ...
Em um jsp, slingRequest está disponível por meio da <sling:defineObjects> tag e currentPage da <cq:defineObjects> tag .

Emuladores

A criação baseada no emulador fornece aos autores os meios de criar páginas de conteúdo destinadas a clientes móveis. A criação de conteúdo móvel segue o mesmo princípio da edição WYSIWYG no local. Para que os autores percebam a aparência da página em um dispositivo móvel, uma página de conteúdo móvel é editada usando um emulador de dispositivo.
Os emuladores de dispositivos móveis são baseados na estrutura de emulador genérica. Para obter mais detalhes, consulte a página Emuladores .
O emulador do dispositivo exibe o dispositivo móvel na página, enquanto a edição habitual (parsys, componentes) ocorre na tela do dispositivo. O emulador do dispositivo depende dos grupos de dispositivos configurados para o site. Vários emuladores podem ser atribuídos a um grupo de dispositivos. Todos os emuladores ficam disponíveis na página de conteúdo. Por padrão, o primeiro emulador atribuído ao primeiro grupo de dispositivos atribuído ao site é exibido. Os emuladores podem ser comutados pelo carrossel do emulador na parte superior da página ou pelo botão de edição do Sidekick.
Criação de um emulador
Para criar um emulador, consulte a seção Criação de um emulador móvel personalizado na página Emuladores genéricos.
Principais características dos emuladores móveis
  • Um grupo de dispositivos é composto por um de mais emuladores: a página de configuração do grupo de dispositivos, por exemplo, /etc/mobile/groups/touch, contém a emulators propriedade abaixo do jcr:content nó. Observação: embora seja possível que o mesmo emulador pertença a vários grupos de dispositivos, não faz muito sentido.
  • Pela caixa de diálogo de configuração do grupo de dispositivos, a emulators propriedade é definida com o caminho dos emuladores desejados. Por exemplo: /libs/wcm/mobile/components/emulators/iPhone4 .
  • Os componentes do emulador (por exemplo, /libs/wcm/mobile/components/emulators/iPhone4 ) estender o componente emulador móvel de base ( /libs/wcm/mobile/components/emulators/base ).
  • Cada componente que estende o emulador móvel básico está disponível para seleção ao configurar um grupo de dispositivos. Os emuladores personalizados podem ser facilmente criados ou estendidos.
  • No momento da solicitação no modo de edição, a implementação do emulador é usada para renderizar a página.
  • Quando o modelo da página depende do componente de página móvel, as funcionalidades do emulador são automaticamente integradas na página (por meio head.jsp do componente de página móvel).

Grupos de dispositivos

Os grupos de dispositivos móveis fornecem segmentação de dispositivos móveis com base nos recursos do dispositivo. Um grupo de dispositivos fornece as informações necessárias para a criação baseada em emulador na instância do autor e para a renderização correta do conteúdo na instância de publicação: depois que os autores adicionarem conteúdo à página móvel e a tiverem publicado, a página poderá ser solicitada na instância de publicação. Lá, em vez da exibição de edição do emulador, a página de conteúdo é renderizada usando um dos grupos de dispositivos configurados. A seleção do grupo de dispositivos ocorre com base na detecção de dispositivos móveis. O grupo de dispositivos correspondente fornece as informações de estilo necessárias.
Os grupos de dispositivos são definidos como páginas de conteúdo abaixo /etc/mobile/devices e usam o modelo de Grupo de dispositivos móveis. O modelo de grupo de dispositivos serve como um modelo de configuração para definições de grupos de dispositivos na forma de páginas de conteúdo. As suas principais características são:
  • Local: /libs/wcm/mobile/templates/devicegroup
  • Caminho permitido: /etc/mobile/groups/*
  • Componente da página: wcm/mobile/components/devicegroup

Atribuindo grupos de dispositivos ao seu site

Ao criar um site móvel, é necessário atribuir grupos de dispositivos ao site. O AEM fornece três grupos de dispositivos, dependendo das capacidades de renderização de HTML e JavaScript do dispositivo:
  • Telefones com recursos, como o Sony Ericsson W800 com suporte para HTML básico, mas sem suporte para imagens e JavaScript.
  • Telefones inteligentes , para dispositivos como o Blackberry com suporte para HTML e imagens básicas, mas sem suporte para JavaScript.
  • Touch phones, para dispositivos como o iPad com suporte total para HTML, imagens, JavaScript e rotação de dispositivos.
Como os emuladores podem ser associados a um grupo de dispositivos (consulte a seção Criação de um grupo de dispositivos), atribuir um grupo de dispositivos a um site permite que os autores selecionem entre os emuladores associados ao grupo de dispositivos para editar a página.
Para atribuir um grupo de dispositivos ao site:
  1. In your browser, go to the Siteadmin console.
  2. Abra a página raiz do site móvel abaixo de Sites .
  3. Abra as propriedades da página.
  4. Select the Mobile tab:
    • Defina os grupos de dispositivos.
    • Clique em OK .
Quando os grupos de dispositivos tiverem sido definidos para um site, eles serão herdados por todas as páginas do site.

Filtros do grupo de dispositivos

Os filtros de grupo de dispositivos definem critérios baseados em recursos para determinar se um dispositivo pertence ao grupo. Ao criar um grupo de dispositivos, você pode selecionar os filtros a serem usados para avaliar dispositivos.
Em tempo de execução quando o AEM recebe uma solicitação HTTP de um dispositivo, cada filtro associado a um grupo compara os recursos do dispositivo com critérios específicos. Considera-se que o dispositivo pertence ao grupo quando tem todos os recursos exigidos pelos filtros. Os recursos são recuperados do banco de dados WURFL™.
Os grupos de dispositivos podem usar zero ou mais filtros para detecção de recursos. Além disso, um filtro pode ser usado com vários grupos de dispositivos. O AEM fornece um filtro padrão que determina se o dispositivo tem os recursos selecionados para um grupo:
  • CSS
  • Imagens JPG e PNG
  • JavaScript
  • Rotação do dispositivo
Se o grupo de dispositivos não usar um filtro, os recursos selecionados que estão configurados para o grupo são os únicos recursos que um dispositivo requer.
Para obter mais informações, consulte Criação de filtros de grupo de dispositivos.

Criando um grupo de dispositivos

Crie um grupo de dispositivos quando os grupos instalados pelo AEM não atenderem aos seus requisitos.
  1. In your browser, go to the Tools console.
  2. Crie uma nova página abaixo de Ferramentas > Dispositivo móvel > Grupos de dispositivos. Na caixa de diálogo Criar página :
    • Como Título , insira Special Phones .
    • Como Nome , insira special .
    • Selecione o Modelo de grupo de dispositivos móveis.
    • Clique em Criar .
  3. No CRXDE, adicione um arquivo static.css contendo os estilos do grupo de dispositivos abaixo do /etc/mobile/groups/special nó.
  4. Abra a página Telefones ​especiais.
  5. Para configurar o grupo de dispositivos, clique no botão Editar ao lado de Configurações . Na guia Geral :
    • Título : o nome do grupo de dispositivos móveis.
    • Descrição : descrição do grupo.
    • Agente do usuário: sequência user-agent em que os dispositivos são combinados. É opcional e pode ser um regex. Exemplo: BlackBerryZ10
    • Recursos : define se o grupo pode lidar com imagens, CSS, JavaScript ou rotação de dispositivos.
    • Largura mínima da tela e altura
    • Desativar Emulador : para ativar/desativar o emulador durante a edição de conteúdo.
    Na guia Emuladores :
    • Emuladores : selecione os emuladores atribuídos a este grupo de dispositivos.
    Na guia Filtros :
    • Para adicionar um filtro, clique em Adicionar item e selecione um filtro na lista suspensa.
    • Os filtros são avaliados na ordem em que são exibidos. Quando um dispositivo não atende aos critérios de um filtro, os filtros subsequentes na lista não são avaliados.
  6. Clique em OK.
A caixa de diálogo de configuração de grupo de dispositivos móveis é exibida da seguinte maneira:

CSS personalizado por grupo de dispositivos

Conforme descrito anteriormente, é possível associar um CSS personalizado a uma página de grupo de dispositivos, como o CSS de uma página de design. Esse CSS é usado para influenciar a renderização específica do grupo de dispositivos do conteúdo da página no autor e na publicação. Esse CSS é incluído automaticamente:
  • Na página da instância do autor para cada emulador usado por esse grupo de dispositivos.
  • Na página da instância de publicação, se o agente do usuário da solicitação corresponder a um dispositivo móvel nesse grupo de dispositivos específico.

Detecção de dispositivo do lado do servidor

Use filtros e uma biblioteca de especificações de dispositivos para determinar os recursos do dispositivo que executa a solicitação HTTP.

Desenvolver filtros de grupo de dispositivos

Crie um filtro de grupo de dispositivos para definir um conjunto de requisitos de capacidade do dispositivo. Crie quantos filtros forem necessários para direcionar os grupos necessários de recursos do dispositivo.
Projete seus filtros para que você possa usar combinações deles para definir os grupos de recursos. Normalmente, há sobreposição dos recursos de diferentes grupos de dispositivos. Portanto, você pode usar alguns filtros com várias definições de grupos de dispositivos.
Depois de criar um filtro, você pode usá-lo na configuração do grupo.
Para obter informações, acesse Criar filtros de grupo de dispositivos.

Usando o banco de dados WURFL™

O AEM usa uma versão truncada do banco de dados WURFL ™ para consultar recursos do dispositivo, como resolução de tela ou suporte a javascript, com base no User-Agent do dispositivo.
O código XML do banco de dados WURFL™ é representado como nós abaixo /var/mobile/devicespecs pela análise do wurfl.xml arquivo em /libs/wcm/mobile/devicespecs/wurfl.xml. A expansão para nós ocorre na primeira vez que o cq-mobile-core conjunto é iniciado.
Os recursos do dispositivo são armazenados como propriedades do nó, e os nós representam modelos do dispositivo. Você pode usar consultas para recuperar os recursos de um dispositivo ou agente de usuário.
Como o banco de dados WURFL™ está evoluindo, talvez seja necessário personalizá-lo ou substituí-lo. Para atualizar o banco de dados de dispositivos móveis, você tem as seguintes opções:
  • Substitua o arquivo pela versão mais recente, se você tiver uma licença que permita esse uso. Consulte Instalação de um banco de dados WURFL diferente.
  • Use a versão que está disponível no AEM e configure um regexp que corresponda às suas strings do Agente do usuário e aponte para um dispositivo WURFL™ existente. Consulte Adicionar uma correspondência de agente do usuário baseada em regexp.

Teste do mapeamento de um agente do usuário para os recursos WURFL™

Quando um dispositivo acessa seu site móvel, o AEM detecta o dispositivo, mapeia-o para um grupo de dispositivos de acordo com seus recursos e envia uma visualização da página que corresponde ao grupo de dispositivos. O grupo de dispositivos correspondente fornece as informações de estilo necessárias. Os mapeamentos podem ser testados na Página de teste do agente do usuário móvel:
https://localhost:4502/etc/mobile/useragent-test.html

Instalando um banco de dados WURFL™ diferente

O banco de dados truncado WURFL™ instalado com o AEM é uma versão anterior a 30 de agosto de 2011. Se sua versão do WURFL foi lançada após 30 de agosto de 2011, verifique se seu uso está em conformidade com sua licença.
Para instalar um banco de dados WURFL™:
  1. No CRXDE Lite, crie a seguinte pasta: /apps/wcm/mobile/devicespecs
  2. Copie o arquivo WURFL™ para a pasta.
  3. Renomeie o arquivo como wurfl.xml .
O AEM analisa automaticamente o wurfl.xml arquivo e atualiza os nós abaixo /var/mobile/devicespecs .
Quando o banco de dados WURFL™ completo estiver ativado, a análise e a ativação podem levar alguns minutos. Você pode observar os registros para obter informações sobre o progresso.

Adicionando uma correspondência de agente-usuário baseado em regexp

Adicione um agente-usuário como uma expressão regular abaixo de /apps/wcm/mobile/devicespecs/wurfl/regexp para apontar para um tipo de dispositivo WURFL™ existente.
  1. No CRXDE Lite , crie um nó abaixo de /apps/wcm/mobile/devicespecs/regexp, por exemplo, apple_ipad_ver1.
  2. Adicione as seguintes propriedades ao nó:
    • regexp : expressão regular definindo agentes de usuário, por exemplo: .*Mozilla.*iPad.*AppleWebKit. Safari.
    • deviceId : a ID do dispositivo, conforme definido em wurfl.xml, por exemplo: apple_ipad_ver1
A configuração acima faz com que os dispositivos para os quais o User-Agent corresponde a expressão regular fornecida sejam mapeados para a ID de dispositivo apple_ipad_ver1 WURFL™, se ela existir.

Detecção de dispositivo do lado do cliente

Esta seção descreve como usar a detecção do AEM pelo lado do cliente para otimizar a renderização da página ou fornecer ao cliente versões alternativas do site.
O AEM oferece suporte à detecção do cliente do dispositivo com base em BrowserMap . BrowserMap é enviado no AEM como uma biblioteca de cliente em /etc/clientlibs/browsermap .
BrowserMap fornece três estratégias que podem ser usadas para fornecer um site alternativo a um cliente, que são empregadas na seguinte ordem:
Para obter mais informações sobre a integração da Biblioteca do cliente, leia a seção Usando bibliotecas HTML do lado do cliente.

Definindo um URL Específico de Grupo de Dispositivos

Se não quiser usar links alternativos, configure um URL global para cada um DeviceGroup . Recomendamos criar sua própria biblioteca de cliente que incorpora a biblioteca de browsermap.standard cliente, mas redefine os grupos de dispositivos.
O BrowserMap foi projetado de modo que as definições de Grupos de dispositivos possam ser substituídas criando e adicionando um novo Grupo de dispositivos com o mesmo nome ao BrowserMap objeto da biblioteca de cliente personalizada.
Para obter mais detalhes, leia a seção Personalizado do BrowserMap .

Definindo URLs com base em seletor

Se nenhum dos mecanismos anteriores tiver sido empregado para indicar um site alternativo para BrowserMap , então os seletores que usarão os nomes do DeviceGroups serão adicionados aos URL s, caso em que você deverá fornecer seus próprios servlets que lidarão com as solicitações.
Por exemplo, uma navegação de dispositivo www.example.com/index.html identificada como smartphone por BrowserMap é encaminhada para www.example.com/index.smartphone.html.

Uso do BrowserMap em suas páginas

Para usar a biblioteca de cliente padrão do BrowserMap em uma página, é necessário incluir o /libs/wcm/core/browsermap/browsermap.jsp arquivo usando uma cq:include tag na head seção da página.
<cq:include script="/libs/wcm/core/browsermap/browsermap.jsp" />

Além de adicionar a biblioteca do BrowserMap cliente em seus JSP arquivos, você também precisa adicionar uma propriedade cq:deviceIdentificationMode String definida para client-side jcr:content o nó abaixo da raiz do site.

Substituição do comportamento padrão do BrowserMap

Se você quiser personalizar BrowserMap - substituindo DeviceGroups ou adicionando mais testes -, você deverá criar sua própria biblioteca no lado do cliente na qual você incorporará a biblioteca no lado do browsermap.standard cliente.
Além disso, é necessário chamar manualmente o BrowserMap.forwardRequest() método no seu JavaScript código.
Para obter mais informações sobre a integração da Biblioteca do cliente, leia a seção Usando bibliotecas HTML do lado do cliente.
Depois de criar a biblioteca personalizada BrowserMap do cliente, sugerimos a seguinte abordagem:
  1. Criar um browsermap.jsp arquivo em seu aplicativo
    <%@include file="/libs/foundation/global.jsp" %>
    <%@ taglib prefix="c" uri="https://java.sun.com/jsp/jstl/core" %>
    <%@ page import="
        com.day.cq.wcm.api.variants.PageVariant,
        com.day.cq.wcm.api.variants.PageVariantsProvider,
        com.day.cq.wcm.api.devicedetection.DeviceIdentificationMode,
        com.day.cq.wcm.api.WCMMode"
    %>
    <%
        final PageVariantsProvider p = sling.getService(PageVariantsProvider.class);
        if(p == null) {
            throw new IllegalStateException("Missing PageVariantsProvider service");
        }
        for(PageVariant v : p.getVariants(currentPage, slingRequest)) {
            final String curVar = v.getAttributes().get("data-current-variant");
            String media = v.getAttributes().get("media");
            if (media != null) {
                media = media.replaceAll(" ", "");
            }
    %>
        <link
            rel="alternate"
            data-cq-role="site.variant"
            title="<%= xssAPI.encodeForHTMLAttr(v.getTitle()) %>"
            hreflang="<%= xssAPI.encodeForHTMLAttr(v.getAttributes().get("hreflang")) %>"
            media="<%= xssAPI.encodeForHTMLAttr(media) %>"
            href="<%= xssAPI.getValidHref(v.getURL()) %>"
            <% if(curVar != null) { %> data-current-variant="<%= curVar %>"<% } %>
        />
    <%
        }
        Boolean browserMapEnabled = true;
        final DeviceIdentificationMode dim = sling.getService(DeviceIdentificationMode.class);
        String[] selectors  = slingRequest.getRequestPathInfo().getSelectors();
        boolean isPortletRequest = false;
        for (int i = 0; i < selectors.length; i++) {
            if ("portlet".equals(selectors[i])) {
                isPortletRequest = true;
                break;
            }
        }
        if (isPortletRequest) {
            log.debug("Request was made by a portlet container - BrowserMap will not be embedded");
        } else {
            final WCMMode wcmMode = WCMMode.fromRequest(slingRequest);
            boolean shouldIncludeClientLib = false;
            if (WCMMode.EDIT != wcmMode && WCMMode.PREVIEW != wcmMode && WCMMode.DESIGN != wcmMode) {
                if (dim != null) {
                    final String mode = dim.getDeviceIdentificationModeForPage(currentPage);
                    shouldIncludeClientLib = DeviceIdentificationMode.CLIENT_SIDE.equals(mode);
                    if (shouldIncludeClientLib) {
                        browserMapEnabled = (Boolean) request.getAttribute("browsermap.enabled");
                        if (browserMapEnabled == null) {
                            browserMapEnabled = true;
                        }
                    }
                }
            }
    %>
            <c:if test="<%= !browserMapEnabled %>">
                <meta name="browsermap.enabled" content="false">
            </c:if>
            <c:if test="<%= shouldIncludeClientLib %>">
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <cq:includeClientLib categories="browsermap.custom"/>
            </c:if>
    <%
        }
    %>
    
    
  2. Inclua o broswermap.jsp arquivo na seção de cabeçalho.
    <cq:include script="browsermap.jsp" />
    
    

Excluindo o BrowserMap de Determinadas Páginas

Se você deseja excluir a biblioteca do BrowserMap de algumas de suas páginas onde não é necessário detectar o cliente, é possível adicionar um atributo de solicitação:
<%
request.setAttribute("browsermap.enabled", false);
%>

Isso fará com que o /libs/wcm/core/browsermap/browsermap.jsp script adicione uma tag meta à página que fará com que BrowserMap não execute nenhuma detecção:
<meta name="browsermap.enabled" content="false">

Testando uma versão específica de um site

Normalmente, o script BrowserMap sempre redireciona os visitantes para a versão mais adequada do site, geralmente redirecionando os visitantes para o desktop ou para o site móvel quando necessário.
Você pode forçar o dispositivo de qualquer solicitação a testar uma versão específica de um site, adicionando o device parâmetro ao seu URL. O URL a seguir renderizará a versão móvel do site do Geometrixx Outdoors.
https://localhost:4502/content/geometrixx-outdoors/en.html?wcmmode=disabled&device=smartphone
O wcmmode parâmetro é definido para disabled simular o comportamento de uma instância de publicação.
O valor do dispositivo substituído é armazenado em um cookie para que você possa navegar em seu site sem adicionar o device parâmetro a cada URL .
Como consequência, você precisa chamar o mesmo URL com o device definido para browser para voltar à versão para desktop do site.
O BrowserMap armazena o valor do dispositivo substituído em um cookie chamado BMAP_device . A exclusão desse cookie garantirá que o CQ disponibilizará a versão apropriada do site de acordo com o dispositivo atual (por exemplo, desktop ou dispositivo móvel).

Processamento de solicitação móvel

O AEM processa uma solicitação emitida por um dispositivo móvel que pertence ao grupo de dispositivos de toque da seguinte forma:
  1. Um iPad envia uma solicitação para a instância de publicação do AEM, por exemplo, https://localhost:4503/content/geometrixx_mobile/en/products.html
  2. O AEM determina se o site da página solicitada é um site móvel (verificando se a página de primeiro nível /content/geometrixx_mobile estende o componente de página móvel). Em caso afirmativo:
  3. O AEM procura os recursos do dispositivo com base no User-Agent no cabeçalho da solicitação.
  4. O AEM mapeia os recursos do dispositivo para o grupo de dispositivos e é definido touch como o seletor de grupos de dispositivos.
  5. O AEM redireciona a solicitação para https://localhost:4503/content/geometrixx_mobile/en/products.touch.html.
  6. O AEM envia a resposta para o iPad:
    • products.touch.html é renderizado da maneira habitual e é cátil.
    • Os componentes de renderização usam seletores para adaptar a apresentação.
    • O AEM adiciona automaticamente o seletor móvel a todos os links internos na página.

Estatísticas

Você pode obter algumas estatísticas sobre o número de solicitações feitas ao servidor AEM por dispositivos móveis. O número de solicitações pode ser detalhado:
  • por grupo de dispositivos e dispositivo
  • por ano, mês e dia
Para exibir as estatísticas:
  1. Go to the Tools console.
  2. Abra a página Estatísticas do dispositivo abaixo de Ferramentas > Dispositivo móvel .
  3. Clique no link para exibir as estatísticas de um ano, mês ou dia específico.
A página Estatísticas é a seguinte:
A página Estatísticas é criada na primeira vez que um dispositivo móvel acessa o AEM e é detectado. Antes disso, não está disponível.
Se precisar gerar uma entrada nas estatísticas, você pode continuar da seguinte maneira:
  1. Use um dispositivo móvel ou um emulador (por exemplo, https://chrispederick.com/work/user-agent-switcher/ no Firefox).
  2. Solicite uma página móvel na instância do autor desativando o modo de criação, por exemplo: https://localhost:4502/content/geometrixx_mobile/en/products.html?wcmmode=disabled
A página Estatísticas agora está disponível.