Tradução com IA integrada

Mantenha tudo organizado com as coleções Salve e categorize o conteúdo com base nas suas preferências.

Thomas Steiner

Alexandra Klepper

Publicado em 13 de novembro de 2024 e atualizado pela última vez em 20 de maio de 2025

Explicação	Web	Extensões	Status do Chrome	Intenção
GitHub	Teste do Origin	Teste do Origin	Ver	Intent to Experiment

Use a API Translator no Chrome para traduzir textos com modelos de IA fornecidos no navegador.

Talvez seu site já ofereça conteúdo em vários idiomas para que seja acessível a um público global. Com a API Translator, os usuários podem contribuir no idioma materno. Por exemplo, os usuários podem participar de chats de suporte no idioma principal e seu site pode traduzir para o idioma usado pelos agentes de suporte antes de sair do dispositivo do usuário. Isso cria uma experiência suave, rápida e inclusiva para todos os usuários.

A tradução de conteúdo na Web geralmente exige o uso de um serviço em nuvem. Primeiro, o conteúdo de origem é enviado para um servidor, que executa a tradução para um idioma de destino. Em seguida, o texto resultante é transferido por download e retornado ao usuário. Ao executar a tradução no cliente, você economiza o tempo necessário para as viagens do servidor e o custo de hospedagem do serviço de tradução.

Primeiros passos

A API Translator está disponível no Chrome 138 estável. Primeiro, execute a detecção de recursos para saber se o navegador oferece suporte à API Translator.

if ('Translator' in self) {
  // The Translator API is supported.
}

Você sempre sabe o idioma de destino das traduções, mas nem sempre sabe o idioma de origem. Nesses casos, use a API Language Detector.

Verificar o suporte a pares de idiomas

A tradução é gerenciada com pacotes de idiomas, que são baixados sob demanda. Um pacote de idiomas é como um dicionário para um determinado idioma.

• sourceLanguage: o idioma atual do texto.
• targetLanguage: o idioma final para o qual o texto será traduzido.

Use códigos curtos de idioma BCP 47 como strings. Por exemplo, 'es' para espanhol ou 'fr' para francês.

const translatorCapabilities = await Translator.availability({
  sourceLanguage: 'es',
  targetLanguage: 'fr',
});
// 'available'

A função availability() retorna uma promessa com os seguintes valores:

• "unavailable": a implementação não oferece suporte à tradução ou à detecção de idioma dos idiomas fornecidos.
• "downloadable": a implementação oferece suporte à tradução ou à detecção de idioma dos idiomas fornecidos, mas é necessário fazer o download para continuar. O download pode ser o modelo do navegador.
• "downloading": a implementação oferece suporte à tradução ou detecção de idioma dos idiomas fornecidos. O navegador está finalizando um download em andamento, como parte da criação do objeto associado.
• "available": a implementação oferece suporte à tradução ou à detecção dos idiomas fornecidos, e todos os downloads necessários já foram concluídos.

Detecte o progresso do download do modelo com o evento downloadprogress:

const translator = await Translator.create({
  sourceLanguage: 'es',
  targetLanguage: 'fr',
  monitor(m) {
    m.addEventListener('downloadprogress', (e) => {
      console.log(`Downloaded ${e.loaded * 100}%`);
    });
  },
});

Se o download falhar, os eventos downloadprogress serão interrompidos e a promessa ready será rejeitada.

Criar e executar o tradutor

Para criar um tradutor, chame a função create() assíncrona. Ele requer um parâmetro de opções com dois campos, um para o sourceLanguage e outro para o targetLanguage.

// Create a translator that translates from English to French.
const translator = await Translator.create({
  sourceLanguage: 'en',
  targetLanguage: 'fr',
});

Depois de ter um tradutor, chame o translate() assíncrono.

await translator.translate('Where is the next bus stop, please?');
// "Où est le prochain arrêt de bus, s'il vous plaît ?"

Traduções sequenciais

As traduções são processadas sequencialmente. Se você enviar grandes quantidades de texto para tradução, as traduções seguintes serão bloqueadas até que as anteriores sejam concluídas.

Para a melhor resposta às suas solicitações, divida-as e adicione uma interface de carregamento, como um indicador de carregamento, para indicar que a tradução está em andamento.

Demonstração

Você pode conferir a API Translator, usada em combinação com a API Language Detector, no playground da API Translator e Language Detector.

Esforço de padronização

Estamos trabalhando para padronizar a API Translator e garantir a compatibilidade entre navegadores.

Nossa proposta de API recebeu apoio da comunidade e foi transferida para o W3C Web Incubator Community Group para mais discussões. A equipe do Chrome pediu feedback do W3C Technical Architecture Group e pediu à Mozilla e ao WebKit as posições dos padrões.

Você pode participar do esforço de padronização entrando no grupo da comunidade do Incubator da Web.

Compartilhar feedback

Queremos saber o que você está criando com a API Language Detector. Compartilhe seus sites e aplicativos da Web com a gente no X, YouTube e LinkedIn.

Para enviar feedback sobre a implementação do Chrome, envie um relatório de bug ou uma solicitação de recurso.