Level up your Box knowledge with brand new learning paths on Box University. Visit training.box.com to get started

AJAX - No 'Access-Control-Allow-Origin' header error, despite passing valid header

New post

Comments

3 comments

  • Priyajeet

    Access-Control-Allow-Origin header is something you cannot append with your request. It's the server's response that will add it, assuming your application has that domain whitelisted. There is a text box to whitelist your domain under the configuration page of your application in the developer console. Enter it there. 

     

    2000.png

     

    You can learn more about CORS here https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

     

    0
    Comment actions Permalink
  • MangoCats

    Bumping an old thread... similar issue, but with a twist:

     

    I have registered a CORS Domain allowed origin of: https://192.168.??.??:3000 and I have been using the folder contents and make folders API endpoints

     

    https://api.box.com/2.0/folders/'+id.toString()+'/items?limit=1000&fields=id,type,name 

    https://api.box.com/2.0/folders

     

    with no problems - successfully retrieving folder contents and creating new nested sub-folders using AngularJS (1.7.9).  However, when I try to use the Upload file API:

     

    https://upload.box.com/api/2.0/files/content

     

    I am getting this error in my Chrome Developer Tools window:

     

    Access to XMLHttpRequest at 'https://upload.box.com/api/2.0/files/content' from origin 'https://192.168.67.15:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 

     

    I also tried specifically adding the full IP address (no wildcards) to the CORS list, and using localhost, same result.

     

    What is different about the upload API vs the folders APIs?  More to the point, how can I get my file upload to start working?

     

    The response received in the Angular $http.post error handler doesn't reveal much:

     

        {"data":null,

        "status":-1,

        "config":{"method":"POST",

                      "transformRequest":[null],

                      "transformResponse":[null],

                      "jsonpCallbackParam":"callback",

                      "headers":{"Authorization":"Bearer xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",

                                        "Content-Type":"multipart/form-data",

                                        "Accept":"application/json, text/plain, */*"},

                      "url":"https://upload.box.com/api/2.0/files/content",

                   "data":{"attributes":{"name":"testFileName","parent":{"id":"0"}},

                                         "file":"mary had a little lamb."

                              }

                     },

        "statusText":"",

        "xhrStatus":"error"}

     

     

    Update: The "Try this API" in the documentation https://developer.box.com/reference/post-files-content/ also fails with "An unknown error occured"

     

    0
    Comment actions Permalink
  • jim smith

    If you try to make a cross-origin request and your server isn't set up correctly, you'll get the warning "No 'access-control-allow-origin' header is present on the requested resource." You'll need to either configure your server to handle cross-domain requests or find a means to get around the difficulty by using non-cross-domain requests instead. https://kodlogs.net/313/no-access-control-allow-origin-header-is-present-on-the-requested-resource-jquery

    0
    Comment actions Permalink

Post is closed for comments.