[Ajuda] Como preencher automaticamente os dados do cartão em meu site?

Olá, gostaria de saber como posso fazer para que em meu ecommerce, quando o cliente for fazer o pagamento na forma de cartão, verificar se tem algum cartão salvo na conta google e se tiver aparecer para ele usar e auto preencher automaticamente. Não achei nada sobre isso, alguem poderia me ajudar? Os campos input devem ter algum id especifico para o navegador reconhecer e fazer essa verificação?

EDIT:

Consegui descobrir. Para quem quiser saber mais, o link é https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete, lá tem todos os tipos de autocomplete.

op, beleza? Acho que não é tão simples assim como você está imaginando, até porque é uma imensa falha de segurança fazer isso. O meio que eu imagino que voce precisaria usar é consumir alguma api do google pay para fazer isso. https://developers.google.com/pay/api/web/overview

Acho que o que ele está querendo saber, não é como armazenar os dados do cartão do cliente, mas é como ativar o recurso do Google Pay, o qual já tem essa funcionalidade de salvar os dados do cartão de crédito e sugerir o preenchimento de forma automática, ao fazer compras em qualquer checkout online. Respondendo a pergunta: O Google Chrome usa vários padrões para identificar que uma página se trata de um checkout e preencher os dados do cartão armazenados no Google Pay: ### 1. Elementos HTML O Chrome procura por elementos HTML específicos que são comumente usados em páginas de checkout, como: \ com o tipo "text" e o nome "cardNumber" ou similar. \ com o tipo "text" e o nome "expirationDate" ou similar. \ com o tipo "text" e o nome "cvv" ou similar. \ com o nome "state" ou similar. \ com o tipo "submit" e o valor "Comprar" ou similar. Ex.: ### 2. JavaScript O Chrome também pode usar JavaScript para identificar páginas de checkout. Ele procura por funções JavaScript que são comumente usadas para processar pagamentos, como: * Funções que validam o número do cartão, data de vencimento e CVV. * Funções que enviam os dados do cartão para um servidor de pagamento. ### 3. Metadados da página O Chrome pode analisar os metadados da página, como o título e a descrição, para determinar se a página é um checkout. ### 4. Machine Learning O Chrome usa machine learning para identificar páginas de checkout com mais precisão. O modelo de machine learning é treinado em um conjunto de dados de páginas de checkout e páginas que não são de checkout. ### 5. Experiência do usuário O Chrome também leva em consideração a experiência do usuário. Se o Chrome detectar que um usuário está tentando preencher um formulário de checkout manualmente, ele poderá oferecer a opção de preencher automaticamente o formulário com os dados do Google Pay. Basicamente, o que você deve fazer é tentar seguir estas convenções. Uma outra dica interessante, é dar uma inspensionada em alguns checkouts bem consolidados, como por exemplo o do Mercado Livre: ![](https://i.imgur.com/kL5W8yO.png)

Se ta na conta google vc não tera acesso! Mas o proprio Chrome faz isso automaticamente! Desde que os nomes dos campos estejam corretos para o Chrome entender

Então, essa era minha dúvida, qual o id do input colocar. Mas já descobri aqui. Para quem quiser saber mais, o link é https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete, lá tem todos os tipos de autocomplete.