Olá, um ótimo dia para todos!
Estou construindo uma rota GET em um app node de uma rota privada do OMS e quero consultar a resposta deste GET em um outro app react, via fetch ou axios.
Com a rota pública, tudo certo, os dados funcionam sem problemas mas gostaria que essa rota fosse acessível apenas pelo app react.
Como rota pública ela fica acessível para qualquer um por:
https://workspace--account.myvtex.com/rota
Como rota privada ela passa a ser acessível pelo “app.io.vtex.com/vendor.app/version/account/workspace/rota ”
O problema desta última opção é que mesmo liberando no policies do manifest do app react com o código abaixo, ainda recebo o mesmo erro:
Policies:
{
"name": "outbound-access",
"attrs": {
"host": "app.io.vtex.com",
"path": "*"
}
}
Erro:
{
"code": "Unauthorized",
"message": "Credential required on call to app.io.vtex.com, but it is either not present or not valid",
"source": "Vtex.Kube.Router",
"requestId": "xxx"
}
Tentei mexer aqui com a liberação por vrn na rota do app node mas também não tive sucesso nem achei exemplos que utilizem esse tipo de acesso.
Alguém já passou por essa necessidade e conseguira compartilhar uma solução?
Imagino que falte algo no header da req mas não sei qual informação passar e de onde pegar.
Obrigado!
AnaMB
August 5, 2022, 4:06pm
2
Boa tarde Henrique
Tudo bem?
Quando você deixou a rota privada, como colocou a permissão de quem pode acessa-la? (como ficou no services.json?)
2 Likes
Boa tarde AnaMB.
No Json ficou assim:
"routes": {
"orders": {
"path": "/_v/oms/orders/:skuId",
"public": false,
"access": "authorized",
"policies": [
{
"effect": "allow",
"actions": ["get"],
"principals": ["vrn:apps:*:{{account}}:{{workspace}}:app/{{account}}.*@*"]
}
]
}
}
AnaMB
August 5, 2022, 6:27pm
4
Acredito que o que está errado é seu principals, depois do
:app/
deve ser adicionado quem irá ouvir, no seu caso seria o app do react, então ficaria como:
“vrn:apps::{{account}}:{{workspace}}:app/SeuVendor.SeuApp@ ”
2 Likes
Oi AnaMB, tudo bom?
Não funcionou infelizmente
No caso, o app react vai fazer um GET diretamente na rota do app node.
Não encontrei nenhum exemplo na documentação que exemplifique esse caso de uso, no máximo sempre uma comunicação de um app node pra outro app node.
Saberia dizer se existe algum lugar documentando todas as opções de routes e policies de forma mais completa?
AnaMB
August 5, 2022, 6:57pm
6
Então, na verdade como fazemos na VTEX é não acessar rotas pelo react
Na verdade eu nunca vi até hoje alguém fazendo isso
O que eu recomendo, que eu sei que funciona, é fazer uma camada GraphQL no node para que no react você possa acessa-la usando o useQuery
1 Like
Entendi!
Vocês teriam um exemplo simples ou doc deste caso de uso?
Realmente todos os códigos que pesquisei aqui possuem essa arquitetura de usar o GraphQL por cima e depois acessar pelo useQuery mas queria evitar complexidade para manutenção futura.
Saito
August 5, 2022, 7:02pm
8
Olá!
Tentou passar o VtexIdclientAutCookie no header (do fetch ou axios) ?
AnaMB
August 5, 2022, 7:13pm
9
Tenho sim
Mas só para entender, você quer a doc de como fazer a parte do node + graphql ou do react + graphql? Ou ambos?
1 Like
Oi AnaMB,
Podem ser as duas docs, se for possível.
Obrigado
Oi Saito,
Utilizando essa opção direto no componente tenho um erro de cors.
Utilizando o valor do cookie pelo Postman ele retorna um 403 informando que meu usuário não tem acesso para utilizar GET no app/rota que solicitei.
Saito
August 5, 2022, 8:18pm
12
Opa,
Dá uma olhada na discussão que rolou na thread Authorize Masterdata API call from react (admin) to node to masterdata - #5 by sirev pois me parece que é bem similar ao teu problema.
2 Likes
AnaMB
August 8, 2022, 11:22am
13
Bom dia henriquems
As docs:
Criando o graphql (parte de serviços):
GraphQL Introdução Agora que a contagem dos produtos está atualizada, precisamos consultar os dados dos N produtos mais vistos. Para tal, é possível utilizar o Master Data para consultar os dados de visitas às páginas de produto e ordená-los pelo...
Usando o serviço (através do graphql):
Conectando a um serviço Introdução Uma app de admin acaba perdendo o seu sentido se não puder consumir dados. Sendo assim, no último passo do curso, vamos aprender como conectar sua app de admin a um serviço e, em seguida, usá-lo no front-end da...
3 Likes
Oi Saito, tudo bom?
Pelo menos nos testes que realizei aqui, colocando “public”: true ele aceita qualquer tipo de acesso independente da configuração do VRN.
Vou tentar seguir com a opção dada pela AnaMB e retorno aqui no tópico quando tiver resultado.
Obrigado pela ajuda!
1 Like
Olá pessoal,
Resolvido com a abordagem de GraphQL sugerida pela AnaMB.
Para facilitar para futuras consultas, basicamente:
Inserção dos builders de GraphQL e Node na aplicação.
Criação do graphql/schema.graphql com o type Query contendo a query, parâmetro e tipo da resposta.
Criação de arquivo na pasta graphql/types contendo o type da resposta.
No node utilizei o IOClients do pacote ‘@vtex /api’ implementando um client do OMS pelo JanusClient.
Foi criado também um resolver pra query utilizando esse client do OMS.
No React foi utilizada a abordagem com useLazyQuery do react-apollo.
Uma boa dica para quem não estiver familiarizado é estudar os códigos do vtex-apps .
Aqui baseei boa parte dos estudos no B2B Organizations GraphQL que tinha boa parte das coisas que eu queria consultar.
Obrigado pela ajuda!
2 Likes
system
Closed
August 10, 2022, 5:16pm
16
This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.