当Office.js使用普通Javascript工作时，为什么带有React框架的Office.js会破坏端点数据

我有两个Office.js应用程序：

用纯javascript编写的原型

反应应用

我可以在下载MSWord文档的纯javascript应用程序中成功调用端点。此文件完整、完整且未损坏

但是，React应用程序中几乎相同的代码，调用相同的端点，下载相同的MSWord文档，返回稍大的数据长度（42523 vs 40554），数据以相同的方式开始，然后更改如下：

文档数据的工作片段 80,75,3,4,20,0,6,0,8,0,0,0,33,0,7011710065533,1,0,0,32,8,0,0,19,0,8,2,91,6711111601110116,95,84121

文档数据的损坏片段 80,75,3,4,20,0,6,0,8,0,0,0,33,0,701171006346263411,1,0,0,0,32,8,0,0,19,0,8,2,91,67111110110116,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);

        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);

downloadPath=”https://myserver.com/seal-ws/v5/downloads/6bb4dfd7e0a528dc68f2069f9d5da5a732692f49";
var xhr=新的XMLHttpRequest；
打开（“获取”，下载路径）；
xhr.addEventListener（“加载”，函数（）{
var-ret=[]；
var len=this.responseText.length；
让trace=''；
对于（设i=0；i

在React应用程序中，返回损坏文件的代码如下所示：

                        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);

        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);

const downloadPath=”https://myserver.com/seal-ws/v5/downloads/6bb4dfd7e0a528dc68f2069f9d5da5a732692f49";
const xhr=新的XMLHttpRequest；
打开（“获取”，下载路径）；
xhr.addEventListener（“加载”，函数（）{
常数ret=[]；
const len=this.responseText.length；
让trace=''；
对于（设i=0；i

我使用fiddlr检查了来自这两个应用程序的传出请求，两个应用程序的格式都很好，并且彼此看起来完全相同。我不明白为什么React应用程序中的响应被破坏，代码看起来几乎相同

这不是浏览器的区别，正如我在两个应用程序上用IE测试的那样。我能想到的唯一一件事是，原型正在为XMLHttpRequest对象使用不同版本的javascript文件

纯Javascript应用程序：

C:\ProgramFiles（x86）\Microsoft Visual Studio 14.0\JavaScript\References\domWeb.js

React应用程序：

C:\Users\\AppData\Local\Programs\Microsoft VS Code\resources\app\extensions\node\u modules\typescript\lib\lib.dom.d.ts

有什么想法吗

以上是我试图实现的简化版本，以说明两种方法之间数据的轻微损坏。最终，我将尝试实现一个MSWord文档下载，然后是一个OpenNewInstance命令，如下代码所述。如上所述，以下代码在原型纯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);

const downloadPath=”https://myserver.com/seal-ws/v5/downloads/6bb4dfd7e0a528dc68f2069f9d5da5a732692f49";
const xhr=新的XMLHttpRequest；
打开（“获取”，下载路径）；
/*eslint禁用无位*/
xhr.addEventListener（“加载”，函数（）{
常数ret=[]；
const len=this.responseText.length；
console.log（'len'）；
控制台日志（len）；
让trace=''；
对于（设i=0；i>>0；
ret.push（String.fromCharCode（字节））；
}
让数据=ret.join（“”）；
数据=btoa（数据）；
控制台日志（数据）；
运行（上下文=>{
const myNewDoc=context.application.createDocument（数据）；
context.load（myNewDoc）；
返回context.sync（）。然后（（）=>{
context.sync（）；
myNewDoc.open（）；
});
});                 
}，假）；
setRequestHeader（“X-Session-Token”，XSessionToken）；
overrideMimeType（“八位字节流；字符集=x-user-defined；”；
xhr.send（空）；

由于生成不同输出的两个代码段与React无关，请尝试将其复制粘贴到两个项目中，使其具有相同的代码段

我想，问题是你这样做：

跟踪=