求助：JavaScript Office Add-ins API调用外部API向PPT插入文本失败

方案1：配置开发服务器代理（本地开发首选） #

Yeoman生成的项目默认基于webpack-dev-server，通过配置代理转发请求，可直接绕开浏览器的CORS限制：

1. 打开项目根目录的webpack.config.js
2. 在devServer配置块中添加proxy字段：

devServer: {
  // 保留原有配置
  proxy: {
    '/api-proxy': { // 自定义请求前缀，用于匹配需要转发的API请求
      target: 'https://你的实际API域名', // 替换为目标API的完整域名
      changeOrigin: true,
      secure: false, // 若API使用http或证书未验证，设为false
      pathRewrite: { '^/api-proxy': '' } // 移除请求中的自定义前缀，匹配API实际路径
    }
  }
}

3. 修改API调用代码，将原完整API地址替换为相对路径，比如把fetch('https://xxx.com/api/get-text')改为fetch('/api-proxy/api/get-text')
4. 重启开发服务器后重新测试

方案2：在API服务器端配置CORS #

若有权限修改API服务器，直接添加CORS响应头允许加载项域名访问：

• Node.js/Express环境可使用cors中间件：

const cors = require('cors');
app.use(cors({
  origin: 'https://localhost:3000' // Yeoman生成的加载项本地默认域名，按实际情况修改
}));

• 其他后端框架直接设置响应头Access-Control-Allow-Origin为加载项域名，生产环境不建议设为*

方案3：使用Office内置请求方法 #

如果前两种方法无法生效，可改用Office API提供的webRequestAsync方法发起请求，该方法不受浏览器CORS规则限制：

Office.context.webRequestAsync(
  { url: '你的API完整地址' },
  function(asyncResult) {
    if (asyncResult.status === Office.AsyncResultStatus.Succeeded) {
      const responseData = JSON.parse(asyncResult.value);
      // 获取数据后调用PPT API添加文本
      PowerPoint.run(async context => {
        const slide = context.presentation.slides.getItemAt(0);
        const shape = slide.shapes.addTextbox(
          Office.MsoTextOrientation.msoTextOrientationHorizontal,
          100, 100, 300, 50
        );
        shape.textFrame.textRange.text = responseData.text;
        await context.sync();
      });
    } else {
      console.error('请求失败:', asyncResult.error.message);
    }
  }
);

内容的提问来源于stack exchange，提问作者Lara Dani