How to get file content from box.com service using ajax request?

Question

I'm trying to get the content of CSS file from box.com using direct link and attach it to the head tag, but it doesn't work.

$.ajax({                
        url: "https://app.box.com/shared/static/" + file_hash + ".css",                
        data: { client_id : '6guib1cgnk8uk2kdre45rjg7lt2xayegl94' },
        type: "GET",
        async: false,
        crossDomain: true,
        dataType: "text",
        success: function (data) {
          $("<style></style>").appendTo("head").html(data);
        },
        error: function (error) {
            console.log(error);
        }
    }
);

Cuold anyone explain how to make it work?

It returns an error Object:

Object
abort: function ( statusText ) {
always: function () {
complete: function () {
done: function () {
error: function () {
fail: function () {
getAllResponseHeaders: function () {
getResponseHeader: function ( key ) {
overrideMimeType: function ( type ) {
pipe: function ( /* fnDone, fnFail, fnProgress */ ) {
progress: function () {
promise: function ( obj ) {
readyState: 0
responseText: undefined
setRequestHeader: function ( name, value ) {
state: function () {
status: 0
statusCode: function ( map ) {
statusText: "error"
success: function () {
then: function ( /* fnDone, fnFail, fnProgress */ )

what is the error? what do you see on the console or network tab? Is it a JS error or a network/request error? Can you give an example value for `file_hash`? — bitoiu, Jun 17 '14 at 11:33
Here is an example for file_hash: https://app.box.com/shared/static/2mbz6a9olevi86oi43kk.css — Dmitry, Jun 17 '14 at 11:52
I'll have to check this at home, since I don't have access to `app.box.com` where I work. — bitoiu, Jun 17 '14 at 13:11
can you add an image of the network tab for this particular request? — bitoiu, Jun 17 '14 at 13:24
again, I don't have access to app.box so I'll check this at home. — bitoiu, Jun 17 '14 at 15:27

score 2 · Accepted Answer · edited May 23 '17 at 12:08

This is the error I receive when I execute your code:

XMLHttpRequest cannot load https://app.box.com/shared/static/2mbz6a9olevi86oi43kk.css. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://example.com' is therefore not allowed access.

The problem is that you're making a cross-domain (CORS) request, but JavaScript is limited to requesting resources on the same domain unless the target application specifically allows it.

Box does not allow CORS requests by default, but they will enable them on per-application basis. You'll need to contact Box support with a description of your use case.

How to get file content from box.com service using ajax request?

1 Answers1