独立Angular 2应用访问SharePoint 2013 Online列表遇CORS问题求解

嘿Stefano，我来帮你搞定这个跨域问题～ 首先得明确：SharePoint本身没法直接开启CORS，尤其是你没有Azure AD的场景，但有几个靠谱的解决方案，我给你逐一拆解：

方案1：用JSONP绕过CORS限制 #

SharePoint REST API支持JSONP格式，而JSONP不受浏览器同源策略的限制，这是最快捷的临时解决方案：

• 首先在你的Angular模块中导入HttpClientJsonpModule
• 发起请求时，在URL末尾加上?format=json&callback=JSON_CALLBACK参数
• 用Angular的HttpClient.jsonp()方法替代普通的get()方法，示例代码如下：

import { HttpClientJsonpModule, HttpClient } from '@angular/common/http';

// ... 注入HttpClient后
getSharePointListItems() {
  const url = 'https://your-sharepoint-site/_api/web/lists/getbytitle(\'YourList\')/items?format=json&callback=JSON_CALLBACK';
  return this.http.jsonp(url, 'JSON_CALLBACK');
}

注意：不是所有SharePoint REST端点都支持JSONP，建议先测试你需要调用的接口是否兼容。

方案2：在SharePoint端部署代理页面/SPFx WebPart #

因为同源策略只针对浏览器，服务器端调用没有这个限制，所以可以在SharePoint站点里部署一个代理，让它作为中间层转发请求：

• ASPX代理页面：新建一个ASPX页面，后台用C#代码接收你的Ionic应用请求，调用SharePoint REST API，再把结果以JSON格式返回给前端。这种方式不需要额外框架，只要有SharePoint站点的编辑权限就能实现。
• SPFx WebPart：用SharePoint Framework写一个简单的API端点，处理跨域请求，把请求转发到内部REST API后返回结果。这种方式更灵活，适合长期维护。

方案3：使用Ionic原生HTTP插件 #

如果你的应用是部署为原生Android/iOS应用，可以用Ionic的原生HTTP插件绕过浏览器的CORS限制——因为原生插件是直接用系统的网络请求组件，不走浏览器的同源策略：

• 安装插件：

ionic cordova plugin add cordova-plugin-advanced-http
npm install @ionic-native/http

• 在Angular中注入并使用这个服务，示例代码：

import { HTTP } from '@ionic-native/http/ngx';

// ... 注入HTTP后
async getSharePointData() {
  try {
    const response = await this.http.get('https://your-sharepoint-site/_api/web/lists/getbytitle(\'YourList\')/items', {}, {});
    return JSON.parse(response.data);
  } catch (error) {
    console.error(error);
  }
}

注意：这个方案只在原生APP中生效，浏览器调试时还是会有CORS问题，这时可以用下面的调试方案。

方案4：本地调试用代理服务器 #

Ionic自带代理功能，能帮你在本地调试时绕过CORS：

• 在项目根目录的ionic.config.json中添加代理配置：

{
  "name": "YourIonicApp",
  "type": "angular",
  "proxies": [
    {
      "path": "/sharepoint-proxy",
      "proxyUrl": "https://your-sharepoint-site/_api"
    }
  ]
}

• 然后在代码中请求本地代理路径：

getListItems() {
  return this.http.get('/sharepoint-proxy/web/lists/getbytitle(\'YourList\')/items');
}

启动Ionic应用后，它会自动把/sharepoint-proxy开头的请求转发到对应的SharePoint API地址，本地调试就不会有CORS问题了。

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