-1

No meu backend eu tenho isso:

app.use('/files', express.static('upload'))

Gerando links estáticos de imagens e pdf para os usuários acessarem. No meu frontend eu coloco um botão onde o usuário pode exibir o arquivo do link estático.

Porém ao abrir a aba com o link sempre dá unauthorized, isso é devido ao middleware de autenticação. Como posso setar o headers com os dados de autenticação se quem faz a requisição e o próprio navegador e não minha aplicação?

OBS: Uma solução é eu não autenticar a rota de arquivos estáticos, porém a segurança fica comprometida.

2 Respostas 2

1

O navegador expõe diversas APIs para você desenvolver a experiência que você quer para o seu usuário.

Quando você navega para um link usando um elemento anchor , está fazendo uma requisição HTTP do tipo GET para o recurso no endpoint do link (p. ex.: http://example.com/meu-pdf) e atualizando o location do navegador.

No caso, você não quer apenas navegar, você quer fazer uma requisição HTTP do tipo GET e passando o que o seu servidor precisar no header à partir de cookies salvos ou o que seja. O javascript faz isso nativamente com o XHR.

https://developer.mozilla.org/pt-BR/docs/Web/API/XMLHTTPRequest.

Você pode utilizar o window.fetch: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API ou instalar bibliotecas como axios.

Sugiro testar chamadas e respostas em programas como postman, para descobrir exatamente o que você precisa programar no front-end com javascript. Você também irá precisar ler a documentação do seu middleware de auth para entender o que ele está pedindo.

Boa sorte

1

O caso mais simples seria você realmente não autenticar a rota de arquivos estáticos, mas acredito que você precise garantir uma segurança que os usuários acessem os arquivos apenas pela plataforma e não apenas com link. Dessa forma, eu recomendo que você crie um controller de download desses arquivos e chame esse controller através da rota a partir de sua aplicação. Dá pra fazer isso utilizando o método download do Express.

Assim você garante a autenticidade de quem está fazendo o download dos arquivos e o código fica mais coeso.

Referência do método download do Express: https://expressjs.com/pt-br/api.html#res.download

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .