Client Craft Hub Pesquisar documentação /

Pesquisar documentação

Implementar e estender Entrega ao cliente

Explorar documentação

Pré-visualização Versão 0.1.0-alpha.16

Adicionar uma fonte de dados pública ao Visual Builder

Implemente IVisualDataProvider no site e registre-o em um Composer Umbraco. Descreva campos estáveis com rótulos e retorne valores públicos tipados para o site/idioma. O Visual Builder fornece a API de conexão; o host é responsável pela origem e regras de acesso.

Projeto Umbraco compatível com Visual Builder 0.1.0-alpha.15, diretamente ou por ClientCraft 0.1.0-alpha.16. Coloque os dois arquivos no projeto e mantenha o Program.cs existente. Nesta base .NET 10 / Umbraco 17.7.1, fixe também System.Security.Cryptography.Xml 10.0.13 no projeto do site, substituindo a dependência transitiva vulnerável 10.0.10. Mantenha a auditoria NuGet ativa. O exemplo foi recompilado com esta correção.

Etapas de implementação

  1. Manter a extensão no projeto do cliente

    Use a interface pública, sem modificar arquivos dos pacotes. O exemplo expõe um nome de serviço fictício, identificado como demonstração. Não consulta contatos CRM, preços, direitos comerciais ou credenciais. O Umbraco continua gerenciando páginas, idiomas, mídias e publicação.

  2. Registrar a origem e um campo identificado

    Describe fornece uma chave estável e um rótulo compreensível. ResolveAsync recebe VisualDataContext do renderer e retorna VisualDataValue.Text. Registre a implementação por injeção de dependências em um Composer nativo. Não adicione expressões executáveis nem seletores de scripts por página.

    As chaves de origem e campo usam letras minúsculas, números e hífen, sem pontos. A chave do exemplo é agency-public-service. O VisualDataResolver publicado valida a descrição antes de expor a origem.

  3. Compilar e selecionar a origem registrada

    Compile o site, reinicie-o e abra um bloco com texto conectado a dados. Selecione a origem de exemplo e o campo Service name. Pré-visualize em inglês e português; o texto muda conforme o idioma. Use os controles disponíveis de origem/campo, não JSON de conexão escrito manualmente.

  4. Preparar a recuperação de origens reais

    Ao substituir a demonstração por um catálogo público externo, respeite cancelamento e retorne Empty ou Unavailable conforme o caso. Aplique autorização antes de retornar valores; selecionar um workspace não autoriza acesso. Nunca publique registros privados em uma conexão pública. Use APIs nativas para URLs de conteúdo e imagens.

Exemplo funcional

Use os arquivos completos abaixo com as versões publicadas indicadas.

AgencyCatalogueProvider.cs csharp
using ClientCraft.VisualBuilder.Umbraco.Data;

namespace Agency.Website;

// Public demonstration data only. Never return CRM contacts, credentials or entitlements.
public sealed class AgencyCatalogueProvider : IVisualDataProvider
{
    public VisualDataSource Describe() => new(
        "agency-public-service",
        "Agency public service (example)",
        [new VisualDataField("name", "Service name", VisualDataKind.Text)],
        IsDemonstration: true);

    public Task<VisualDataResult> ResolveAsync(
        VisualDataContext context,
        CancellationToken cancellationToken)
    {
        cancellationToken.ThrowIfCancellationRequested();
        var name = context.Culture.StartsWith("pt", StringComparison.OrdinalIgnoreCase)
            ? "Manutenção de websites"
            : "Website maintenance";

        return Task.FromResult(new VisualDataResult(
            VisualDataStatus.Success,
            new Dictionary<string, VisualDataValue?>
            {
                ["name"] = new VisualDataValue.Text(name)
            }));
    }
}
AgencyCatalogueComposer.cs csharp
using ClientCraft.VisualBuilder.Umbraco.Data;
using Microsoft.Extensions.DependencyInjection;
using Umbraco.Cms.Core.Composing;
using Umbraco.Cms.Core.DependencyInjection;

namespace Agency.Website;

public sealed class AgencyCatalogueComposer : IComposer
{
    public void Compose(IUmbracoBuilder builder)
        => builder.Services.AddSingleton<IVisualDataProvider, AgencyCatalogueProvider>();
}

Continuar a integração