Search code examples
javascriptandroidcordovapinterest

Error while Implementing Pinterest using javascript


I am implementing Pinterest in my phonegap android application. Code I am using is as follows:

<html>
<head>
    <title>PINTEREST</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
   <meta name="layout" content="mobile"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
</head>
<body>
<a data-pin-config="above" href="https://pinterest.com/pin/create/button/?url=http%3A%2F%2Fwww.flickr.com%2Fphotos%2Fkentbrew%2F6851755809%2F&media=http%3A%2F%2Ffarm8.staticflickr.com%2F7027%2F6851755809_df5b2051c9_z.jpg&description=Next%20stop%3A%20Pinterest" data-pin-do="buttonPin" ><img src="https://assets.pinterest.com/images/pidgets/pin_it_button.png" /></a>
<script type="text/javascript" src="https://assets.pinterest.com/js/pinit.js"></script>
</body>
</html>

It is working fine in the browser but when I install it on an Android device, I am getting the alert as:

A network error occurred(file://assests.pinterest.com/pidget.html)#via=file%3A%2F%2F%2Fandroid_asset%2Ftest.html&type=pidget)

It's because of

<script type="text/javascript" src="https://assets.pinterest.com/js/pinit.js"></script> 

but I have to use it. Please help me to resolve the problem.


Solution

  • I solved the problem by loading the pinit.js asynchronously. What I used is:

     <script type="text/javascript">
    (function (w, d, load) {
     var script,
     first = d.getElementsByTagName('SCRIPT')[0],  
     n = load.length,
     i = 0,
     go = function () {
       for (i = 0; i < n; i = i + 1) {
         script = d.createElement('SCRIPT');
         script.type = 'text/javascript';
         script.async = true;
         script.src = load[i];
         first.parentNode.insertBefore(script, first);
       }
     }
     if (w.attachEvent) {
       w.attachEvent('onload', go);
     } else {
       w.addEventListener('load', go, false);
     }
    }(window, document,
     ['//assets.pinterest.com/js/pinit.js']
    ));    
    </script>