tailor
3.9.2
O alfaiate é um serviço de layout que usa fluxos para compor uma página da web dos serviços de fragmentos. O'Reilly o descreve no título desta postagem do blog como "uma biblioteca que fornece um middleware que você pode integrar a qualquer servidor Node.js". É parcialmente inspirado pelo bigpipe do Facebook, mas desenvolvido em um contexto de comércio eletrônico.
Algumas das características e benefícios do alfaiate:
O alfaiate faz parte do Project Mosaic, que visa ajudar os desenvolvedores a criar microsserviços para o front -end. O mosaico também inclui um roteador HTTP extensível para composição de serviço (Skipper) com API RESTful relacionada que armazena rotas (pousadas); Mais componentes estão em andamento para liberação pública. Se sua equipe de front-end estiver fazendo a transição de monólito para microsserviços, você poderá encontrar o alfaiate e os irmãos disponíveis.
Os microsserviços recebem muita tração nos dias de hoje. Eles permitem que várias equipes trabalhem independentemente uma da outra, escolha suas próprias pilhas de tecnologia e estabeleçam seus próprios ciclos de lançamento. Infelizmente, o desenvolvimento do front -end ainda não foi totalmente capitalizado sobre os benefícios que os microsserviços oferecem. A prática comum para a construção de sites permanece "o monólito": uma única base de código de front -end que consome várias APIs.
E se pudéssemos ter microsserviços no front -end? Isso permitiria que os desenvolvedores de front -end trabalhassem em conjunto com seus colegas de back -end no mesmo recurso e implantam independentemente partes do site - "fragmentos" como cabeçalho, produto e rodapé. Trazer microsserviços para o front -end requer um serviço de layout que compõe um site com fragmentos. O alfaiate foi desenvolvido para resolver essa necessidade.
Comece a usar alfaiate com:
yarn add node-tailor const http = require ( 'http' ) ;
const Tailor = require ( 'node-tailor' ) ;
const tailor = new Tailor ( { /* Options */ } ) ;
const server = http . createServer ( tailor . requestHandler ) ;
server . listen ( process . env . PORT || 8080 ) ; fetchContext(request) - Função que retorna uma promessa do contexto, que é um objeto que mapeia o ID do fragmento para o URL do fragmento, de poder substituir URLs dos fragmentos na página, os padrões de Promise.resolve({})fetchTemplate(request, parseTemplate) - Função que deve buscar o modelo, chamar parseTemplate e retornar uma promessa do resultado. Útil para implementar sua própria maneira de recuperar e cache os modelos, por exemplo, do S3. Implementação padrão lib/fetch-template.js busca o modelo do sistema de arquivostemplatesPath - Para especificar o caminho em que os modelos são armazenados localmente, padrões para /templates/fragmentTag - nome da etiqueta de fragmento, padroniza para fragmenthandledTags - Uma variedade de tags personalizadas, verifique tests/handle-tag para mais informaçõeshandleTag(request, tag, options, context) - recebe uma etiqueta ou tag de fechamento e serializa -a a uma string ou retorna um fluxofilterRequestHeaders(attributes, request) - Função que filtra os cabeçalhos de solicitação que são passados para a solicitação de fragmento, verifique a implementação padrão nos lib/filter-headersfilterResponseHeaders(attributes, headers) - Função que mapeia os cabeçalhos de resposta fornecidos da solicitação de fragmento primário para a resposta finalmaxAssetLinks - Número de diretivas de cabeçalho Link para CSS e JS respeitados por fragmento - Padrões para 1requestFragment(filterHeaders)(url, attributes, request) - Função que retorna uma promessa de solicitação a um servidor de fragmentos, verifique a implementação padrão no lib/request-fragmentamdLoaderUrl - URL para o carregador AMD. Utilizamos requisitosjs de cdnjs como padrãopipeInstanceName - Nome da instância do tubo disponível na janela do navegador para consumir ganchos de front -end.pipeAttributes(attributes) - Função que retorna o conjunto mínimo de atributos de fragmento disponíveis nos ganchos de front -end.tracer - Implementação de rastreador compatível com operações. O alfaiate usa o parse5 para analisar o modelo, onde substitui cada fragmentTag por um fluxo do servidor de fragmentos e handledTags com o resultado da função handleTag .
< html >
< head >
< script type =" fragment " src =" http://assets.domain.com " > </ script >
</ head >
< body >
< fragment src =" http://header.domain.com " > </ fragment >
< fragment src =" http://content.domain.com " primary > </ fragment >
< fragment src =" http://footer.domain.com " async > </ fragment >
</ body >
</ html >id - Identificador exclusivo opcional (autogenerado)src - url do fragmentoprimary - denota um fragmento que define o código de resposta da páginatimeout - Tempo limite opcional de fragmento em milissegundos (o padrão é 3000)async - adio o fragmento até o final da etiqueta corporalpublic - para impedir que o alfaiate encaminhe os cabeçalhos de solicitação filtrada do upstream para os fragmentos.fallback-src - URL do fragmento de fallback em caso de tempo limite/erro no fragmento atualOutros atributos são permitidos e também serão aprovados para funções relevantes (por exemplo,
filterRequestHeaders,filterResponseHeaders, etc.)
Um fragmento é um servidor HTTP que renderiza apenas a parte da página e define o cabeçalho Link para fornecer URLs aos recursos CSS e JavaScript. examples/basic-css-and-js/index.js para um rascunho de implementação.
Um javascript do fragmento é um módulo AMD, que exporta uma função init , que será chamada com o elemento DOM do fragmento como argumento.
O alfaiate não seguirá os redirecionamentos, mesmo que a resposta do fragmento contenha o cabeçalho de 'localização', que é de propósito, pois os redirecionamentos podem introduzir latência indesejada. Os fragmentos com o atributo primary podem fazer um redirecionamento, pois controla o código de status da página.
Nota: Para compatibilidade com AWS, o cabeçalho Link também pode ser passado como x-amz-meta-link
Por padrão, a solicitação recebida será usada para selecionar o modelo.
Então, para obter o modelo index.html , você acessa /index .
Se você deseja ouvir /product/my-product-123 para ir ao modelo product.html , você pode alterar o req.url para /product .
Cada cabeçalho é filtrado por padrão para evitar informações sobre vazamentos, mas você pode fornecer o URI e o host original adicionando-o aos cabeçalhos, x-request-host e x-request-uri e depois lendo no fragmento os cabeçalhos para saber qual produto buscar e exibir.
http
. createServer ( ( req , res ) => {
req . headers [ 'x-request-uri' ] = req . url
req . url = '/index'
tailor . requestHandler ( req , res ) ;
} )
. listen ( 8080 , function ( ) {
console . log ( 'Tailor server listening on port 8080' ) ;
} ) ;Alguns dos conceitos no alfaiate são descritos em detalhes sobre os documentos específicos.
O alfaiate tem instrumentação de rastreamento distribuída com o OpenRacing. Ele captará qualquer contexto de span na solicitação HTTP de entrada e a propaga para as chamadas de procedimentos remotos existentes (RPCs).
Atualmente, apenas a busca de fragmentos é instrumentada, fornecendo alguns detalhes adicionais, como tag de fragmento, atributos e alguma carga útil de log, como o rastreamento da pilha para erros.
# Get a copy of the repository
git clone https://github.com/zalando/tailor.git
# Change to the folder
cd tailor
# Install dependencies
yarnnode examples/basicnode examples/basic-css-and-jsnode examples/multiple-fragments-with-custom-amdnode examples/fragment-performanceVá para http: // localhost: 8080/índice após a execução do exemplo específico.
NOTA: Por favor, execute os exemplos com versões de nó> 6.0.0
Exemplos de aplicativos de página única também estão disponíveis:
Para começar a executar o benchmark Execute npm run benchmark e aguarde alguns segundos para ver os resultados.
Por favor, verifique as diretrizes contribuintes aqui.
