У меня есть два приложения Office. js:
- Прототип, написанный на чистом javascript
- Реагирующее приложение
Я могу успешно позвонить конечная точка в чистом javascript приложении, которое загружает документ MSWord. Этот файл является целым, полным и не поврежденным.
Однако практически идентичный код в приложении React, вызывающий одну и ту же конечную точку и загружающий тот же документ MSWord, возвращает немного большую длину данных (42523 против 40554) , Данные начинаются одинаково, затем изменяются следующим образом:
Рабочий фрагмент данных документа 80,75,3,4,20,0,6,0,8,0,0,0,33,0 , 70,117,100,65533,1,0,0,32,8,0,0,19,0,8,2,91,67,111,110,116,101,110,116,95,84,121, ...
Поврежденный фрагмент данных документа 80,75,3,4,20,0,6,0,8,0,0,0,33,0,70,117,100,63462,63411,1,0,0,32,8,0,0,19, 0,8,2,91,67,111,110,116,101,110,116,95, ...
В моем (рабочем) чистом javascript приложении код выглядит так:
downloadPath = "https://myserver.com/seal-ws/v5/downloads/6bb4dfd7e0a528dc68f2069f9d5da5a732692f49";
var xhr = new XMLHttpRequest;
xhr.open("GET", downloadPath);
xhr.addEventListener("load", function () {
var ret = [];
var len = this.responseText.length;
let trace = '';
for (let i = 0; i < len; i += 1) {
trace += this.responseText.charCodeAt(i) + ",";
}
console.log(trace);
console.log(len);
}, false);
xhr.setRequestHeader("X-Session-Token", XSessionToken);
xhr.overrideMimeType("octet-stream; charset=x-user-defined;");
xhr.send(null);
В приложении React код, который возвращает поврежденный файл, выглядит следующим образом:
const downloadPath = "https://myserver.com/seal-ws/v5/downloads/6bb4dfd7e0a528dc68f2069f9d5da5a732692f49";
const xhr = new XMLHttpRequest;
xhr.open("GET", downloadPath);
xhr.addEventListener("load", function () {
const ret = [];
const len = this.responseText.length;
let trace = '';
for (let i = 0; i < len; i += 1) {
trace = `${trace}${this.responseText.charCodeAt(i)},`
}
console.log(trace);
console.log(len);
}, false);
xhr.setRequestHeader("X-Session-Token", XSessionToken);
xhr.overrideMimeType("octet-stream; charset=x-user-defined;");
xhr.send(null);
Я использовал fiddlr для проверки исходящих запросов от обоих приложений, и оба выглядят хорошо сформированными и идентичными друг другу. Я не понимаю, почему ответ в приложении React искажается из-за того, что он похож на идентичный код?
Это не является разницей в браузере, так как я протестировал IE в обоих приложениях. Единственное, о чем я могу думать, это то, что прототип использует другую версию файла javascript для объекта XMLHttpRequest.
Pure Javascript Приложение:
C: \ Программные файлы (x86) \ Microsoft Visual Studio 14.0 \ JavaScript \ References \ domWeb. js
Реактивное приложение:
C: \ Users \\ AppData \ Local \ Programs \ Microsoft VS Code \ resources \ app \ extensions \ node_modules \ typescript \ lib \ lib.dom.d.ts
Есть идеи?
Выше приведен упрощенный вариант того, что я пытаюсь достичь для того, чтобы проиллюстрировать небольшое искажение данных между двумя подходами. В конечном итоге я пытаюсь загрузить документ MSWord, а затем команду открыть новый экземпляр, как описано в следующем коде. Как подробно описано выше, следующий код работает в прототипе чистого приложения javascript, но имеет небольшое повреждение в приложении React. Полученный документ открывается правильно с чистого javascript и не удается открыть поврежденную версию из приложения React. Я уверен, что это не имеет ничего общего с React как структурой, но я изо всех сил пытался понять, какие могут быть различия, которые могут привести к неправильному декодированию полученных данных следующим образом:
const downloadPath = "https://myserver.com/seal-ws/v5/downloads/6bb4dfd7e0a528dc68f2069f9d5da5a732692f49";
const xhr = new XMLHttpRequest;
xhr.open("GET", downloadPath);
/* eslint-disable no-bitwise */
xhr.addEventListener("load", function () {
const ret = [];
const len = this.responseText.length;
console.log('len');
console.log(len);
let trace = '';
for (let i = 0; i < len; i += 1) {
trace = `${trace}${this.responseText.charCodeAt(i)},`
}
console.log(trace);
let byte;
for (let i = 0; i < len; i += 1) {
byte = (this.responseText.charCodeAt(i) & 0xFF) >>> 0;
ret.push(String.fromCharCode(byte));
}
let data = ret.join('');
data = btoa(data);
console.log(data);
Word.run(context => {
const myNewDoc = context.application.createDocument(data);
context.load(myNewDoc);
return context.sync().then(() => {
context.sync();
myNewDoc.open();
});
});
}, false);
xhr.setRequestHeader("X-Session-Token", XSessionToken);
xhr.overrideMimeType("octet-stream; charset=x-user-defined;");
xhr.send(null);