คลาส google.script.history (API ฝั่งไคลเอ็นต์)

google.script.history คือ JavaScript API ฝั่งไคลเอ็นต์แบบอะซิงโครนัสที่โต้ตอบกับสแต็กประวัติเบราว์เซอร์ได้ และใช้ในบริบทของเว็บแอปที่ใช้ IFRAME เท่านั้น ไม่ได้ใช้สําหรับแถบด้านข้างและกล่องโต้ตอบในบริบทส่วนเสริมหรือสคริปต์คอนเทนเนอร์ หากต้องการข้อมูลเพิ่มเติม โปรดอ่านคู่มือการใช้ประวัติการท่องเว็บในเว็บแอป

เมธอด

วิธีการประเภทการแสดงผลรายละเอียดแบบย่อ
push(stateObject, params, hash) void พุชออบเจ็กต์สถานะ พารามิเตอร์ของ URL และส่วนย่อยของ URL ที่ระบุไปยังสแต็กประวัติเบราว์เซอร์
replace(stateObject, params, hash) void แทนที่เหตุการณ์ยอดนิยมในสแต็กประวัติของเบราว์เซอร์ด้วยออบเจ็กต์สถานะ พารามิเตอร์ของ URL และส่วนย่อยของ URL ที่ระบุ
setChangeHandler(function) void ตั้งค่าฟังก์ชันเรียกกลับเพื่อตอบสนองต่อการเปลี่ยนแปลงในประวัติของเบราว์เซอร์

เอกสารประกอบโดยละเอียด

push(stateObject, params, hash)

พุชออบเจ็กต์สถานะ พารามิเตอร์ของ URL และส่วนย่อยของ URL ที่ระบุไปยังสแต็กประวัติเบราว์เซอร์ ออบเจ็กต์สถานะคือออบเจ็กต์ JavaScript แบบง่ายที่กําหนดโดยนักพัฒนาซอฟต์แวร์และอาจมีข้อมูลใดๆ ที่เกี่ยวข้องกับสถานะปัจจุบันของแอป วิธีการนี้คล้ายกับเมธอด JavaScript ของ pushState()

Index.html

var now = new Date();
var state = {
  'timestamp': now.getTime()
};
var params = {
  'options': "none"
};
google.script.history.push(state, params, "anchor1");

พารามิเตอร์

ชื่อประเภทคำอธิบาย
stateObjectObjectออบเจ็กต์ที่กําหนดโดยนักพัฒนาซอฟต์แวร์ที่จะเชื่อมโยงกับเหตุการณ์ประวัติของเบราว์เซอร์ และจะแสดงอีกครั้งเมื่อป๊อปอัปแสดงสถานะ โดยทั่วไป ใช้เพื่อเก็บข้อมูลสถานะแอปพลิเคชัน (เช่น ข้อมูลหน้าเว็บ) สําหรับการเรียกข้อมูลในอนาคต
paramsObjectออบเจ็กต์ที่มีพารามิเตอร์ของ URL ที่จะเชื่อมโยงกับสถานะนี้ เช่น {foo: “bar”, fiz: “baz”} เทียบเท่ากับ "?foo=bar&fiz=baz" หรือจะใช้อาร์เรย์ก็ได้: {foo: [“bar”, “cat”], fiz: “baz”} เท่ากับ "?foo=bar&foo=cat&fiz=baz" หากเป็น Null หรือไม่ได้ระบุ พารามิเตอร์ของ URL ปัจจุบันจะไม่มีการเปลี่ยนแปลง หากว่างเปล่า ระบบจะล้างพารามิเตอร์ของ URL
hashStringส่วนย่อยของสตริง URL ปรากฏหลังอักขระ '#' หากเป็น Null หรือไม่ได้ระบุ ส่วนย่อยของ URL ปัจจุบันจะไม่เปลี่ยนแปลง หากว่างเปล่า ระบบจะล้างส่วนย่อยของ URL


replace(stateObject, params, hash)

แทนที่เหตุการณ์ยอดนิยมในสแต็กประวัติของเบราว์เซอร์ด้วยออบเจ็กต์สถานะ (ระบุโดยนักพัฒนาซอฟต์แวร์) ที่ระบุ พารามิเตอร์ของ URL และส่วนย่อยของ URL กรณีนี้จะคล้ายกับ push()

Index.html

var now = new Date();
var state = {
  'timestamp': now.getTime()
};
var params = {
  'options': "none"
};
google.script.history.replace(state, params, "anchor1");

พารามิเตอร์

ชื่อประเภทคำอธิบาย
stateObjectObjectออบเจ็กต์ที่กําหนดโดยนักพัฒนาซอฟต์แวร์ที่จะเชื่อมโยงกับเหตุการณ์ประวัติของเบราว์เซอร์ และจะแสดงอีกครั้งเมื่อป๊อปอัปแสดงสถานะ โดยทั่วไป ใช้เพื่อเก็บข้อมูลสถานะแอปพลิเคชัน (เช่น ข้อมูลหน้าเว็บ) สําหรับการเรียกข้อมูลในอนาคต
paramsObjectออบเจ็กต์ที่มีพารามิเตอร์ของ URL ที่จะเชื่อมโยงกับสถานะนี้ เช่น {foo: “bar”, fiz: “baz”} เทียบเท่ากับ "?foo=bar&fiz=baz" หรือจะใช้อาร์เรย์ก็ได้: {foo: [“bar”, “cat”], fiz: “baz”} เท่ากับ "?foo=bar&foo=cat&fiz=baz" หากเป็น Null หรือไม่ได้ระบุ พารามิเตอร์ของ URL ปัจจุบันจะไม่มีการเปลี่ยนแปลง หากว่างเปล่า ระบบจะล้างพารามิเตอร์ของ URL
hashStringส่วนย่อยของสตริง URL ปรากฏหลังอักขระ '#' หากเป็น Null หรือไม่ได้ระบุ ส่วนย่อยของ URL ปัจจุบันจะไม่เปลี่ยนแปลง หากว่างเปล่า ระบบจะล้างส่วนย่อยของ URL

setChangeHandler(function)

ตั้งค่าฟังก์ชันเรียกกลับเพื่อตอบสนองต่อการเปลี่ยนแปลงในประวัติของเบราว์เซอร์ ฟังก์ชันเรียกกลับควรใช้ออบเจ็กต์เหตุการณ์เดียวเป็นอาร์กิวเมนต์

Index.html

google.script.history.setChangeHandler(function (e) {
  console.log(e.state);
  console.log(e.location.parameters);
  console.log(e.location.hash);

  // Adjust web app UI to match popped state here...
});

พารามิเตอร์

ชื่อประเภทคำอธิบาย
functionFunctionฟังก์ชันเรียกกลับฝั่งไคลเอ็นต์เพื่อเรียกใช้เมื่อเกิดเหตุการณ์การเปลี่ยนแปลงประวัติ โดยใช้ออบเจ็กต์เหตุการณ์เป็นอาร์กิวเมนต์เดียว

ออบเจ็กต์เหตุการณ์

ช่อง
e.state

ออบเจ็กต์สถานะที่เชื่อมโยงกับเหตุการณ์ที่ลิงก์ ออบเจ็กต์นี้เหมือนกับออบเจ็กต์สถานะที่ใช้ในเมธอด push() หรือ replace() ที่เกี่ยวข้องซึ่งเพิ่มสถานะป๊อปอัปในสแต็กประวัติ

{"page":2, "name":"Wilbur"}
e.location

ออบเจ็กต์ตําแหน่งที่เชื่อมโยงกับเหตุการณ์ที่ลิงก์

{"hash":"", "parameter":{"name": "alice", "n": "1"}, "parameters":{"name": ["alice"], "n": ["1", "2"]}}