How can I resolve CORS problems when accessing the SharePoint-API via AJAX-request?

Question

I have setup a Dynamics-Portal for a customer. The customer wants to display images from SharePoint on the Portal.

My idea was using jQuery with Ajax to access the SharePoint-API.

Since my experience with web programming is rather limited, I need help to understand the errors that I'm getting.

After some reading this was my first attempt:

$.ajax({
          url: "https://example.SharePoint.com/_api/web/GetFolderByServerRelativeUrl('/ImageFolder')/Files",
          type: 'GET',
          Accept: "application/json;odata=verbose",
          crossDomain: true,
          contentType: 'application/json;odata=verbose',
          dataType: 'json',
          xhrFields: { withCredentials: true }
        })

This produces the following error:

Access to XMLHttpRequest at 'https://example.SharePoint.com/_api/web/GetFolderByServerRelativeUrl('/ImageFolder')/Files'
    from origin 'https://myDynamicsPortal.com' has been blocked by CORS policy:
    Response to preflight request doesn't pass access control check:
    The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.
    The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Now I change the above Ajax by adding "?callback=?" to the URL. Like this:

url:"https://example.SharePoint.com/_api/web/.../Files?callback=?"

Which seems to do the same as changing:

dataType: 'json'
to
dataType: 'jsonp'

The error is gone but this warning apears instead:

Cross-Origin Read Blocking (CORB) blocked cross-origin response
https://example.SharePoint.com/_api/web/GetFolderByServerRelativeUrl('/ImageFolder')/Files?callback=jQuery13423412342134134_1234123412341234&_=12341341234 
with MIME type application/atom+xml.

See https://www.chromestatus.com/feature/5629709824032768 for more details.

The status code is 200 but the error: "JQuery13423412342134134_1234123412341234 was not called" shows up.

What I understood/interpreted from these errors, warnings and my research is this:

Once credentials are necessary the server can no longer use the wildcard for the allowed origins. Since I'm unable to change the SharePoints origin policy I looked for other ways to resolve the problem.

Seemingly the server did not understand that I expected a callback, because I did not configure "jsonp" or "?callback=?". After doing so the error is gone but it appears, that my Portal will not accept the response due to CORB (Cross Origin Read Blocking).

Why does SharePoint suddenly accept my request? (or does it?)

Why do I get a http 200 success - but this error:

"JQuery13423412342134134_1234123412341234 was not called"

together with a parsing error?

Thanks in advance and best regards

Jek

score 0 · Answer 1 · answered Jul 26 '19 at 10:49

0

Try add the code (support.cors):

$.support.cors = true;

answered Jul 26 '19 at 10:49

Mikhail Zhuikov

1,213
2
9
19

Thanks, for the suggestion. In the meanitme I found out, that it is not possible in my scenario, since I cannot change the CORS-Settings of SharePoint. – Jek Jul 29 '19 at 19:27

score 0 · Accepted Answer · answered Jul 29 '19 at 19:28

0

Aparently this is not possible in this scenario, since I cannot change the CORS-Settings of SharePoint. The solution seems to be SharePoint add-ins.

answered Jul 29 '19 at 19:28

Jek

9
2

How can I resolve CORS problems when accessing the SharePoint-API via AJAX-request?

2 Answers2