Nhúng trình soạn thảo

Phương thức

Năm phương thức save, close, destroy, setReadOnly, getInfo: giá trị trả về, thời gian chờ và ví dụ.

Trong trang này

save()
close()
destroy()
setReadOnly(readOnly)
getInfo()
Trang thử cả năm phương thức

Đối tượng trả về từ new O3O.Editor(...) có năm phương thức.

Phương thức	Trả về	Hành vi
`save()`	`Promise<{saved, version}>`	Yêu cầu lưu ngay. `saved: false` nếu không có gì để lưu hoặc đang ở `view`. Quá 30 giây: từ chối với `save_timeout`.
`close()`	`Promise<void>`	Lưu nếu còn thay đổi (chờ tối đa 10 giây), rồi `destroy()`, rồi phát `onClose`.
`destroy()`	`void`	Gỡ iframe và băng thông báo, gỡ trình nghe, báo gate đóng phiên. KHÔNG lưu. Gọi nhiều lần không lỗi.
`setReadOnly(readOnly)`	`Promise<{mode}>`	Đổi giữa `view` và `edit`: lưu thay đổi nếu có, đổi chế độ ở gate, rồi NẠP LẠI khung.
`getInfo()`	đối tượng	Đồng bộ, không gọi mạng.

save()#

Gửi lệnh lưu tới khung soạn thảo mà không kết thúc phiên sửa và không lưu khi tài liệu chưa đổi. Promise hoàn tất khi gate có phiên bản mới.

JavaScriptsave()

document.getElementById("btn-save").onclick = async () => {
  try {
    const r = await editor.save();              // { saved: boolean, version }
    alert(r.saved ? "Đã lưu phiên bản " + r.version : "Không có gì mới để lưu");
  } catch (err) {
    console.error(err);                         // ví dụ quá 30 giây: save_timeout
  }
};

close()#

JavaScriptclose()

document.getElementById("btn-close").onclick = async () => {
  await editor.close();       // lưu nếu còn thay đổi (chờ tối đa 10 giây), gỡ iframe, rồi phát onClose
};

destroy()#

Gọi DELETE /o3o/embed/session/{id} kèm keepalive, nên an toàn cả khi trang đang đóng. Phiên được đánh dấu closed nhưng lần lưu cuối của máy chủ soạn thảo vẫn được gate nhận.

JavaScriptdestroy()

// Ứng dụng một trang: gỡ trình soạn thảo khi rời màn hình. KHÔNG lưu.
router.beforeEach(() => {
  editor.destroy();           // gọi nhiều lần không lỗi
});

setReadOnly(readOnly)#

Chuyển sang edit có xét trần kết nối như khi tạo phiên: nếu đã chạm trần, phiên giữ view, promise trả {mode: "view"} và onLimitReached phát.

JavaScriptsetReadOnly()

document.getElementById("toggle").onchange = async (ev) => {
  const { mode } = await editor.setReadOnly(!ev.target.checked);   // lưu thay đổi nếu có, rồi nạp lại khung
  if (ev.target.checked && mode === "view") {
    ev.target.checked = false;   // đã chạm trần: vẫn chỉ đọc, onLimitReached đã phát
  }
};

getInfo()#

Trường của getInfo()

sessionIdstring | nullbắt buộc
null trước khi phiên tạo xong.
keystringbắt buộc
document.key
docIdstringbắt buộc
Mã tài liệu nội bộ doc_….
mode"edit" | "view"bắt buộc
Chế độ thật.
requestedMode"edit" | "view"bắt buộc
Chế độ trang đã xin.
limitedbooleanbắt buộc
true nếu bị hạ xuống chỉ đọc vì chạm trần.
loadedbooleanbắt buộc
Tài liệu đã hiện.
modifiedbooleanbắt buộc
Có thay đổi chưa lưu.
versionintegerbắt buộc
Phiên bản mới nhất đã biết.
editorOriginstringbắt buộc
Gốc của máy chủ O3O, suy từ src của api.js.

JavaScriptgetInfo()

const info = editor.getInfo();
console.log(info);
// {
//   sessionId: "ses_5b1d0c2a9f3e4d6a8b7c0d1e", key: "contract-42-v7", docId: "doc_9835f61009fc659dfedab8696f2d2665",
//   mode: "edit", requestedMode: "edit", limited: false, loaded: true, modified: false, version: 3,
//   editorOrigin: "http://localhost:8080"
// }
console.log(O3O.version);   // phiên bản của api.js

Trang thử cả năm phương thức#

HTMLmethods.html

<!doctype html>
<meta charset="utf-8">
<p>
  <button id="btn-save">save()</button>
  <label><input type="checkbox" id="toggle" checked> cho sửa</label>
  <button id="btn-info">getInfo()</button>
  <button id="btn-close">close()</button>
  <button id="btn-destroy">destroy()</button>
</p>
<div id="o3o-editor" style="height: 80vh"></div>
<script src="http://localhost:8080/o3o/api.js"></script>
<script>
  const editor = new O3O.Editor("o3o-editor", {
    document: { url: "http://localhost:8080/o3o/demo/sample.docx", title: "sample.docx", fileType: "docx", key: "methods-demo-1" },
    editor: { mode: "edit", lang: "vi", user: { id: "dev-1", name: "Dev" } },
    events: { onClose: () => console.log("onClose"), onError: (e) => console.error(e.code, e.message) }
  });
  document.getElementById("btn-save").onclick = async () => console.log(await editor.save());
  document.getElementById("toggle").onchange = async (ev) => console.log(await editor.setReadOnly(!ev.target.checked));
  document.getElementById("btn-info").onclick = () => console.log(editor.getInfo());
  document.getElementById("btn-close").onclick = () => editor.close();
  document.getElementById("btn-destroy").onclick = () => editor.destroy();
</script>

Báo lỗi hoặc góp ý cho trang nàyO3O Office Online · API v1 · Phiên bản trang 26.8.6