CODEWITHSUNDEEP
javascriptrequirejs
Sydney
Sydney

Reputation: 12212

Load async resource with requirejs timeout

I tried to load the Google APIs Client Library for JavaScript with requirejs and the async plugin:

require.config({
    paths : {
        async : '../lib/requirejs/async'
    },
    waitSeconds: 60
});

define('gapi', ['async!https://apis.google.com/js/client.js!callback'],
    function(){
        console.log('gapi loaded');
        return gapi.client;
    }
);

require(['gapi'], function(){
    console.log("Callback");
    console.log(gapi);
});

The usual way to load this library is

<script src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script>

Everything is loaded in less than 2s but I always get this error:

Uncaught Error: Load timeout for modules: async!https://apis.google.com/js/client.js!callback_unnormalized2,async!https://apis.google.com/js/client.js!callback
http://requirejs.org/docs/errors.html#timeout

Upvotes: 4

Views: 6266

Answers (1)

Miller Medeiros
Miller Medeiros

Reputation: 1256

TL;DR; change the !callback to !onload that should fix the timeout.

define('gapi', ['async!https://apis.google.com/js/client.js!onload'],
    function(){
        console.log('gapi loaded');
        return gapi.client;
    }
);

The value after the ! is used as the argument name for the async callback, in this case the URI loaded will be something like https://apis.google.com/js/client.js?onload=__async_req_3__ where __async_req_3__ is a global variable (callback function) triggered as soon as the Google API is loaded (notifies the plugin that all dependencies are met).

Upvotes: 9

Related Questions