ฉันต้องการเข้าถึง Google Spreadsheets โดยใช้ JavaScript เท่านั้น (ไม่ใช่. NET, C #, Java ฯลฯ )
ฉันมาที่นี่และตกใจมากที่รู้ว่าไม่มี API สำหรับ JavaScript ในการเข้าถึง Google ชีต
โปรดบอกวิธีเข้าถึง (สร้าง / แก้ไข / ลบ) Google ชีตโดยใช้ JavaScript หรือเฟรมเวิร์กเช่น jQuery
คำตอบ:
ฉันได้สร้างไลบรารี javascript อย่างง่ายที่ดึงข้อมูลสเปรดชีตของ Google (หากมีการเผยแพร่) ผ่านทาง JSON api:
https://github.com/mikeymckay/google-spreadsheet-javascript
คุณสามารถดูการทำงานได้ที่นี่:
http://mikeymckay.github.com/google-spreadsheet-javascript/sample.html
มกราคม 2018 UPDATE : ตอนที่ผมตอบคำถามนี้ปีที่แล้วผมละเลยที่จะพูดถึงที่สามวิธีที่จะเข้าถึง Google APIs ด้วย JavaScript และที่จะมาจาก Node.js ปพลิเคชันโดยใช้ของห้องสมุดของลูกค้าดังนั้นฉันเพิ่มด้านล่าง
เป็นเดือนมีนาคม 2017และคำตอบส่วนใหญ่ที่นี่จะล้าสมัย - คำตอบที่ยอมรับในตอนนี้หมายถึงไลบรารีที่ใช้ API เวอร์ชันเก่ากว่า คำตอบที่เป็นปัจจุบันมากขึ้น: คุณสามารถเข้าถึงGoogle API ส่วนใหญ่ได้ด้วย JavaScript เท่านั้น Google มี 3 วิธีในการดำเนินการในวันนี้:
เมื่อใช้ REST API คุณต้องจัดการและจัดเก็บซอร์สโค้ดของคุณตลอดจนดำเนินการอนุญาตโดยการรีดรหัสรับรองความถูกต้องของคุณเอง (ดูตัวอย่างด้านบน) Apps Script จัดการสิ่งนี้ในนามของคุณโดยจัดการข้อมูล (ลด "ความเจ็บปวด" ตามที่ Ape-inago กล่าวไว้ในคำตอบ ) และรหัสของคุณจะถูกเก็บไว้ในเซิร์ฟเวอร์ของ Google แต่ฟังก์ชันการทำงานของคุณถูก จำกัด ไว้เฉพาะบริการที่ App Script ให้ในขณะที่ REST API ช่วยให้นักพัฒนาเข้าถึง API ได้กว้างขึ้นมาก แต่เดี๋ยวก่อนมันก็ดีที่มีทางเลือกใช่ไหม? โดยสรุปเพื่อตอบคำถามดั้งเดิมของ OP แทนที่จะเป็นศูนย์นักพัฒนามีสามวิธีในการเข้าถึง Google ชีตโดยใช้ JavaScript
นี่คือส่วนสำคัญ
คุณสามารถสร้างสเปรดชีตโดยใช้แผ่น API ขณะนี้ยังไม่มีวิธีลบสเปรดชีตโดยใช้ API (อ่านเอกสารประกอบ) ลองนึกถึง Google Docs API เป็นเส้นทางในการสร้างและค้นหาเอกสาร
คุณสามารถเพิ่ม / ลบเวิร์กชีตภายในสเปรดชีตโดยใช้ฟีดตามเวิร์กชีต
การอัปเดตสเปรดชีตจะกระทำผ่านทั้งฟีดรายชื่อตามหรือเซลล์ตามฟีด
การอ่านสเปรดชีตสามารถทำได้ผ่าน Google Spreadsheets API ที่กล่าวถึงข้างต้นหรือสำหรับแผ่นงานที่เผยแพร่เท่านั้นโดยใช้Google Visualization API Query Languageเพื่อสืบค้นข้อมูล (ซึ่งสามารถส่งคืนผลลัพธ์ในรูปแบบตาราง CSV, JSON หรือ HTML)
ลืม jQuery jQuery มีค่ามากก็ต่อเมื่อคุณข้ามผ่าน DOM เนื่องจาก GAS (Google Apps Scripting) ไม่ใช้ DOM jQuery จะไม่เพิ่มมูลค่าให้กับโค้ดของคุณ ติดวานิลลา.
ฉันแปลกใจจริงๆที่ยังไม่มีใครให้ข้อมูลนี้ในคำตอบ ไม่เพียง แต่สามารถทำได้ แต่การใช้ vanilla JS ทำได้ค่อนข้างง่าย ข้อยกเว้นเดียวคือ Google Visualization API ซึ่งค่อนข้างใหม่ (ณ ปี 2554) Visualization API ยังทำงานผ่าน URI สตริงเคียวรี HTTP เท่านั้น
มีวิธีแก้ปัญหาที่ไม่ต้องใช้วิธีใดวิธีหนึ่งในการเผยแพร่สเปรดชีต อย่างไรก็ตามแผ่นงานจะต้องเป็น "แชร์" โดยเฉพาะอย่างยิ่งต้องแชร์แผ่นงานในลักษณะที่ทุกคนที่มีลิงก์สามารถเข้าถึงสเปรดชีตได้ เมื่อเสร็จแล้วก็สามารถใช้ Google Sheets HTTP API ได้
ก่อนอื่นคุณต้องมีคีย์ Google API ไปที่นี่: https://developers.google.com/places/web-service/get-api-key NB โปรดทราบถึงความปลอดภัยของการมีคีย์ API ที่เปิดเผยต่อสาธารณะ: https://support.google.com/googleapi/answer/6310037
https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/?key={yourAPIKey}&includeGridData=truehttps://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/?key={yourAPIKey}https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/values/{sheetName}!{cellRange}?key={yourAPIKey}ตอนนี้ติดอาวุธด้วยข้อมูลนี้เราสามารถใช้ AJAX เพื่อดึงข้อมูลแล้วจัดการใน JavaScript ฉันจะแนะนำให้ใช้Axios
var url = "https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/?key={yourAPIKey}&includeGridData=true";
axios.get(url)
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
}); ปรับปรุง 2016 : วิธีที่ง่ายที่สุดคือการใช้ API ของ Google Apps Script โดยเฉพาะในบริการสเปรดชีต วิธีนี้ใช้ได้กับแผ่นงานส่วนตัวไม่เหมือนกับคำตอบอื่น ๆ ที่ต้องเผยแพร่สเปรดชีต
วิธีนี้จะช่วยให้คุณสามารถผูกโค้ด JavaScript กับ Google Sheet และเรียกใช้งานได้เมื่อเปิดแผ่นงานหรือเมื่อเลือกรายการเมนู (ที่คุณสามารถกำหนดได้)
นี่คือการเริ่มต้นอย่างรวดเร็ว / สาธิต รหัสมีลักษณะดังนี้:
// Let's say you have a sheet of First, Last, email and you want to return the email of the
// row the user has placed the cursor on.
function getActiveEmail() {
var activeSheet = SpreadsheetApp.getActiveSheet();
var activeRow = .getActiveCell().getRow();
var email = activeSheet.getRange(activeRow, 3).getValue();
return email;
}แก้ไข:สิ่งนี้ได้รับคำตอบก่อนที่ api ของ google doc จะออก ดูคำตอบของ Evan PlaiceและคำตอบของDan Dascalescuสำหรับข้อมูลที่เป็นปัจจุบันเพิ่มเติม
ดูเหมือนคุณจะทำได้ แต่มันเจ็บปวดที่ต้องใช้ เกี่ยวข้องกับการใช้ Google data API
http://gdatatips.blogspot.com/2008/12/using-javascript-client-library-w-non.html
"ไลบรารีไคลเอ็นต์ JavaScript มีวิธีการช่วยเหลือสำหรับปฏิทินรายชื่อติดต่อบล็อกเกอร์และ Google Finance อย่างไรก็ตามคุณสามารถใช้กับ Google Data API ใดก็ได้เพื่อเข้าถึงฟีดที่ตรวจสอบสิทธิ์ / ส่วนตัวตัวอย่างนี้ใช้ DocList API"
และตัวอย่างการเขียนแกดเจ็ตที่เชื่อมต่อกับสเปรดชีต: http://code.google.com/apis/spreadsheets/gadgets/
'JavaScript เข้าถึง Google เอกสาร' น่าเบื่อในการนำไปใช้และยิ่งไปกว่านั้นเอกสารของ Google ก็ไม่ใช่เรื่องง่ายที่จะได้รับ ฉันมีลิงค์ดีๆที่จะแบ่งปันซึ่งคุณสามารถเข้าถึง js ไปยัง gdoc:
http://code.google.com/apis/documents/docs/3.0/developers_guide_protocol.html#UploadingDocs
http://code.google.com/apis/spreadsheets/gadgets/
http://code.google.com/apis/gdata/docs/js.html
http://www.mail-archive.com/google-help-dataapi@googlegroups.com/msg01924.html
สิ่งเหล่านี้อาจช่วยคุณได้ ..
ขออภัยนี่เป็นคำตอบที่ไม่ดี เห็นได้ชัดว่านี่เป็นปัญหามาเกือบสองปีแล้วดังนั้นอย่ากลั้นหายใจ
นี่คือคำขออย่างเป็นทางการที่คุณสามารถทำได้ "ติดดาว" ได้
สิ่งที่ใกล้เคียงที่สุดที่คุณสามารถทำได้คือการเปิดตัวบริการของคุณเองด้วย Google App Engine / Pythonและการเปิดเผยชุดย่อยที่คุณต้องการด้วยไลบรารี JS ของคุณเอง แม้ว่าฉันอยากจะมีทางออกที่ดีกว่านี้ด้วยตัวเอง
คุณสามารถทำได้โดยใช้Sheetsee.jsและ tabletop.js
คุณสามารถอ่านข้อมูลสเปรดชีต Google ชีตใน JavaScript ได้โดยใช้ตัวเชื่อมต่อแผ่นงาน RGraph:
https://www.rgraph.net/canvas/docs/import-data-from-google-sheets.html
เริ่มแรก (ไม่กี่ปีที่ผ่านมา) สิ่งนี้อาศัยฟังก์ชั่น RGraph บางอย่างเพื่อใช้งานเวทมนตร์ - แต่ตอนนี้สามารถทำงานแบบสแตนด์อโลนได้แล้ว (เช่นไม่ต้องใช้ไลบรารีทั่วไปของ RGraph)
โค้ดตัวอย่าง (ตัวอย่างนี้สร้างแผนภูมิ RGraph):
<!-- Include the sheets library -->
<script src="RGraph.common.sheets.js"></script>
<!-- Include these two RGraph libraries to make the chart -->
<script src="RGraph.common.key.js"></script>
<script src="RGraph.bar.js"></script>
<script>
// Create a new RGraph Sheets object using the spreadsheet's key and
// the callback function that creates the chart. The RGraph.Sheets object is
// passed to the callback function as an argument so it doesn't need to be
// assigned to a variable when it's created
new RGraph.Sheets('1ncvARBgXaDjzuca9i7Jyep6JTv9kms-bbIzyAxbaT0E', function (sheet)
{
// Get the labels from the spreadsheet by retrieving part of the first row
var labels = sheet.get('A2:A7');
// Use the column headers (ie the names) as the key
var key = sheet.get('B1:E1');
// Get the data from the sheet as the data for the chart
var data = [
sheet.get('B2:E2'), // January
sheet.get('B3:E3'), // February
sheet.get('B4:E4'), // March
sheet.get('B5:E5'), // April
sheet.get('B6:E6'), // May
sheet.get('B7:E7') // June
];
// Create and configure the chart; using the information retrieved above
// from the spreadsheet
var bar = new RGraph.Bar({
id: 'cvs',
data: data,
options: {
backgroundGridVlines: false,
backgroundGridBorder: false,
xaxisLabels: labels,
xaxisLabelsOffsety: 5,
colors: ['#A8E6CF','#DCEDC1','#FFD3B6','#FFAAA5'],
shadow: false,
colorsStroke: 'rgba(0,0,0,0)',
yaxis: false,
marginLeft: 40,
marginBottom: 35,
marginRight: 40,
key: key,
keyBoxed: false,
keyPosition: 'margin',
keyTextSize: 12,
textSize: 12,
textAccessible: false,
axesColor: '#aaa'
}
}).wave();
});
</script>