In my case,i install onlyoffice documentserver through docker,which is the latest version. and it run normally, the example is also run normal ,when i follow the steps by the offical website ,and download onlyoffice-vue-demo and the spring example,when i run ‘npm run dev’, it toast the message “The document security token is not correctly formed. Please contact your document server administrator”,i need your help,thanks
this my .vue file
<template>
<DocumentEditor id="docEditor" documentServerUrl="http://192.168.31.64:8099/" :config="config"
:events_onDocumentReady="onDocumentReady" :onLoadComponentError="onLoadComponentError" />
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { DocumentEditor } from "@onlyoffice/document-editor-vue";
export default defineComponent({
name: 'ExampleComponent',
components: {
DocumentEditor
},
data() {
return {
config: {
document: {
fileType: "docx",
key: "Khirz6zTPdfd7",
title: "Example Document Title.docx",
url: "test.docx"
},
documentType: "word",
token: 'my_jwt_secret',
editorConfig: {
callbackUrl: "https://example.com/url-to-callback.ashx"
}
}
}
},
methods: {
onDocumentReady() {
console.log("Document is loaded");
},
onLoadComponentError(errorCode, errorDescription) {
switch (errorCode) {
case -1: // Unknown error loading component
console.log(errorDescription);
break;
case -2: // Error load DocsAPI from http://documentserver/
console.log(errorDescription);
break;
case -3: // DocsAPI is not defined
console.log(errorDescription);
break;
}
}
},
});
</script>
Almost the same as in the document
local.json from onlyoffice documentserver
{
"services": {
"CoAuthoring": {
"sql": {
"type": "postgres",
"dbHost": "localhost",
"dbPort": "5432",
"dbName": "onlyoffice",
"dbUser": "onlyoffice",
"dbPass": "onlyoffice"
},
"token": {
"enable": {
"request": {
"inbox": true,
"outbox": true
},
"browser": true
},
"inbox": {
"header": "Authorization",
"inBody": true
},
"outbox": {
"header": "Authorization",
"inBody": true
}
},
"secret": {
"inbox": {
"string": "my_jwt_secret"
},
"outbox": {
"string": "my_jwt_secret"
},
"session": {
"string": "my_jwt_secret"
}
}
}
},
"rabbitmq": {
"url": "amqp://guest:guest@localhost"
},
"wopi": {
"enable": false,
"privateKey": "-----BEGIN PRIVATE KEY-----\nMIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQDEmQJVvDDvWZcV\nhuwrOBOcnJ
M3i3duZzBhXrlUliLowyLauQF14vLOdO3F1Gni+g9Pm5BEr2Sn5QrY\nqMvlfUKJWbb1HsKuEQwx77lYapKf6gHHTfXBZ5ZNIIyO2TjeowE6QcoTNuF/hPO3\nb5
8mrphB20prYyKt/yMa7PByiFVSQIShOxId/MET9hY+17nlvAvlqYkE5Bum8vJ+\nwpvv+jgn/e+zNdCPc4lA4Wn+8f28ozQiRST1+JbWgvnzgWb/QAR5bsfcGkuW
yVst\nZBdek5h9HrUHHi8L6SKoltyuVz178xlKJJ4uc8LWyt6fqVNh3H1PhsFwdhXRcKiA\niI872WyJAgMBAAECggEAGXNmIiY86Ydzb9XUgMXU2CChov5a8D/L
O20RWK91Bnqt\n6kXVYrxbdY8dRvqNg1T0TXh/RT0K2VIP75DD5fTWJm98UsrwJgD5T1pQPW99MCw8\nSF/B0boGHab55fZIuUhokhuj5uKNxRM3n9wt7MqL1cln
SXP/MH+dPPub0cqaImMT\nLlmc+6bLYkhpfJ9TFh2RLxDaAp7HiqA+JChBtEH4nfdMxShSlpImJuw3lMAxA+x6\nHjKMTrujAQjN1xQNSXyCpTURPlDfzs59rbDN
32tI78XJykPq1qdIzsqsTMCOIyTj\neZLYGZRUExdf+HyMOHVuPqkcj7sshv3sxheoGeMzvwKBgQD09b/41PLrl/SDlx1f\ngvxqK8F1LqSz+1gjXMuj6qmR4cMM
wsHbyna6mN/eQ5n328uVFzF84FNDRpRoyzHi\nhMNEZnMcwkCInFhPAVCvnLxw+BhQYQkeX3VlZ8QcxJt1ES/7tvBsXP7r2kwRVDMp\nEvR0iKrfwvb9GdavnGDG
34zj7wKBgQDNdUZTICjYtzfq+6rP8Jns7jY8S72uxI9a\n5/A+hs0Dy4kcL3VL5lKN+0J4Q/9+sinecDRYQt43k2rxQTJ+iwnrcpFDAn4VrzRB\n+1SZWeq8jTSS
hX5Ig2RPwUn74Xr2dNHAVDI/iNXLNfuqHHhkUoHx6Y2ZTjH/5On5\np7WPCK7fBwKBgAFP26JaiZ6HZtDZm1eqnO14pIWbJVitbPBri8+p7xSP7/p+hIlH\n0VD4
hqJrHET+kV2QDTzM+sUueJcDF5ZN/bm9DrrFs5DHvZVWvXbjUQMN4Rt1GZZn\nDnrnjl5VEzwSRn6DoVADQ35B4gxptghvSI3jOX8PTUFXxRWVsdL+2YNTAoGAA1
a5\nitZF86eekAIA95oYVkJUvUwZzAJDth14yPtVz476LmwTAuW+R7JilSO9vihVB9lY\n8Go9xDdwEHWXxXiq85mMBMPAmsebGMtlx4wvhVriFNN4huMjuSwR8L
bsUZ76XZ7A\npkmp98Br04rc5fx1QiIie/BKXbcxmi4AhE+Gz/cCgYEA8dC5hKzrz5+Ij7p97tn/\n7DFs3AxeQq/KGA1axL4GHiA9rPlSdo/iu2kwHAua/pJYmG
00FY5vYVhm+fNuSCNz\nKetddvMJcykaomDayIH8Le8B/mfK988AwRd00aQvGbJA9N3+euA+i9UdQ8sAXhib\n1RrvPkrZZoln+jGViVyczP4=\n-----END PRI
VATE KEY-----\n",
"privateKeyOld": "-----BEGIN PRIVATE KEY-----\nMIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQDEmQJVvDDvWZcV\nhuwrOBO
cnJM3i3duZzBhXrlUliLowyLauQF14vLOdO3F1Gni+g9Pm5BEr2Sn5QrY\nqMvlfUKJWbb1HsKuEQwx77lYapKf6gHHTfXBZ5ZNIIyO2TjeowE6QcoTNuF/hPO3\
nb58mrphB20prYyKt/yMa7PByiFVSQIShOxId/MET9hY+17nlvAvlqYkE5Bum8vJ+\nwpvv+jgn/e+zNdCPc4lA4Wn+8f28ozQiRST1+JbWgvnzgWb/QAR5bsfcG
kuWyVst\nZBdek5h9HrUHHi8L6SKoltyuVz178xlKJJ4uc8LWyt6fqVNh3H1PhsFwdhXRcKiA\niI872WyJAgMBAAECggEAGXNmIiY86Ydzb9XUgMXU2CChov5a8
D/LO20RWK91Bnqt\n6kXVYrxbdY8dRvqNg1T0TXh/RT0K2VIP75DD5fTWJm98UsrwJgD5T1pQPW99MCw8\nSF/B0boGHab55fZIuUhokhuj5uKNxRM3n9wt7MqL1
clnSXP/MH+dPPub0cqaImMT\nLlmc+6bLYkhpfJ9TFh2RLxDaAp7HiqA+JChBtEH4nfdMxShSlpImJuw3lMAxA+x6\nHjKMTrujAQjN1xQNSXyCpTURPlDfzs59r
bDN32tI78XJykPq1qdIzsqsTMCOIyTj\neZLYGZRUExdf+HyMOHVuPqkcj7sshv3sxheoGeMzvwKBgQD09b/41PLrl/SDlx1f\ngvxqK8F1LqSz+1gjXMuj6qmR4
cMMwsHbyna6mN/eQ5n328uVFzF84FNDRpRoyzHi\nhMNEZnMcwkCInFhPAVCvnLxw+BhQYQkeX3VlZ8QcxJt1ES/7tvBsXP7r2kwRVDMp\nEvR0iKrfwvb9Gdavn
GDG34zj7wKBgQDNdUZTICjYtzfq+6rP8Jns7jY8S72uxI9a\n5/A+hs0Dy4kcL3VL5lKN+0J4Q/9+sinecDRYQt43k2rxQTJ+iwnrcpFDAn4VrzRB\n+1SZWeq8j
TSShX5Ig2RPwUn74Xr2dNHAVDI/iNXLNfuqHHhkUoHx6Y2ZTjH/5On5\np7WPCK7fBwKBgAFP26JaiZ6HZtDZm1eqnO14pIWbJVitbPBri8+p7xSP7/p+hIlH\n0
VD4hqJrHET+kV2QDTzM+sUueJcDF5ZN/bm9DrrFs5DHvZVWvXbjUQMN4Rt1GZZn\nDnrnjl5VEzwSRn6DoVADQ35B4gxptghvSI3jOX8PTUFXxRWVsdL+2YNTAoG
AA1a5\nitZF86eekAIA95oYVkJUvUwZzAJDth14yPtVz476LmwTAuW+R7JilSO9vihVB9lY\n8Go9xDdwEHWXxXiq85mMBMPAmsebGMtlx4wvhVriFNN4huMjuSw
R8LbsUZ76XZ7A\npkmp98Br04rc5fx1QiIie/BKXbcxmi4AhE+Gz/cCgYEA8dC5hKzrz5+Ij7p97tn/\n7DFs3AxeQq/KGA1axL4GHiA9rPlSdo/iu2kwHAua/pJ
YmG00FY5vYVhm+fNuSCNz\nKetddvMJcykaomDayIH8Le8B/mfK988AwRd00aQvGbJA9N3+euA+i9UdQ8sAXhib\n1RrvPkrZZoln+jGViVyczP4=\n-----END
PRIVATE KEY-----\n",
"publicKey": "BgIAAACkAABSU0ExAAgAAAEAAQCJbNk7j4iAqHDRFXZwwYZPfdxhU6mf3srWwnMuniRKGfN7PVeu3JaoIukLLx4HtR59mJNeF2QtW8mWSx
rcx255BED/ZoHz+YLWlvj1JEUiNKO8/fH+aeFAiXOP0DWz7/0nOPrvm8J+8vKmG+QEianlC7zludc+FvYTwfwdEjuhhEBSVYhy8OwaI/+tImNrSttBmK4mn2+384
R/4TYTykE6AaPeONmOjCBNlmfB9U3HAeqfkmpYue8xDBGuwh71tlmJQn3ly6jYCuWnZK9EkJtPD/riadTF7XTO8uJ1AbnaIsPoIpZUuV5hMGdud4s3k5ycEzgr7I
YVl1nvMLxVApnE",
"publicKeyOld": "BgIAAACkAABSU0ExAAgAAAEAAQCJbNk7j4iAqHDRFXZwwYZPfdxhU6mf3srWwnMuniRKGfN7PVeu3JaoIukLLx4HtR59mJNeF2QtW8m
WSxrcx255BED/ZoHz+YLWlvj1JEUiNKO8/fH+aeFAiXOP0DWz7/0nOPrvm8J+8vKmG+QEianlC7zludc+FvYTwfwdEjuhhEBSVYhy8OwaI/+tImNrSttBmK4mn2+
384R/4TYTykE6AaPeONmOjCBNlmfB9U3HAeqfkmpYue8xDBGuwh71tlmJQn3ly6jYCuWnZK9EkJtPD/riadTF7XTO8uJ1AbnaIsPoIpZUuV5hMGdud4s3k5ycEzg
r7IYVl1nvMLxVApnE",
vH9vKM0IkUk9fiW1oL584Fm/0AEeW7H3BpLlslbLWQXXpOYfR61Bx4vC+kiqJbcrlc9e/MZSiSeLnPC1sren6lTYdx9T4bBcHYV0XCogIiPO9lsiQ==",
"exponent": 65537,
"exponentOld": 65537
},
"storage": {
"fs": {
"secretString": "Lo9Ac3yvIN4XISX1HDlN"
}
}
}
Hello,
You need to form the correct token which you would provide within Editor’s initialization config. Please follow these steps to check:
- In the local.json configuration file (found at /etc/onlyoffice/documentserver inside the Docker container), look for the following:
"secret": {
"inbox": {"string": "yoursecret"},
"outbox": {"string": "yoursecret"},
"session": {"string": "yoursecret"}
}
- You need to generate a token (refer to https://api.onlyoffice.com/editors/security), and sign it using the secret key from the configuration file (refer to https://api.onlyoffice.com/editors/signature/).
- The payload should include the entire editor initialization configuration.
- Pass the generated token as a parameter in the editor initialization configuration (refer to https://api.onlyoffice.com/editors/config/#token)
Browser
Please do according to the above-provided documentation
hello,@DmitriiV!thanks for your help.I read the documention and followed the step, and it is very helpful for me to understand the working principle of only office。for my purpose，I just want to present a demo of only about office。I simplified the process like that:
1.install the documentserver by docker
2.start the image by JWT_ENABLED=false
3.use the .vue file like that:
<template>
<DocumentEditor id="docEditor" documentServerUrl="http://192.168.31.64:8099/" :config="config"
:events_onDocumentReady="onDocumentReady" :onLoadComponentError="onLoadComponentError" height="100 %" />
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { DocumentEditor } from "@onlyoffice/document-editor-vue";
export default defineComponent({
name: 'ExampleComponent',
components: {
DocumentEditor
},
data() {
return {
config: {
document: {
fileType: "docx",
key: "Khirz6zTPdfd7",
title: "Example Document Title.docx",
url: "http://localhost:5173/test.docx"
},
documentType: "word",
// token: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkb2N1bWVudCI6eyJmaWxlVHlwZSI6ImRvY3giLCJrZXkiOiJLaGlyejZ6VFBkZmQ3IiwidGl0bGUiOiJFeGFtcGxlIERvY3VtZW50IFRpdGxlLmRvY3giLCJ1cmwiOiJodHRwczovL2V4YW1wbGUuY29tL3VybC10by1leGFtcGxlLWRvY3VtZW50LmRvY3gifSwiZG9jdW1lbnRUeXBlIjoid29yZCJ9.7IpEJxdOvBQ0kJ8l6ZegIV4tX5vsPbZZCDDVmcFROXc",
editorConfig: {
callbackUrl: "https://www.onlyoffice.com:443/callback.ashx?from=office-suite",
"mode": "edit",
},
height: '100%',
width: '100%'
}
}
},
methods: {
onDocumentReady() {
console.log("Document is loaded");
},
onLoadComponentError(errorCode, errorDescription) {
switch (errorCode) {
case -1: // Unknown error loading component
console.log(errorDescription);
break;
case -2: // Error load DocsAPI from http://documentserver/
console.log(errorDescription);
break;
case -3: // DocsAPI is not defined
console.log(errorDescription);
break;
}
}
},
});
</script>
it works,but still have some problems:the interface of onlyoffice is shown,but the content of docx file is not shown
when i clicked “word count”, it can count the total number of doc,how can i solve this question,thanks
Hello,
Please create the separate topic for this new issue. Provide the following info there:
- The screenshot of browser’s DevTools (Console, Network tabs) when reproducing the issue
- Full Document Server logs (/var/log/onlyoffice/documentserver - inside the container)