ajax doesnt follow dropbox redirect

Question

I'm trying to wrangle a JSONP call from a dropbox public folder out of a HTML page on a different site (hence I need jsonp to avoid cross-site issues).

My javascript code complains because its getting HTML instead of JSON.

 $.ajax({
        url: "https://www.dropbox.com/s/fzqhnr39fq45ijh/gen_info.json?dl=0",
        jsonp: "callback",
        dataType: "jsonp",

        // Work with the response
        success: function( response ) {
            console.log( response ); // server response
        }
    });

If I copy the exact URL from the firebug console and try that with wget I get the correct file contents. However, as you can see, there is a redirect taking place. the contents of the debugging window suggest that ajax is trying to display the HTML of the first URL and not following the redirect

$wget -O try.txt 'https://www.dropbox.com/s/fzqhnr39fq45ijh/gen_info.json?dl=0&callback=jQuery31100535301754706522_1475816277772&_=1475816277773'
--2016-10-07 15:35:25--  https://www.dropbox.com/s/fzqhnr39fq45ijh/gen_info.json?dl=0&callback=jQuery31100535301754706522_1475816277772&_=1475816277773
Resolving www.dropbox.com... 108.160.172.238
Connecting to www.dropbox.com|108.160.172.238|:443... connected.
HTTP request sent, awaiting response... 302 Found
Location: https://dl.dropboxusercontent.com/content_link/OCqme2gZH9FE2dTWU3DATOHjkk3V7PpjPZZAp6N6hK7cztzhiRTflEh27aFDA8bK/file [following]
--2016-10-07 15:35:26--  https://dl.dropboxusercontent.com/content_link/OCqme2gZH9FE2dTWU3DATOHjkk3V7PpjPZZAp6N6hK7cztzhiRTflEh27aFDA8bK/file
Resolving dl.dropboxusercontent.com... 45.58.69.5
Connecting to dl.dropboxusercontent.com|45.58.69.5|:443... connected.
HTTP request sent, awaiting response... 200 OK
Length: 2698 (2.6K) [text/plain]
Saving to: `try.txt'

100%[======================================================================>] 2,698       --.-K/s   in 0s

2016-10-07 15:35:28 (426 MB/s) - `try.txt' saved [2698/2698]

I've followed the advice of dropbox jsonp file and pre-wrapped the json like so but the ajax call never gets to that page.

callback( {"HALLWF1": ["2016/10/07 15:05:00", "Hallett 1 Wind Farm", "SA1", "Wind", "-33.300303", "138.726975", 77.5, 94.5] )

Is there any way to force ajax to follow the dropbox redirect or should I give up and choose another host for the json? Browser is firefox 45.2.0 if that makes a difference.

Also tested in latest chrome, the error there is

Refused to execute script from 'https://www.dropbox.com/s/fzqhnr39fq45ijh/gen_info.json?dl=0&callback=jQuery311040161567467680626_1475817828807&_=1475817828808' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

Answer 1

By default, these www.dropbox.com/s/ links point to an HTML preview page, and not the file content itself.

You can explicitly control this though, using the dl or raw parameters, as documented here:

https://www.dropbox.com/help/201

For example, this slight modification of your code works:

$.ajax({
        url: "https://www.dropbox.com/s/fzqhnr39fq45ijh/gen_info.json?raw=1",
        jsonp: "callback",
        dataType: "jsonp",

        // Work with the response
        success: function( response ) {
            console.log( response ); // server response
        }
    });