{"id":20442988,"url":"https://github.com/mrbrunelli/consulta-fetch","last_synced_at":"2026-05-08T11:35:26.994Z","repository":{"id":122801510,"uuid":"245653205","full_name":"mrbrunelli/consulta-fetch","owner":"mrbrunelli","description":"Realizar consultas GET e POST ao backend com fetch","archived":false,"fork":false,"pushed_at":"2020-03-08T20:09:08.000Z","size":18,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-05T08:17:57.672Z","etag":null,"topics":["fetch","fetch-api","get","javascript","php","post","tutorial"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mrbrunelli.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-03-07T15:03:19.000Z","updated_at":"2020-03-11T19:47:02.000Z","dependencies_parsed_at":null,"dependency_job_id":"69ae43ae-64e2-4b0c-b874-5a1219de0435","html_url":"https://github.com/mrbrunelli/consulta-fetch","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/mrbrunelli/consulta-fetch","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrbrunelli%2Fconsulta-fetch","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrbrunelli%2Fconsulta-fetch/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrbrunelli%2Fconsulta-fetch/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrbrunelli%2Fconsulta-fetch/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mrbrunelli","download_url":"https://codeload.github.com/mrbrunelli/consulta-fetch/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrbrunelli%2Fconsulta-fetch/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32778858,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-08T08:22:46.396Z","status":"ssl_error","status_checked_at":"2026-05-08T08:22:45.650Z","response_time":54,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["fetch","fetch-api","get","javascript","php","post","tutorial"],"created_at":"2024-11-15T09:43:41.756Z","updated_at":"2026-05-08T11:35:26.979Z","avatar_url":"https://github.com/mrbrunelli.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Realizar consultas ao backend utilizando o fetch\nHoje não há mais necessidade de se usar o ajax do jquery, é possível fazer o mesmo trabalho usando o fetch, que é nativo do javascript. E podemos contar com as vantagens das promises.\n\n## Exemplo de uso com o método GET\nAo utilizar o método **GET** eu preciso passar os dados por url.\n```javascript\nfetch(`consulta.php?acao=${dados}`) // Passar conteúdo por url\n    .then(res =\u003e res.text())\n    .then(res =\u003e console.log(res))\n    catch(error =\u003e console.error(error))\n``` \n\n## Exemplo de uso com o método POST\nAo utilizar o método **POST** eu preciso de um pouco mais de código.\n```javascript\nlet dados = 'conteudo=' + conteudo // Concatenar a chave com o valor\n\nfetch('consulta.php', {\n    method: 'POST',\n    body: dados,\n    headers: {\n        'Content-Type': 'application/x-www-form-urlencoded'\n    }\n})\n.then(res =\u003e res.text())\n.then(res =\u003e console.log(res))\n.catch(error =\u003e console.error(error))\n``` \n\n## Agora eu preciso receber esses valores no meu backend\nEstou utilizando o **PHP** para receber e tratar esses conteúdos enviados.\n```php \n\u003c?php\n\nif ($_GET) { // Caso seja GET ele cairá aqui\n    $nome = $_GET['nome'];\n\n    echo \"Conteúdo recebido por GET com sucesso! Seu nome é $nome\";\n} else if ($_POST) { // Caso seja POST ele cairá aqui\n    $nome = $_POST['nome'];\n\n    echo \"Conteúdo recebido por POST com sucesso! Seu nome é $nome\";\n}\n```\n\n## Esse resultado retornará ao frontend da seguinte forma\n```javascript\n.then(resultado =\u003e resultado.text()) // Converter para texto. Caso fosse um JSON, usariamos resultado.json()\n.then(dados =\u003e console.log(dados)) // Aqui ele recupera o resultado de cima, agora eu posso usar esses dados da maneira que eu quiser.\n.catch(erro =\u003e console.error(erro)) // Caso dê erro na requisição, ele cairá aqui, e você saberá, legal né?\n``` \n\n## Espero que eu tenha te ajudado!\nFique de olho aqui no meu perfil, sempre irei postar alguns tutoriais com a tag **#tutorial**. Até a próxima!\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrbrunelli%2Fconsulta-fetch","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmrbrunelli%2Fconsulta-fetch","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrbrunelli%2Fconsulta-fetch/lists"}