Попробуйте самый простой и быстрый способ 
установки OnlyOffice

работа с API в документации отличается от того, чтоесть

Вопросы/проблемы по интеграции

работа с API в документации отличается от того, чтоесть

Сообщение Gannebal_Barka » Вт мар 14, 2017 11:19 am

Собственно сабж.
Имееется:
- сервер документов скаченный отсюда https://www.onlyoffice.com/ru/download.aspx версия записанная в api '4.2.7'
- интегрирую в vaadin приложение
- есть RestApi и все общение идет через него

Стоят такие задачи:
- пред просмотр
- переход к редактированию
- сохранение после редактирования

Как решаю:
- написал коннектор такого вида и он работает:
разверни
Код: Выделить всё
var docEditor;

window.com_myCompany_web_ui_onlyoffice_OnlyOfficeIntegration = function() {
    var version = -1;
    var userSessionId;

    this.onStateChange = function() {
        var state = this.getState();

        if(state.version !== version) {
            if(!loadDocServiceUrlApi(this)) {
                createDocEditor(this)
            }
            version=state.version;
        } else if(state.userSessionId !== userSessionId) {
            docEditor.serviceCommand("userdata", {
                "userId" : JSON.parse(state.config).editorConfig.user.id,
                "userSessionId" : state.userSessionId
            })
            userSessionId=state.userSessionId;
        }
    }
}

function createDocEditor(connector) {
    var state = connector.getState();
    if(window.docEditor && typeof(window.docEditor.destroyEditor)==="function") {
        window.docEditor.destroyEditor();
    }

    var config = JSON.parse(state.config);
    config.events = {
        "onCollaborativeChanges": function () {
                                     connector.onCollaborativeChanges();
                                 },
        "onDocumentStateChange": function (event) {
                                     connector.onDocumentStateChange(event);
                                 },
        "onDownloadAs": function (event) {
                            connector.onDownloadAs(event);
                        },
        "onError": function (event) {
                       connector.onError(event);
                   },
        "onOutdatedVersion": function () {
                                 docEditor.denyEditingRights("Не удачная попытка редактирования! Редактируемая версия устарела!");
                                 connector.onOutdatedVersion();
                             },
        "onReady": function() {
                       connector.onReady();
                   },
        "onBack": function(event) {
                      connector.onBack();
                  },
        "onSave": function(event) {
                      connector.onSave();
                      docEditor.denyEditingRights("Сохранено.");
                  }
    }

    if(state.enableEditButton) {
        config.events["onRequestEditRights"] = function () {
                                                   docEditor.applyEditRights(true, "Начал редактирование")
                                                   connector.onRequestEditRights();
                                               }
    }
    connector.getElement().id = "onlyOfficePlaceholder";
    docEditor = new DocsAPI.DocEditor(connector.getElement().id, config);
}

function loadDocServiceUrlApi(connector) {
    var state =  connector.getState();
    if(!document.getElementById('onlyOfficeApi')) {
        var onlyOfficeApi = document.createElement('script');
        onlyOfficeApi.id = 'onlyOfficeApi';
        onlyOfficeApi.src = state.docServiceUrlApi;
        onlyOfficeApi.type = 'text/javascript';
        onlyOfficeApi.async = true;
        onlyOfficeApi.defer = false;

        if (onlyOfficeApi.readyState && !onlyOfficeApi.onload) {
                //IE
                onlyOfficeApi.onreadystatechange = function() {
               if (script.readyState == "complete") {
                   onlyOfficeApi.onreadystatechange = null;
                   createDocEditor(connector);
               }
           }
        } else {
            onlyOfficeApi.onload = function() {
                createDocEditor(connector);
            }
            onlyOfficeApi.onerror = function() {
                alert( "Ошибка предпросмотра. Обратитесь к администратору.\nНе удалось загрузить скрипт: " + state.docServiceUrlApi);
            };
        }

        document.head.appendChild(onlyOfficeApi);
        return true;
    } else {
        return false;
    }
}


- для начала шлю такой конфиг
разверни
Код: Выделить всё
"{
  "documentType": "text",
  "document": {
    "title": "Example Document Title.docx",
    "url": "http://192.168.1.185:8080/app-portal/api/download?f\u003d5b080b9b-8946-b67e-eada-74f5d751b32f\u0026s\u003d09e37fec-e69e-974a-d983-5ead8cf3d86d", //тут качается файл
    "fileType": "docx",
    "key": "bd528af1-063b-b092-3cfa-ea1f49d8c873",
    "permissions": {
      "edit": true
    }
  },
  "editorConfig": {
    "mode": "view",
    "lang": "ru",
    "callbackUrl": "http://192.168.1.185:8080/app-portal/api/onlyoffice/callback",
    "user": {
      "id": "e66fd4a2-2238-fdfb-205a-0dbca16994ba",
      "name": "Glob A.A."
    }
  }
}"


C таким конфигом и скриптом файлы можно только смотреть и при загрузке вываливается сообщение о не возможности сохранения(совсем не понятно что он собрался сохранять), а при попытке редактирования умирает с таким видом
мёртвый вид
Изображение

при всем при этом в консоль браузера выпадает такая прелесть
Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

Как мне кажется вся проблема неудачной попытки редактирования заключается в том, как я делаю переход к редактированию. В документации написано что нужно использовать destroyEditor для переинициализации, но такой функции что-то не нашлось, поэтому в конфиге остается editorConfig.mode:view, а переход к редактированию попытался осуществить через docEditor.applyEditRights(true, "Начал редактирование")
Gannebal_Barka
 
Сообщения: 6
Зарегистрирован: Вт мар 14, 2017 10:33 am

Re: работа с API в документации отличается от того, чтоесть

Сообщение Ivan » Вт мар 14, 2017 3:22 pm

Здравствуйте!
Приносим свои извинения: метод destroyEditor будет доступен только начиная с версии 4.3. Документация на него опубликована преждевременно.
Переход "на лету" из просмотра в редактирование не возможно. Открытие редактора должно быть изначально при инициализации за счёт выставления в конфиге "mode": "edit".
Метод applyEditRights устаревший. Его не следует вызывать для перехода из просмотра в редактирование.
На текущий момент (до выхода 4.3 с методом destroyEditor) для перехода в редактирование следует по событию onRequestEditRights удалять iframe с редактором и инициализировать редактор заново в режиме редактирования.
Спасибо Вам за интерес к нашему продукту.
Ivan
 
Сообщения: 413
Зарегистрирован: Ср окт 26, 2016 12:53 pm

Re: работа с API в документации отличается от того, чтоесть

Сообщение Gannebal_Barka » Чт мар 16, 2017 6:59 am

Возникло еще несколько вопросов.
JS код
Код: Выделить всё
var docEditor;

window.com_my_company_ui_onlyoffice_OnlyOfficeIntegration = function() {
    var version = -1;
    var userSessionId;

    this.onStateChange = function() {
        var state = this.getState();

        if(state.version > version) {
            if(!loadDocServiceUrlApi(this)) {
                createDocEditor(this)
            }
            version=state.version;
        }
    }
}

function createDocEditor(connector) {
    var state = connector.getState();
    var element = connector.getElement();
    if(element.children && element.children.length !== 0) {
        if(typeof(window.docEditor.destroyEditor)==="function") {
            //совместимость с версией >=4.3
            window.docEditor.destroyEditor();
        } else {
            //совместимость с версией <4.3
            element.removeChild(element.firstChild);
            docEditor = null;
        }
    }

    var config = JSON.parse(state.config);
    config.events = {
        "onCollaborativeChanges": function () {
                                     connector.onCollaborativeChanges();
                                 },
        "onDocumentStateChange": function (event) {
                                     connector.onDocumentStateChange(event);
                                 },
        "onDownloadAs": function (event) {
                            connector.onDownloadAs(event);
                        },
        "onError": function (event) {
                       connector.onError(event);
                   },
        "onOutdatedVersion": function () {
                                 connector.onOutdatedVersion();
                                 setConfigViewMode(connector);
                                 createDocEditor(connector);
                             },
        "onReady": function() {
                       connector.onReady();
                   },
        "onBack": function(event) {
                      connector.onBack();
                  },
        "onSave": function(event) {
                      connector.onSave();
                  }
    }

    if(state.enableEditButton) {
        config.events["onRequestEditRights"] = function () {
                                                   connector.onRequestEditRights();
                                                   setConfigEditMode(connector);
                                                   createDocEditor(connector);
                                               }
    }
    //Создаю отдельный div т.к. DocsApi его запорет и при переоткрытии его придется удалить
    var div = document.createElement('div');
    div.id = "onlyOfficePlaceholder";
    element.appendChild(div);
    docEditor = new DocsAPI.DocEditor(div.id, config);
}

function setConfigEditMode(connector) {
    var state = connector.getState();
    var config = JSON.parse(state.config);
    config.editorConfig.mode = "edit";
    state.config = JSON.stringify(config);
    state.configVersion = state.configVersion + 1;
}

function setConfigViewMode(connector) {
    var state = connector.getState();
    var config = JSON.parse(state.config);
    config.editorConfig.mode = "view";
    state.config = JSON.stringify(config);
    state.configVersion = state.configVersion + 1;
}

function loadDocServiceUrlApi(connector) {
    var state =  connector.getState();
    if(!document.getElementById('onlyOfficeApi')) {
        var onlyOfficeApi = document.createElement('script');
        onlyOfficeApi.id = 'onlyOfficeApi';
        onlyOfficeApi.src = state.docServiceUrlApi;
        onlyOfficeApi.type = 'text/javascript';
        onlyOfficeApi.async = true;
        onlyOfficeApi.defer = false;

        if (onlyOfficeApi.readyState && !onlyOfficeApi.onload) {
                //IE
                onlyOfficeApi.onreadystatechange = function() {
               if (script.readyState == "complete") {
                   onlyOfficeApi.onreadystatechange = null;
                   createDocEditor(connector);
               }
           }
        } else {
            onlyOfficeApi.onload = function() {
                createDocEditor(connector);
            }
            onlyOfficeApi.onerror = function() {
                alert( "Ошибка предпросмотра. Обратитесь к администратору.\nНе удалось загрузить скрипт: " + state.docServiceUrlApi);
            };
        }

        document.head.appendChild(onlyOfficeApi);
        return true;
    } else {
        return false;
    }
}

Конфиг предпросмотра
Код: Выделить всё
"{
 "width": "100%",
 "height": "100%",
 "documentType": "text",
 "document": {
  "title": "Example Document Title.docx",
  "url": "http://192.168.1.185:8080/app-portal/api/download?f=b444bb19-db21-0772-5204-16834131ee32&s=f0097924-fccc-9b28-c837-070c890db773",
  "fileType": "docx",
  "key": "88c40323-cc54-3538-0",
  "permissions": {
   "edit": true
  }
 },
 "editorConfig": {
  "canAutosave": false,
  "mode": "view",
  "lang": "ru",
  "callbackUrl": "http://192.168.1.185:8080/app-portal/api/onlyoffice/callback?s=f0097924-fccc-9b28-c837-070c890db773",
  "user": {
   "id": "e66fd4a2-2238-fdfb-205a-0dbca16994ba",
   "name": "Glob A.A."
  },
  "customization": {
   "autosave": false
  }
 },
 "events": {<смотри JS скритп>}
}"

Конфиг редактирования
Код: Выделить всё
"{
 "width": "100%",
 "height": "100%",
 "documentType": "text",
 "document": {
  "title": "Example Document Title.docx",
  "url": "http://192.168.1.185:8080/app-portal/api/download?f=b444bb19-db21-0772-5204-16834131ee32&s=7079997f-3807-acc2-0211-d803aa772295",
  "fileType": "docx",
  "key": "88c40323-cc54-3538-0",
  "permissions": {
   "edit": true
  }
 },
 "editorConfig": {
  "canAutosave": false,
  "mode": "edit",
  "lang": "ru",
  "callbackUrl": "http://192.168.1.185:8080/app-portal/api/onlyoffice/callback?s=7079997f-3807-acc2-0211-d803aa772295",
  "user": {
   "id": "e66fd4a2-2238-fdfb-205a-0dbca16994ba",
   "name": "Glob A.A."
  },
  "customization": {
   "autosave": false
  }
 },
 "events": {<смотри JS скрипт>}
}"

Возникли следующие вопросы:
- не происходит события onSave при нажатии кнопки сохранить
- как можно удалить компонент не перезагружая страницу?(компонент создал заного см. JS скрипт, а он продолжает ловить события) или придется ждать версии 4.3?
Gannebal_Barka
 
Сообщения: 6
Зарегистрирован: Вт мар 14, 2017 10:33 am

Re: работа с API в документации отличается от того, чтоесть

Сообщение Gannebal_Barka » Чт мар 16, 2017 8:10 am

Возник еще вопрос. У вас в документации написано, что key должен быть не более 20 символов, но в то же время в примере передается ключ длинной в 29 символов.
Могу ли я использовать в качестве ключа стандартный UUID (36 символов)?
Gannebal_Barka
 
Сообщения: 6
Зарегистрирован: Вт мар 14, 2017 10:33 am

Re: работа с API в документации отличается от того, чтоесть

Сообщение Ivan » Ср мар 22, 2017 9:00 am

Добрый день!
1) Событие onSave не происходит, так как данный метод использовался только до версии 2.5 и на сегодняшний момент не работает. Начиная с версии 3.0 для сохранения используется механизм callbackUrl.
2) К сожалению, в текущей версии удаление документа без перезагрузки работать не будет. Ситуация будет исправлена с выходом версии 4.3. Мы уведомим Вас о релизе в разделе Announcements.
3) Вы можете использовать key длиной 36 символов. Мы рекомендуем использовать не более 20 символов, так как key используется как имя каталога в хранилище.
Всегда рады помочь и выслушать Ваши предложения.
Ivan
 
Сообщения: 413
Зарегистрирован: Ср окт 26, 2016 12:53 pm


Вернуться в API

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 2

cron