代码之家  ›  专栏  ›  技术社区  ›  glenatron

如何使用Typescript将文件从OneDrive下载到Angular应用程序中?

  •  0
  • glenatron  · 技术社区  · 4 年前

    我有一个Angular应用程序,它使用OneDrive/Sharepoint存储它创建的文件。身份验证工作正常,我可以成功保存文件。我在下载使用Angular HttpClient创建和存储的文件时遇到问题。

    我的代码如下所示:

    export class MicrosoftService {
    
       private graphUri = 'https://graph.microsoft.com/v1.0';
    
       constructor(private http: HttpClient) {}
    
       public loadFile(id: string, next: (saved: string) => void): void {
      
            this.http.get(this.graphUri + '/me/drive/items/' + id + '/content', { headers: this.getOAuthHeader() })
                 .subscribe((response: any) => {
                    console.log(response.toString());
                    next(response.toString());
                });
        }
    
        getOAuthHeader(): HttpHeaders {
           // a bunch of stuff that generates the OAuth headers, definitely works
        }
    
    }
    
    

    显然,当我能收到回复时,我会对它做些别的事情。

    问题是当 GET 请求被触发,它正确地向graph发出请求,然后 returns a 302 redirect 到 https://foozlecorporation-my.sharepoint.com/drive/path/_layouts/15/download.aspx?UniqueId=a-bunch-of-url-params -这也是正确的,我可以从REST客户端下载内容,但在浏览器(目前使用Safari)中,重定向会引发 Browser cannot load [...url...] due to access control checks 错误

    我有 Access-Control-Allow-Origin: * 在我的应用程序标题中,这大概就是为什么我可以首先使用Graph,但Sharepoint响应不包括 Access-Control-Allow-Origin .我还需要做什么?

    0 回复  |  直到 4 年前
        1
  •  1
  •   jub0bs    4 年前

    问题

    You write 终点 https://foozlecorporation-my.sharepoint.com/drive/path/_layouts/15/download.aspx?UniqueId=a-bunch-of-url-params 没有任何回应 Access-Control-Allow-Origin 头球。

    当您从源A向源B上的某个端点发送CORS请求时( https://graph.microsoft.com )响应允许原点A,但结果是A 交叉起源 重定向到原点C上的某个端点( https://foozlecorporation-my.sharepoint.com ),浏览器将对源站C上的源站a执行新的CORS访问控制检查。如果源站C未为CORS配置或不允许源站a,则整个CORS请求将失败。

    可能的解决方案

    一个解决方案是打电话给 https://graph.microsoft.com 从后端而不是前端;这样,因为CORS不适用于非浏览器用户代理,所以可以避开这个问题。