2
respostas

[Dúvida] Try Catch em requisições GET e POST

No arquivo conectaApi.js eu declaro duas funções, em uma eu faço uma requisição GET e em outro um POST, e em outros dois arquivos eu chamo essas funções.

Minha dúvida está no "try catch", quando chamei a função GET, o "try catch" funcionou normalmente quando eu forcei um erro ao quebrar a URL da requisição, mesmo não tendo um "throw" em lugar nenhum, porém para a função POST cair no "catch", foi necessário fazer um "throw new Error()" quando declarei a função.

Então a minha dúvida é essa, sempre q eu fizer uma requisição POST eu terei que fazer esse "throw" para ter oq cair no "catch"? Ou eu estou errando em alguma outra coisa?

conectaApi.js:

async function listaVideos(){
    const conexao = await fetch("http://localhost:3000/videos");
    const conexaoConvertida = await conexao.json();

    return conexaoConvertida;
}

async function criaVideo(titulo, descricao, url, imagem){
    const conexao = await fetch("http://localhost:3000/videos", {
        method: "POST",
        headers: {
            "Content-type": "application/json"
        },
        body: JSON.stringify({
            titulo: titulo,
            descricao: `${descricao} mil visualizações`,
            url: url,
            imagem: imagem
        })
    });

    if(!conexao.ok){
        throw new Error("Não foi possível enviar o vídeo.");
    }

    const conexaoConvertida = await conexao.json();

    return conexaoConvertida;
}

mostrarVideos.js:

async function listaVideo(){
    try {
        const listaApi = await conectaApi.listaVideos();
        listaApi.forEach(elemento => {
            lista.appendChild(constroiCard(elemento.titulo, elemento.descricao, elemento.url, elemento.imagem));
        });
    } catch {
        lista.innerHTML = `<h2 class="mensagem__titulo">Não foi possível carregar a lista de videos.</h2>`;
    }
}

criarVideo.js

async function criarVideo(evento){
    evento.preventDefault();

    const imagem = document.querySelector("[data-imagem]").value;
    const url = document.querySelector("[data-url]").value;
    const titulo = document.querySelector("[data-titulo]").value;
    const descricao = Math.floor(Math.random() * 10).toString();

    try {
        await conectaApi.criaVideo(titulo, descricao, url, imagem);

        window.location.href = "../pages/envio-concluido.html";
    } catch(e) {
        alert(e);
    }
}
2 respostas

Olá Luis, tudo bem? Pelo que entendi, você está tendo dúvidas em relação ao uso do "try catch" em requisições GET e POST em JavaScript.

O "try catch" é utilizado para tratar erros que podem ocorrer durante a execução do código. No caso da sua função POST, você adicionou um "throw new Error()" para lançar um erro caso a conexão não seja bem sucedida. Isso significa que, caso a conexão falhe, o erro será lançado e o "catch" será executado.

No entanto, é importante lembrar que nem sempre é necessário lançar um erro manualmente para que o "catch" seja executado. Em alguns casos, a própria linguagem pode lançar um erro automaticamente, como no caso de uma requisição GET com uma URL inválida, por exemplo.

Portanto, não é necessário lançar um erro manualmente em todas as requisições POST que você fizer. Apenas adicione o "throw new Error()" caso você precise tratar um erro específico que não seja lançado automaticamente pela linguagem.

Espero ter ajudado e bons estudos!

Entendi, porém eu não consegui reproduzir um POST que lance um erro automaticamente, se eu retirar o "throw new Error()" do conectaApi.js, nunca cai no "catch", como funciona na requisição GET :/