I'm having trouble saving data from my Quill document to my mongodb instance. I can cache the data to my browser with y-indexeddb but it won't save to my mongodb instance using the provided y-mongodb-provider. Anyone got any tips? I'm following the template from the Yjs website but no luck. Thanks!
Server.js code
const WebSocketServer = require("ws");
const Y = require("yjs");
const { MongodbPersistence } = require("y-mongodb-provider");
const yUtils = require("y-websocket/bin/utils");
const express = require("express");
const server = http.createServer((request, response) => {
response.writeHead(200, { "Content-Type": "text/plain" });
response.end("okay");
});
// y-websocket
// const wss = new WebSocketServer({ server }); // gives error related to invalid URL
const WebSocket = require("ws");
const wss = new WebSocket.Server({ server });
wss.on("connection", yUtils.setupWSConnection);
/*
* y-mongodb-provider
* with all possible options (see API section below)
*/
const mdb = new MongodbPersistence(
"mongodb://localhost:27017/",
{
collectionName: "notes",
multipleCollections: true,
}
);
/*
Persistence must have the following signature:
{ bindState: function(string,WSSharedDoc):void, writeState:function(string,WSSharedDoc):Promise }
*/
yUtils.setPersistence({
bindState: async (docName, ydoc) => {
const persistedYdoc = await mdb.getYDoc(docName);
const newUpdates = Y.encodeStateAsUpdate(ydoc);
mdb.storeUpdate(docName, newUpdates);
Y.applyUpdate(ydoc, Y.encodeStateAsUpdate(persistedYdoc));
ydoc.on("update", async (update) => {
mdb.storeUpdate(docName, update);
});
},
writeState: () => {
// This is called when all connections to the document are closed.
// In the future, this method might also be called in intervals or after a certain number of updates.
return new Promise((resolve) => {
// When the returned Promise resolves, the document will be destroyed.
// So make sure that the document really has been written to the database.
resolve(true);
});
},
});
index.ts file
Quill.register("modules/cursors", QuillCursors);
const quill = new Quill(document.querySelector("#notes"), {
modules: {
cursors: true,
toolbar: [
// adding some basic Quill content features
[{ header: [1, 2, false] }],
["bold", "italic", "underline"],
["image", "code-block"],
],
history: {
// Local undo shouldn't undo changes
// from remote users
userOnly: true,
},
},
placeholder: "Start collaborating here...",
theme: "snow", // 'bubble' is also great
});
// A Yjs document holds the shared data
const ydoc = new Y.Doc();
// Sync clients with the y-webrtc provider.
const provider = new WebrtcProvider("notes-room", ydoc);
// Sync clients with the y-websocket provider
const websocketProvider = new WebsocketProvider(
"wss://localhost:80",
"notes-room",
ydoc
);
// Define a shared text type on the document
const ytext = ydoc.getText("quill");
// "Bind" the quill editor to a Yjs text type.
const binding = new QuillBinding(ytext, quill, provider.awareness);
// Remove the selection when the iframe is blurred
window.addEventListener("blur", () => {
quill.blur();
});