Node.js 办公室JS CORS问题

我一直在尝试使用OfficeJavaScriptAPI创建一个简单的函数，登录到我公司在本地机器上托管的on-prem服务器，并获取响应。我使用了

Vue JS

作为我的前端框架，使用

axios

处理HTTP/S请求

以下是axios调用的代码：

import Vue from "vue";
import Vuex from "vuex";

const axios = require('axios').default;

axios.defaults.crossDomain = true;
Vue.use(Vuex);

/**
 * Network interactions and state manager
 */
const Network = new Vuex.Store({
    state: {
        url: 'http://127.0.0.1', //localhost by default
        user: '',
        pass: ''
    },
    getters: {

    },
    mutations: {
        setLoginCreds(state, payload) {
            state.url = payload.url;
            state.user = payload.user;
            state.pass = payload.pass;
        },
    },
    actions: {
        async login(context, { url, user, pass }) {
            let route = '/core/loginguest';

            let path = url + route;

            await axios({
                url: path,
                method: 'POST',
                params: {
                    userid: user,
                    password: pass
                }
            }).then(response => {
                console.log(response)
                if (response.status == 200) {
                    context.commit('setLoginCreds', { url, user, pass })
                }
            }).catch(err => {
                console.log('Exception hit!')
                console.log(err)
            })
        },
    }
});

export default Network;

在Word上运行此命令时，我在登录时遇到以下错误（使用Microsoft Edge dev工具查看）：

SEC7120:[CORS]原点的https://localhost:3000“没有找到”https://localhost:3000'在位于的跨源资源的访问控制允许源响应标头中'http://127.0.0.1/core/loginguest?userid=hari&password=hari1234"

据我所知，CORS问题源于

访问控制允许来源：

不存在于服务器的响应头中，但我在Electron.js上使用相同的调用时没有遇到这种情况

---

这只是另一个CORS问题，让我任由服务器摆布，还是我可以从客户端控制它？

因此，为了澄清，OP询问为什么托管在

localhost:3000

的外接程序不能调用位于

localhost:80

的本地服务器，从而导致CORS问题

这是意料之中的。以下是一些要查看的资源：

原点由URL的方案、主机和端口定义

当web应用程序请求的资源与自己的源（域、协议或端口）不同时，会执行跨源HTTP请求

在您的情况下，端口不同，因此您必须在服务器上启用CORS。默认情况下，它是不允许的，所以无论您的配置是什么，您都必须更新它

当您从Postman调用同一端点时，没有出现此问题的原因是，因为Postman不是浏览器，因此不受CORS规则的约束。当您通过浏览器从一个资源调用另一个资源时，CORS将应用。对于来自非浏览器源的请求，您不会遇到此问题

以下是为您提供的几个关键答案：

• 联络主任/邮递员：
• 同域CORS/

---

你可以实施一个小技巧，我不知道在你的情况下是否可行
您可以通过Exchange和外接程序设置NGINX
您可以将NGINX上的

/your/api/route

之类的路由映射到您的应用程序，其余的所有调用都可以转移到exchange来处理

server{
    server_name yourdomain.tld;

    # Requests to be managed by your add-in
    location /api {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    # Requests to be managed by exchange
    location / {
        proxy_pass http://localhost:4000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    listen 80;
}

---

通过这样做，exchange和外接程序将在同一端口上工作（无论您配置什么），cors将不会成为问题。
如果使用

http://localhost

而不是

http://127.0.0.1

您的URL？如果添加带有凭据的axios选项

：true

，会发生什么情况？您的服务器是否使用cors npm包？据我所知，服务器没有使用

cors npm

包。根据Office JS策略，承载Office插件的应用程序需要使用HTTPS进行安全保护，因此不能真正使用HTTPS。我使用凭据尝试了

，但没有成功。此加载项托管在何处？换句话说，您的office加载项清单中的URL是什么？清单中的URL是
https://localhost:3000
@HariMohan您的onprem服务器的url是什么？