Uploado File - MasterData v1 - Com middleware

[franciscoAiolfi]

Salve pessoal, estou com um desafio aqui.

Estou construindo um formulário onde o usuário vai enviar um arquivo, esse arquivo deve passar por um middleware que fiz e depois ir ao masterdata v1. Eu vi alguns pontos sobre usar um id do documento para fazer o download dele posteriormente.

Também estou usando graphql e os testes estão okay, o que está me bloquenado é como pegar esse arquivo do front, e chegar no masterdata através dessa api.

[evander.oliveira]

Acredito que você vai ter que fazer a request para salvar os dados do formulario no MasterData.

endpoint: https://{accountName}.{environment}.com.br/api/dataentities/{acronym}/documents

No ‘then’ da request, você vai chamar o seu middleware enviando o arquivo para ele e o documentID que virá na resposta da request anterior.

const response = await fetch('‘seu middleware aqui’, {
method: “POST”,
headers: {
“Content-Type”: “multipart/form-data”,
},
body: JSON.stringify(data),
});

Agora no seu middleware, você vai receber a imagem e vai fazer o processamento.

Gravando dados no master data

No body da request para o middleware, você vai ter o documentID, após isso, basta enviar para o master data com o exemplo a seguir.

Upload do Arquivo

Enviar para API: *http://api.vtex.com/{{accountName}}/dataentities/{{acronym}}/documents/{{id}}/{{field}}/attachments

• substituindo pelos seus dados.

{{id}} é o id do documento que criamos no passo anterior
{{field}} é o nome do campo que irá receber o arquivo no master data.

Agora vamos ao JS

Iniciando o FormData para construir os valores e dados

const data = new FormData(document.getElementById(idForm))

Acrescentando um novo valor em uma chave existente dentro de um objeto FormData, ou adiciona a chave se ela ainda não existir. value é padrão da vtex

data.append(‘value’, $('input#fieldId)[0].files[0]);

Agora o fetch para fazer o upload.

const response = await fetch(‘/dataentities/{{acronym}}/documents/{{id}}/{{field}}/attachments’, {
method: “POST”,
headers: {
“Content-Type”: “multipart/form-data”,
},
body: JSON.stringify(data),
});