Criando Mini-App (1.0)

Para criar um aplicativo, siga as etapas 1 a 6 na imagem acima.

2026-08-11
Nota
Exemplo - Uma API de verificação de e-mail, TheChecker (abre uma nova janela), será usada como exemplo de como criar e editar um miniaplicativo.

Para criar um aplicativo, siga as etapas 1 a 6 na imagem acima.

Na página de edição (esquerda), liste um título, descrição, logotipo, capa, ID do vídeo do YouTube e ele aparecerá assim na mini-app store (direita):

No lado direito da página de edição:

Você sempre pode usar dados de amostra na parte inferior para orientação. E os campos do sistema são o que você pode usar em seu código JSON, se necessário.

Autenticação

Este bloco serve para configurar autenticações do seu App.

Parâmetros

Nome
Tipo de dados
Descrição
tipo
enumeração
Valor suportado: APIKEY
parâmetros
variedade
Valores exigidos dos usuários durante a instalação, por exemplo, chave de API
solicitar
objeto
Envie solicitações com parâmetros (por exemplo, email, api_key) e mapeie a resposta para parâmetros (por exemplo, token)
conexão
objeto
Lista de cabeçalhos ou parâmetros de solicitação

Exemplo de verificação de e-mail

Este é um exemplo de autenticação com uma chave API na consulta. Veja a seguir como ficará depois que os usuários instalarem o aplicativo:

A "chave API" definida pelos usuários será então armazenada na variável "token".

Exemplo de autenticação básica

Nota
DICA - A autenticação de acesso básico requer que o nome de usuário e a senha unidos por dois pontos sejam uma credencial e a credencial seja codificada usando Base64. Dado que as funções não são suportadas no código JSON, o sistema irá ajudá-lo a fazer a codificação. Então você só precisa colocar "Basic [[sid]]:[[token]]" como o valor de autorização.
texto
{
    "type": "APIKEY",
    "params": [
        {
            "name": "sid",
            "title": "Twilio Account SID:"
        },
        {
            "name": "token",
            "title": "Twilio Auth Token:"
        }
    ],
    "connection": {
        "headers": {
            "Authorization": "Basic [[sid]]:[[token]]"
        }
    }
}

Outros exemplos

Exemplo 1: APIKEY Auth, cabeçalhos

texto
{
    "type": "APIKEY",
    "params": [
        {
            "name": "token",
            "title": "Enter your api key:"
        }
    ],
    "connection": {
        "headers": {
            "Authorization": "Bearer [[token]]"
        }
    }
}

Os "cabeçalhos" na "conexão" serão adicionados a cada solicitação, para que você não precise repeti-los em todos os lugares posteriormente.

Exemplo 2: APIKEY Auth, parâmetros de consulta

texto
{
    "type": "APIKEY",
    "params": [
        {
            "name": "api_key",
            "title": "Enter your api key:"
        }
    ],
    "connection": {
        "qs": {
            "key": "[[api_key]]"
        }
    }
}

Assim como acima, a string de consulta será adicionada a cada solicitação.

Exemplo 3: Autenticação APIKEY, token JWT

texto
{
    "type": "APIKEY",
    "params": [
        {
            "name": "email",
            "title": "Enter your email:"
        },
        {
            "name": "api_key",
            "title": "Enter your api key:"
        }
    ],
    "request": {
        "url": "https://example.com/get-token",
        "method": "POST",
        "body_format": "form",
        "cache": 3600,      //cache this request for 3600 seconds
        "payload": {
            "email": "[[email]]",
            "api_key": "[[api_key]]"
        },
        "mapping": [
            {
                "name": "token",
                "path": "$.data.token"
            }
        ]
    },
    "connection": {
        "headers": {
            "Authorization": "Bearer [[token]]"
        }
    }
}

O email e api_key fornecidos pelos usuários serão enviados como solicitação. Em seguida, as respostas serão mapeadas para a variável tokenpelo caminho JSON $.data.token. Depois disso, é usado como variável [[token]]em um cabeçalho de autorização. Novamente, o cabeçalho será adicionado a cada solicitação posteriormente.

Ações

Ações são as funções/recursos que os usuários podem realizar com seu aplicativo. Por exemplo, este aplicativo "Google Translate" possui 2 ações, "Detectar idioma" e "Traduzir texto":

Na área de codificação, é necessário definir as informações padrão da ação, incluindo nome, título, descrição, formulários e solicitações para que a ação funcione no fluxo com configuração.

Na parte inferior, clique em “Obter produto” para um exemplo de solicitação GET e em “Atualizar produto” para um exemplo de solicitação POST. O tipo de formulários e solicitações são objetos, portanto necessita definir vários atributos.

Parâmetros

Nome
Tipo de dados
Descrição
nome
corda
Identifique a ação, deve ser única
título
corda
Título da ação mostrado ao usar o aplicativo
descrição
corda
Descrição da ação mostrada ao usar o aplicativo
formulários
variedade
Lista de objetos de formulário para configuração de ação
solicitações de
variedade
Lista de objetos de solicitação a serem executados em sucessão

Objeto de formulário

Nome
Tipo de dados
Descrição
nome
corda
Nome do campo, usado como identificador e variável dentro da solicitação
tipo
enumeração
Tipo de valor, usado para validação, valores suportados: string, texto, número e seleção
título
corda
Título do campo, exibido na IU
padrão
corda
Valor padrão para este campo. Se especificado, o campo se torna opcional
fonte
corda
Nome da fonte no bloco Sources, apenas para type=select
espaço reservado
corda
o prompt cinza mostrado no campo
descrição
corda
o prompt aparece abaixo do campo

Linhas na variável de texto

Nota
DICA - A diferença entre string e tipo de formulário de texto é que string removerá a nova linha na variável enquanto o texto a manterá.

Objeto de solicitação

Nome
Tipo de dados
Descrição
url
corda
Solicitar URL
método
enumeração
Método de solicitação HTTP, valores suportados: GET, POST, PUT, DELETE, PATCH, HEAD, OPTIONS
cabeçalhos
variedade
Lista de cabeçalhos de solicitação no par de valores-chave, por exemplo{"Content-Type": "application/json"}
carga útil
JSON
Solicitar corpo
formato_corpo
enumeração
Formato do corpo da solicitação, valores suportados: json, query, form, multipart, raw
mapeamento
variedade
Conjunto de campos para mapeamento de resultados de solicitação em campos personalizados

Objeto de mapeamento

Nome
Tipo de dados
Descrição
nome
corda
Nome do campo, usado como identificador
tipo
enumeração
Tipo de campo, valores suportados: texto, número, booleano, data, datahora, matriz
título
variedade
Nome do campo, exibido na IU
caminho
corda
String em formato de caminho JSON

Exemplo de verificação de e-mail

A seguir está a codificação do exemplo de verificação de e-mail e as etapas da UI em ação.

Código:

Nota
DICA - Você pode remover o "api_key" da URL porque já o adicionamos no bloco Auth.

IU do aplicativo:

Outros exemplos

Exemplo 1:

texto
{
    "url": "https://translation.googleapis.com/language/translate/v2/detect",
    "method": "POST",
    "headers": {
        "Content-Type": "application/json"
    },
    "payload": {
        "q": "[[q]]"
    },
    "mapping": [
        {
            "name": "language",
            "type": "text",
            "title": "Detected Language",
            "path": "$.data.detections.0.0.language"
        }
    ]
}

Exemplo 2:

texto
{
    "url": "https://example/api/auth",
    "method": "POST",
    "body_format": "form",
    "cache": 3600,
    "payload": {
        "email": "[[email]]",
        "api_key": "[[api_key]]"
    },
    "mapping": [
        {
            "name": "token",
            "type": "text",
            "title": "Token",
            "path": "$.data.token"
        }
    ]
}

Fontes

O bloco Sources é usado para fornecer aos usuários uma lista de opções para o valor do formulário. Use o nome da fonte no parâmetro de formulário no bloco Actions para construir a conexão.

Existem 2 formatos de fontes, static e dynamic. As opções de uma fonte estática são fixas enquanto uma fonte dinâmica traz opções variáveis de acordo com as entradas.

Atenção
Nota - o bloco de fontes é opcional, dependendo do tipo de objetos de formulário no bloco Actions.

Parâmetros

Nome
Tipo de dados
Descrição
nome
corda
Identifique a fonte
tipo
enumeração
Tipo de origem, valores suportados: enum:rpc, enum:static
lista
variedade
Lista de opções fixas mostradas ao usar o aplicativo. Somente para type=enum:static
solicitar
objeto
Objeto de solicitação quando a origem é dinâmica. Somente para type=enum:rpc

Mapeando Objeto no Objeto Solicitação

Nome
Tipo de dados
Descrição
tipo
enumeração
Tipo de campo, valor suportado: selecione
caminho
corda
String em formato de caminho JSON, para matriz de dados de resposta
valor
corda
String em um formato de caminho JSON com base nos pathresultados. Este é o valor real retornado quando um rótulo é selecionado
rótulo
corda
String em um formato de caminho JSON com base nos pathresultados. Exibido na lista suspensa como rótulo

Exemplos

Formulários no bloco Ações:

texto
"forms": [
            {
                "name": "static_options",
                "type": "select",
                "title": "Static Options",
                "source": "product_type_list"
            },
            {
                "name": "dynamic_options",
                "type": "select",
                "title": "Dynamic Options",
                "source": "users_list"
            }
        ]

Bloco de fontes:

texto
[
    {
        "name": "product_type_list",
        "type": "enum:static",
        "list": [
            {
                "value": "food",
                "label": "Food & Drink"
            },
            {
                "value": "toy",
                "label": "Toys"
            },
            {
                "value": "phone",
                "label": "Mobile Phone"
            }
        ]
    },
    {
        "name": "users_list",
        "type": "enum:rpc",
        "request": {
            "url": "https://jsonplaceholder.typicode.com/users",
            "method": "GET",
            "headers": {
                "Content-Type": "application/json"
            },
            "mapping": [
                {
                    "type": "select",
                    "path": "$",
                    "value": "$.id",
                    "label": "$.username"
                }
            ]
        }
    }
]
Nota
DICA - o objeto request em fontes dinâmicas foi explicado no bloco Action, verifique os detalhes dos parâmetros do objeto request.

IU do aplicativo:

Gatilhos

Ao definir gatilhos, os usuários podem usar os gatilhos da seção de automação como qualquer outro gatilho integrado mostrado na captura de tela acima.

Observe que o nome do gatilho deve ser:

  • em minúsculas
  • único na lista de gatilhos
  • sem espaço, você pode separar as palavras por sublinhados

Contexto é onde você lista todas as variáveis predefinidas quando os dados chegam.

Após definir o gatilho, você precisará configurar as "Solicitações de token de API" e selecionar a API em "Escopos da API", veja orientação abaixo.

Para chamar esse gatilho, consulte API para gatilho de miniaplicativo.

Escopos da API

Em "Api Scopes", selecione todas as APIs que seu mini-app precisa acessar. Verifique a "Documentação da API" através do link na parte superior.

Por exemplo, se seu aplicativo precisar visualizar a lista de tags dos usuários no fluxo, selecione "Visualizar tags de fluxo". Além disso, se você precisar usar gatilhos em seu aplicativo, selecione “App Trigger” na imagem acima.

Solicitações de token de API

Em "Solicitações de token de API", clique nos dados de amostra "Solicitações" na parte inferior e edite o endereço URL do seu endpoint para assinatura e cancelamento de assinatura. Além disso, verifique na parte inferior os campos do sistema disponíveis e coloque as informações necessárias na carga útil. Por exemplo, inclua "app_token" na carga útil se precisar acessar o fluxo dos usuários via API (se você selecionar qualquer API no bloco Api Scopes).

Salvar e testar

Por fim, clique em “Salvar” para finalizar a criação. Parabéns!! Você acabou de criar um miniaplicativo com sucesso.💯💯

Se você estiver usando o aplicativo apenas em seu próprio espaço de trabalho, não será necessário publicá-lo. Você pode testá-lo e usá-lo em qualquer bot de qualquer canal do seu espaço de trabalho.

Para compartilhar o aplicativo com outros espaços de trabalho, você precisará publicá-lo na mini-app store do NicoChat.