当我尝试从谷歌电子表格获取数据时出现 404 错误答案

【问题标题】：404 ERROR when I try to GET data from google spreadsheet当我尝试从谷歌电子表格获取数据时出现 404 错误
【发布时间】：2021-08-18 13:56:25
【问题描述】：

大家好，不知道有没有人可以帮助我。

我不知道这怎么可能，几天前一切正常，现在它停止工作了。基本上，我从网站上公开的谷歌电子表格中读取网站上的 html 表中的数据，并通过链接向所有人公开。使用 ajax。

直到现在它起作用了，我在谷歌驱动器的工作表上看到了所有数据和声音，现在它停止显示数据并返回一个匿名错误，比如我的谷歌电子表格的链接不存在，但它就在这里！！

例如在这个 googlesheet 上：https://docs.google.com/spreadsheets/d/13KmAf2uc13fWxPvn8dtk9j9kOL3nCVqi8H-wYau6Tww/edit?usp=sharing

我有一系列数据要显示在我的 html 网站上。直到几天前它还有效，现在不行了。

我使用 jquery google：src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">

我在下面公开我的代码：

<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>');
  }
});

【问题讨论】：

标签： jquery ajax get

【解决方案1】：

试试这个不需要 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>

并适应自己的风格

【讨论】：

你知道为什么在 web 上用 android work 和 ios no 吗？
XMLHttpRequest 在 Safari 上不起作用，但您现在可以根据需要将其替换为 Chrome (iso14)。或者改变我使用异步方法获取数据的方法。
对不起，你有链接可以让我学习这个方法吗？我真的需要在 ios 浏览器、Chrome 或 firefox 上也使用代码，如果我用 iPhone 和那个浏览器打开网站，你能帮我吗？我一开始以为是 ajax 问题，但现在……我不太清楚执行此操作的异步方法。
好的，我会继续努力的，请耐心等待（我回答的目的主要是为您提供要使用的新网址，而不是现在已弃用的 feed 方法）。您在请求中提到的 ajax/libs/jQuery 是否适用于 Safari/iOS？
过去是的，我曾经使用过我提到的 jquery。你的 url 工作，我真的很高兴，这比我在很多天里为修复代码所做的所有事情都要多，但是如果我尝试在网络上上传代码......用电脑或安卓手机工作，与 iPhone 上的任何其他浏览器一起使用。如果你愿意，我们可以一起工作。在过去这个库工作ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js 现在我认为我们的范围总是可以的，它过去在 safari 和 iOS 上工作过

【解决方案2】：

另一个没有 ajax 和 jQuery 的解决方案，使用 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 对于 iOS 兼容性，请改用

<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>

【讨论】：

iphone 的控制台说：我认为不规则表达式是 === data.match(/(?=?table":).*(?=});)/g)[0 ] 这不适用于 ios 设备
也许我必须使用 jquery？
嗯，尝试只使用.then(data => document.getElementById("Vinorosato").innerHTML=data 以确保匹配是原因。相当肯定 fetch() 在 iO 中不起作用。
只有：.then(data => document.getElementById("Vinorosato").innerHTML=data 显示一些框架：google.visualization.Query.setResponse({"version":"0.6", "reqId":"0","status":"ok","sig":"1939066001","table":{"cols":[{"id":"A","label":"", "type":"string"},{"id":"B","label":"","type":"string"},{"id":"C","label":"", "type":"number","pattern":"\u0022\u20AC\u0022#,##0"}],"rows":[{"c":[{"v":"Antipasto misto di mare" },{"v":"frutti di mare"}.... 我认为是匹配的原因，因为我也在 iphone 上阅读了这个带有数据的框架
对我来说是的，data.match 的格式是问题所在，因为使用 iphone 我可以阅读上面的代码，使用 iphone 上的任何浏览器我都可以看到这些数据。所以我的问题是：还有另一种打印数据的方法吗？没有` /(?=?table":).*(?=});)/g)`