Como pegar os dados de um arquivo JSON usando JAVASCRIPT - Acessando um JSON com JAVASCRIPT

แชร์
ฝัง
  • เผยแพร่เมื่อ 20 ธ.ค. 2024

ความคิดเห็น • 103

  • @brunarafaela9688
    @brunarafaela9688 ปีที่แล้ว +2

    caracas, você explicou até os método eu vou chorar... continue assim! vai me ajudar muito

  • @jorgeissono4669
    @jorgeissono4669 ปีที่แล้ว +2

    Amigo vc sempre se superando, parabéns.

  • @reginaldogalli2094
    @reginaldogalli2094 ปีที่แล้ว +2

    Muito obrigado. Exatamente isso que eu estava precisando.

  • @BrunoSilva-mu4mv
    @BrunoSilva-mu4mv 3 หลายเดือนก่อน

    Deus de abençoe infinitamente, era exatamente isso que eu estava precisando.

  • @VNSilva95
    @VNSilva95 ปีที่แล้ว +1

    video perfeito ajudou no meu projeto pessoal!

    • @evertondev
      @evertondev  ปีที่แล้ว

      Se precisar de ajuda tbm faço mentoria particular.

  • @IsabellaCristinaS_
    @IsabellaCristinaS_ 3 หลายเดือนก่อน

    era exatamente o que eu precisava!! Obrigada

  • @gustavoterrin7921
    @gustavoterrin7921 22 วันที่ผ่านมา

    Nossa teu video valeo muito, bem explicado obrigado.

  • @almirsilva838
    @almirsilva838 ปีที่แล้ว

    Parabéns! Muito boas estas explicações!

  • @reydsonmartins3165
    @reydsonmartins3165 ปีที่แล้ว +1

    Justamente o que eu estava procurando vlw.

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Que bom amigo, vlw

  • @miqtutoriais9670
    @miqtutoriais9670 ปีที่แล้ว

    Cara, Parabéns! Excelente vídeo, tem canal grande que não chega nem aos pés da sua explicação prática! Tem canal que a pessoa apenas lê o script e não aplica nada.

  • @michelesobrosa1339
    @michelesobrosa1339 ปีที่แล้ว

    Muito bom, Everton! Obrigada mesmo. Super me ajudou! 🤩

  • @Heidfelabel1
    @Heidfelabel1 ปีที่แล้ว +1

    Bom dia, Everton faz uma video aula explicando como conectar a pagina com um banco de dados

    • @evertondev
      @evertondev  ปีที่แล้ว

      Oi, então cara, tem que criar uma api em node se fosse o caso, eu posso fazer se você quiser.

  • @lucastomazini58
    @lucastomazini58 7 หลายเดือนก่อน +1

    Parabéns, muito bom.
    poderia fazer um video explicando como faria se um deses dados fosse um aray com mais objetos dentro, e pegar os dados deste objeto? to com esse problema e não achei nada ainda

    • @evertondev
      @evertondev  7 หลายเดือนก่อน +1

      Seria basicamente a mesma coisa, porém você teria que usar um map dentro do outro, estuda sobre matriz vai ajudar a entender.
      Qualquer coisa me chama no Instagram @Evertondev

    • @lucastomazini58
      @lucastomazini58 7 หลายเดือนก่อน

      @@evertondev ok, obrigado.

  • @thiagopires5407
    @thiagopires5407 ปีที่แล้ว

    Parabéns pelo vídeo 🎉

    • @evertondev
      @evertondev  ปีที่แล้ว

      Muito obrigada 😁

  • @cafosinhos
    @cafosinhos 2 ปีที่แล้ว +5

    Everton, se você soubesse o quanto salvou minha vida com esse vídeo... olha... nem te digo nada! hahahaha obrigadíssima por essa contribuição tão clara. Foi de muita ajuda para mim! Agora uma dúvida... existe alguma forma de eu substituir um dado do JSON utilizando uma função JS? Pensei em utilizar o replace, mas estou com dificuldades nisso.

    • @evertondev
      @evertondev  2 ปีที่แล้ว +4

      Fico feliz em saber, se você quer alterar o arquivo Bruto não é recomendado, o que você pode fazer é atualizar o objeto recebido, mas quando você atualizar a pagina os dados são perdidos.
      Se você já esta sentindo a necessidade de inserir/alterar e excluir dados em um JSON agora é a hora de começar a ver banco de dados.

  • @brunocatan
    @brunocatan 2 ปีที่แล้ว

    O melhor professor não tem como

  • @kennedyleonardo
    @kennedyleonardo ปีที่แล้ว

    video massa! Ganhou um inscrito

  • @pandaHG0
    @pandaHG0 4 หลายเดือนก่อน

    Po vei, me ajudou demais, muito obrigado

  • @musicanimada7524
    @musicanimada7524 ปีที่แล้ว +1

    Aula top

  • @ArturHenrique
    @ArturHenrique ปีที่แล้ว

    Muito legal, só verifiquei que com innerHTML ele não inclui as dentro do código fonte, no caso de produtos e serviços o Google não reconheceria essas informações, existe alguma solução pra isso?

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Neste caso não tem como ser dinâmico, você vai precisar criar as fixas.

  • @adryelmartins6943
    @adryelmartins6943 ปีที่แล้ว +1

    Professor, e se eu quero retornar exatamente da forma do vídeo, mas só que com o menor faturamento do mês de cada estado, no map eu passaria o usuário por exemplo e depois do parênteses do usuário eu colocaria element?

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      pt.stackoverflow.com/questions/435941/pegar-o-menor-valor-de-um-array-de-objetos
      Opa, achei uma resposta muito boa aqui, da uma olhada.

  • @douglassouza9096
    @douglassouza9096 ปีที่แล้ว

    Top.....adorei....

  • @cleitoncfs
    @cleitoncfs ปีที่แล้ว

    Professor, poderia fazer um video explicando como invocar o arquivo Jason em txt da pasta htdocs do Xampp.

    • @evertondev
      @evertondev  11 หลายเดือนก่อน

      cara, no caso você esta usando PHP correto? seria mais facil pegar o txt e converter em JSON e usar o JS para fazer isso, ou o no PHP usar o json_decode

  • @PalomaCardoso01
    @PalomaCardoso01 ปีที่แล้ว

    Me salvou!!! Excelente!!!

    • @evertondev
      @evertondev  ปีที่แล้ว

      Que bom que ajudou, qualquer coisa dou mentoria de programação!

  • @marcosschurmann831
    @marcosschurmann831 ปีที่แล้ว

    Olá! Aula excelente. Como faço para pegar apenas um elemento do Json. Por exemplo a idade do terceiro usuário?

    • @evertondev
      @evertondev  ปีที่แล้ว

      Pesquise pelo metodo find com ele você consegue pesquisar em um array um elemento e ele retorna apenas aquele elemento, ai você vai poder usar.

  • @gustav_spin
    @gustav_spin ปีที่แล้ว +1

    A minha principal dificuldade com o js, é o próprio js... Brinks

  • @eriveltonbezerradacosta7347
    @eriveltonbezerradacosta7347 ปีที่แล้ว +1

    Amigo o meu retorna a pagina html em branco. Precisa algum complemento>

    • @eriveltonbezerradacosta7347
      @eriveltonbezerradacosta7347 ปีที่แล้ว

      O código está idêntico

    • @evertondev
      @evertondev  ปีที่แล้ว

      Creio que você esta fazendo algo errado amigo, pode ser em adicionar o js no html por exemplo, ou não esta colocando o id certo.
      Me manda uma foto do codigo no insta. instagram.com/evertondev/

  • @EdmundoHerculano
    @EdmundoHerculano ปีที่แล้ว +1

    É possível gravar dados nesse arquivo JSON usando apenas o JavaScript? Tenho que fazer um programa simples, apenas registrar o momento q usuários clicam em alguns botões e o momento que param de assistir um vídeo. O site esta hospedado na Hostinger, não tem suporte a Asp.Net Core e nem ao NodeJS (conheço um pouco dessas).

    • @evertondev
      @evertondev  ปีที่แล้ว

      Recomendo você ativar o ssh da hospedagem e instalar o nodejs, com isso você consegue criar uma api para salvar os dados em um banco de dados como o mongodb ou mysql.
      Não recomendo editar o JSON não é uma prática segura.

    • @EdmundoHerculano
      @EdmundoHerculano ปีที่แล้ว

      @@evertondev vc tem algum vídeo sobre essa ativação do ssh?

    • @evertondev
      @evertondev  ปีที่แล้ว

      Você precisa mandar msg no suporte, e pedir para eles.

    • @EdmundoHerculano
      @EdmundoHerculano ปีที่แล้ว

      @@evertondev muito obg pela informação!! Abraços

  • @btplacar
    @btplacar ปีที่แล้ว

    olá, e se o arquivo estiver do tipo D:/PLA/CFG/CONFIG.JSON como ficaria o fatch ? , já tendei de todas as formas, mas não leu

    • @evertondev
      @evertondev  ปีที่แล้ว

      Você precisa especificar o caminho partindo do local do arquivo, para voltar a pasta usa ..

    • @btplacar
      @btplacar ปีที่แล้ว

      @@evertondev Olá, grato por sua resposta, mas, minha pasta de exercícios java fica na unidade c:\java\projetos e o arquivo que quero abrir fica na pasta D:/PLA/CFG/db.json , e mesmo colocando o caminho não abere , já tendei com file:/// e tudo que podia tentar, faça ai você um teste quando tiver tempo e me passa um feedback ok. grato

  • @DrWar-hg4tr
    @DrWar-hg4tr ปีที่แล้ว

    Opa, boa tarde o meu quando eu faço a parte do li ele fica como resultado ${usuario.nome} ele nao identifica o valor, sabe dizer como corrigir?

    • @evertondev
      @evertondev  ปีที่แล้ว

      Você esta colocando aspas simples eu acho, o certo é colocar crase `${usuario.nome}`

  • @RenanSantos7
    @RenanSantos7 ปีที่แล้ว

    Tentei fazer assim, mas o console retorna "Uncaught (in promise) SyntaxError: Unexpected token '

    • @evertondev
      @evertondev  ปีที่แล้ว

      No codigo fala qual é a linha?
      Entra no nosso servidor do Discord que eu posso te ajudar qualquer coisa.
      discord.gg/fSFj9TnT3D

  • @astropetslove6137
    @astropetslove6137 2 ปีที่แล้ว +2

    Tentei aqui mais meus navegadores não permitiram, nem o Chrome nem o Edge, falaram q deram um problema de política no CORS

    • @evertondev
      @evertondev  2 ปีที่แล้ว

      Você está fazendo acessando o arquivo ou alguma API?

    • @evertondev
      @evertondev  2 ปีที่แล้ว

      Para ser resolvido você pode aplicar um mode: cors, segue o exemplo.
      developer.mozilla.org/pt-BR/docs/Web/API/Fetch_API/Using_Fetch#fazendo_as_requisi%C3%A7%C3%B5es_fetch

    • @clarenciopessimista889
      @clarenciopessimista889 ปีที่แล้ว

      estou com o mesmo problema

    • @laerciosouza3874
      @laerciosouza3874 2 หลายเดือนก่อน

      O navegador está bloqueando a requisição ao arquivo dados.json devido à política de CORS (Cross-Origin Resource Sharing). Para resolver esse problema, você precisa hospedar os arquivos em um servidor web, mesmo que seja local. Se estiver usando o VS Code instale a extensão "Live Server"

  • @gabfpv7039
    @gabfpv7039 ปีที่แล้ว

    Muito Obrigado pelo video Everton, ajudou muito !!! Uma duvida, vamos supor que eu tenha um array com 100 objetos, mas quero apenas mostrar 10 na minha pagina, e o restante colocar nas paginas seguintes... Qual método devo usar ?

    • @evertondev
      @evertondev  ปีที่แล้ว

      É possível fazer isso utilizando vários modos, a mais simples de eu explicar por comentario basicamente você vai pegar a quantidade total, dividir pela quantidade de item que você quer mostrar em cada pagina, com isso você vai conseguir a quantidade de paginas que existe, então você consegue usar o numero da pagina para definir qual vai ser o primeiro elemento que vai aparecer naquela pagina e qual o ultimo, exemplo:
      Tenho 21 itens e que que mostre apenas 5 itens por pagina, dividindo vou ter 4,2.
      Minha primeira pagina vai ser os itens 0 * 5 + 1 até 1 * 5, na minha segunda pagina vai ser do 1 * 5 + 1 até 2 * 5, na terceira pagina vai ser do 2 * 5 + 1 até o 3 * 5, quarta pagina 3 * 5 + 1 até 4 * 5, e a ultima pagina vai ser 4 * 5 + 1 até 5 * 5, na ultima pagina vai ter apenas 1 registro mas a pagina vai ser gerada mesmo assim.

    • @evertondev
      @evertondev  ปีที่แล้ว

      www.braziljs.org/p/criando-um-sistema-de-paginacao-simples-com-javascript
      Esse artigo pode te ajudar.

  • @danielgomes2818
    @danielgomes2818 ปีที่แล้ว +1

    Muitissimo obrigado cara uma aula excelente você vai muito longe e espero mesmo para me salvar mais vezes. kkkk
    Só um duvida, como eu faço para pegar e dar um print no nome do objeto e colocar ele no html, por exemplo, fazer com que antes de José aparece o nome a que ele se refere:
    nome: José - 22 anos
    é possível pegar esse "nome" direto do JSON?
    Agradeço chefe e sucesso.

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Você pode usar o Object.keys, vou deixar um exemplo aqui em baixo.
      var myObject = { a: 'c', b: 'a', c: 'b' };
      var keyNames = Object.keys(myObject);
      console.log(keyNames); // Outputs ["a","b","c"]

  • @infodevbrasil
    @infodevbrasil ปีที่แล้ว

    Só faltou os input para inserir os dados, mas ajudou muito

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Sim, mas como o indicado em organizar informações no JSON é que apenas manipule, se for para inserir, alterar e deletar recomenda-se usar um banco de dados.

    • @infodevbrasil
      @infodevbrasil ปีที่แล้ว

      @@evertondev mas vou te falar seria de grande valia um vídeo onde vc ensinasse a pegar os dados de input de um form e organizar em um json simulado um banco de dados, oque vc me diz?

  • @alberparavel9350
    @alberparavel9350 ปีที่แล้ว

    Posso atribuir 2 arquivos de json diferentes em um mesmo método como esse? É que eu tenho 2 carrossel e não consigo fazer com que apareça na tela com um json só.

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Pode até mais, creio que seja o modo que você esta chamando o arquivo.
      Crie uma função para poder reaproveitar o retorno.

    • @alberparavel9350
      @alberparavel9350 ปีที่แล้ว

      @@evertondev me ajuda aí professor
      class Products {
      async getProducts(){
      try{
      let result = await fetch("products.json");
      let data = await result.json();
      let products = data.items;
      products = products.map(item =>{
      const {title, price} = item.fields;
      const {id} = item.sys;
      const image = item.fields.image.fields.file.url;
      return {title, price, id, image};
      });
      return products;
      }catch(error) {
      console.log(error);
      }
      }
      }
      Preciso que ele leia, mais toda vez que chamo o segundo json, dá erro e não consigo visualizar no display corretamente

  • @antonyalbuquerque7736
    @antonyalbuquerque7736 9 หลายเดือนก่อน

    Eu conseguiria escrever isso diretamente em um .txt e logo efetuar o download só utilizando os códigos? Obrigado!

    • @evertondev
      @evertondev  9 หลายเดือนก่อน +1

      Pode sim, pesquise por ActiveXObject("Scripting.FileSystemObject") que pode ajudar você

    • @antonyalbuquerque7736
      @antonyalbuquerque7736 9 หลายเดือนก่อน

      Valeu!

  • @igorgumprichcantuaria7465
    @igorgumprichcantuaria7465 ปีที่แล้ว +1

    Meu vídeo virou project.json ajuda nois

  • @eletrotech51
    @eletrotech51 ปีที่แล้ว

    Boa

  • @mangaedit1994
    @mangaedit1994 ปีที่แล้ว

    como eu faria para deletar ou atualizar esses dados?

    • @evertondev
      @evertondev  ปีที่แล้ว

      O ideal é você criar uma api e realizar uma conexão com o banco de dados, ouu armazenar no navegador, mas não seria escrito no arquivo

  • @Lg.i1
    @Lg.i1 ปีที่แล้ว

    O meu retornou o seguinte erro :
    Uncaught (in promise) SyntaxError: Expected property name or '}' in JSON at position 24
    Você poderia me ajudar já tentei de muitas formas resolver mas não consigo

    • @delfodelfo
      @delfodelfo ปีที่แล้ว

      deve ser algum erro no próprio JSON, mas precisaria olhar o arquivo em si

    • @Lg.i1
      @Lg.i1 ปีที่แล้ว +1

      Obrigado já consegui corrigir

  • @dutodiboa
    @dutodiboa ปีที่แล้ว

    Você usou o nodejs ou apenas o servidor iis?

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Neste caso não estou usando servidor, apenas estou usando o arquivo com os dados JSON.
      Se você quiser aulas particulares de desenvolvimento web para iniciantes minha mentoria esta aberta, só precisa me mandar msg no instagram @Evertondev

  • @superaula3458
    @superaula3458 ปีที่แล้ว +2

    essa resposta já e JSON ? - PORQUE PRECISO CONVERTELA DE NOVO SE O ARQUIVO JA É .JSON

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Por que a leitura do arquivo pelo fecth retorna o conteúdo da solicitação como um texto, o arquivo pode ser um Json e tem uma estrutura Json, mas o fecth quando executa retorna como fosse um texto corrido, então precisa converter para organizar a estrutura

    • @superaula3458
      @superaula3458 ปีที่แล้ว +1

      @@evertondev o retorno usuários. Mesmo eu retornando a chave do json e preciso colocar .usuários

    • @evertondev
      @evertondev  ปีที่แล้ว

      O .usuários é onde está todos os objetos por isso precisa

  • @XR55OR
    @XR55OR 11 หลายเดือนก่อน

    aaanão fessor, meu deus isso tudooo, pra conecta json com html.........

    • @evertondev
      @evertondev  11 หลายเดือนก่อน

      Para você ver, qualquer coisa só falar.

    • @XR55OR
      @XR55OR 11 หลายเดือนก่อน

      ok@@evertondev

  • @oliveiranacs
    @oliveiranacs ปีที่แล้ว +1

    é... não é fácil imprimir dados do json não

    • @evertondev
      @evertondev  ปีที่แล้ว

      Com a pratica vai chegando.

  • @Leossj1
    @Leossj1 ปีที่แล้ว

    Não tem um jeito mais simples de ler um arquivo JSON?

    • @evertondev
      @evertondev  ปีที่แล้ว +1

      Pelo incrível que pareça essa é a forma mais simples que existe.
      Se você quer apenas ver o conteúdo e não criar uma pagina html para usar os dados, você pode abrir o arquivo json no bloco de notas.
      Não sei se a pergunta foi essa mas foi isso que entendi rsrs

  • @andretaenia
    @andretaenia 7 หลายเดือนก่อน

    mais ingual