How to include a external javascript library through url in JavaScript Component?

lugreen · June 29, 2019, 5:15am

Hi,

I need to include a javascript library through url, for example from a CDN.

<jsComponent id="baiduMap"
                 initFunctionName="web_dashboard_widgets_project_ProjectCoord"
                 height="100%"
                 width="100%">
        <dependencies>
            <dependency path="vaadin://baidumap.js"/>
            <dependency path="http://code.jquery.com/jquery-3.4.1.min.js"/>
        </dependencies>
    </jsComponent>

There external url can’t be loaded.

Did i do some thing wrong?

Thanks

gorelov · July 1, 2019, 10:38am

Hi,

In fact, the JavaScriptComponent supports external URLs.

Could you please describe in more details what problem do you face?

Regards,
Gleb

lugreen · July 3, 2019, 9:49am

Hi Gleb,

Sorry for long silence.

In a project, need include a external JS library，that is “Baidu Map”, i included the JS library like screenshot showing:

There using a url that starts with http://,
In this form, the browser can’t load the JS library ,can’t saw any request to the library from Network panel in dev tool,but can saw the js included trhough “VAADIN:” form:

gorelov · July 3, 2019, 2:32pm

As your link has no extension, JavaScriptComponent can’t infer its type. Simply define the type property explicitly:

<dependency path="http://api.map.baidu.com/getscript?v=2.0&amp;ak=5962748821c8b0a35d5a4ea3a7f69007"
            type="JAVASCRIPT"/>

lugreen · July 4, 2019, 12:44am

Hi Gleb,

Thanks a lot.