404 ERROR when I try to GET data from google spreadsheet

user_11999064 0
Viewed 349

Hy everyone, I don't know if exit someone who can help me.

I don't know how it is possible, few days ago all ok now it stop to work. Basically I read data in a html table on a website from a google spreadsheet public on website and public to everyone with the link. Using ajax.

Until now it worked, i saw all the datas and voices presents on my sheet in google drive, now it stop to show the datas and return an anonymous error like if the link to my google spreadsheet is inexistent, but it is here!!

For example on this googlesheet: https://docs.google.com/spreadsheets/d/13KmAf2uc13fWxPvn8dtk9j9kOL3nCVqi8H-wYau6Tww/edit?usp=sharing

I Have a series of data to display on my html website. Until few days ago it worked, now no.

I used jquery google : src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">

I public my code below:

<script>
$.getJSON("https://spreadsheets.google.com/feeds/list/13KmAf2uc13fWxPvn8dtk9j9kOL3nCVqi8H-wYau6Tww/od6/public/values?alt=json", function (data) {
  var sheetData = data.feed.entry;
  var i;
  for (i = 0; i < sheetData.length; i++) {
    var nome = data.feed.entry[i]['gsx$_cn6ca']['$t'];
    var ingredienti = data.feed.entry[i]['gsx$_cokwr']['$t'];
    var prezzo = data.feed.entry[i]['gsx$_cpzh4']['$t'];
    document.getElementById('Vinorosato').innerHTML += ('<div class="Teglie menu-restaurant">'+'<span class="clearfix">'+'<a class="menu-title" style="padding-right: 50px;">'+nome+'</a>'+'<span class="menu-price">'+prezzo+'</span>'+'</span>'+'<span class="menu-subtitle" style="padding-right: 100px;">'+ingredienti+'</span>'+'</div>');
  }
});

enter image description here

get jquery ajax
2 Answers

Try this code that doesn't require jQuery

<html><body>
<script>

function reqListener () {
  var jsonString = this.responseText.match(/(?<="table":).*(?=}\);)/g)[0];
  var json = JSON.parse(jsonString);
  var table = '<table>'
  for (var i=0;i<json.rows.length;i++){
    var nome = json.rows[i].c[0].v;
    var ingredienti = json.rows[i].c[1].v;
    var prezzo = json.rows[i].c[2].v;
    table += '<tr><td>' + nome + '</td><td>' + ingredienti + '</td><td>' + prezzo + '&nbsp;&euro;</td></tr>'
  }
  table += '</table>'
  document.getElementById("Vinorosato").innerHTML = table;
}

var id = '13KmAf2uc13fWxPvn8dtk9j9kOL3nCVqi8H-wYau6Tww';
var gid = '0';
var url = 'https://docs.google.com/spreadsheets/d/'+id+'/gviz/tq?tqx=out:json&tq&gid='+gid;
var oReq = new XMLHttpRequest();
oReq.onload = reqListener;
oReq.open("get", url, true);
oReq.send();
 
</script>
<div id="Vinorosato">&nbsp;</div></body></html>

and adapt with your own style

user_150193800

Another solution without ajax and jQuery, using fetch https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

<html><body>

<script>
var id = '13KmAf2uc13fWxPvn8dtk9j9kOL3nCVqi8H-wYau6Tww';
var gid = '0';
var url = 'https://docs.google.com/spreadsheets/d/'+id+'/gviz/tq?tqx=out:json&tq&gid='+gid;
fetch(url)
  .then(response => response.text())
  .then(data => document.getElementById("Vinorosato").innerHTML=myItems(data.match(/(?<="table":).*(?=}\);)/g)[0]) 
  );
function myItems(jsonString){
  var json = JSON.parse(jsonString);
  var table = '<table>'
  for (var i=0;i<json.rows.length;i++){
    var nome = json.rows[i].c[0].v;
    var ingredienti = json.rows[i].c[1].v;
    var prezzo = json.rows[i].c[2].v;
    table += '<tr><td>' + nome + '</td><td>' + ingredienti + '</td><td>' + prezzo + '&nbsp;&euro;</td></tr>'
  }
  table += '</table>'
  return table
}
</script>

<div id="Vinorosato">List ...</div>

</body></html>

https://codepen.io/mikesteelson/pen/YzQKere For iOS compatibilty, use instead

<html><body>

<script>
var id = '13KmAf2uc13fWxPvn8dtk9j9kOL3nCVqi8H-wYau6Tww';
var gid = '0';
var url = 'https://docs.google.com/spreadsheets/d/'+id+'/gviz/tq?tqx=out:json&tq&gid='+gid;
fetch(url)
  .then(response => response.text())
  .then(data => document.getElementById("Vinorosato").innerHTML=myItems(data.substring(117).slice(0, -3))
  );
function myItems(jsonString){
  var json = JSON.parse(jsonString);
  var table = '<table>'
  for (var i=0;i<json.rows.length;i++){
    var nome = json.rows[i].c[0].v;
    var ingredienti = json.rows[i].c[1].v;
    var prezzo = json.rows[i].c[2].v;
    table += '<tr><td>' + nome + '</td><td>' + ingredienti + '</td><td>' + prezzo + '&nbsp;&euro;</td></tr>'
  }
  table += '</table>'
  return table
}
</script>

<div id="Vinorosato">List ...</div>

</body></html>
user_150193800
Related