Error while Implementing Pinterest using javascript

Question

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.

score 0 · Answer 1 · answered Mar 14 '13 at 13:33

0

You can download the assets to local. Otherwise it won't display anything on a phone without network connection. Using resources from another website is probably also a bad idea, see "Inline Linking (Hot Links)".

answered Mar 14 '13 at 13:33

Erica Xu

545
1
4
13

Yes actually I have downloaded and kept in local but still it's not working, now for reference I have written like this. – user Mar 14 '13 at 13:39
After you downloaded it, did you change the links from Pinterest to your local machine? – Erica Xu Mar 14 '13 at 13:44
They should point to `file:///android_asset/`. [See also this answer.](http://stackoverflow.com/a/9432330/154306) – Paul Lammertsma Mar 14 '13 at 13:50

score 0 · Answer 2 · answered Mar 14 '13 at 13:37

0

You application might not have the INTERNET permission. Check that it is included in the AndroidManifest.xml.

answered Mar 14 '13 at 13:37

Paul Lammertsma

37,593
16
136
187

Yes in my AndroidManifest.xml, I have included – user Mar 14 '13 at 13:43

score 0 · Accepted Answer · answered Apr 02 '13 at 10:57

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>

score 0 · Answer 4 · answered Jan 02 '14 at 20:08

0

You could use the SocialSharing phonegap plugin to Pin something on Android. Just add this plugin and add a button:

< button onclick="window.plugins.socialsharing.shareVia('pinterest', 'Wow!')">Pin it!< /button>

Couldn't be easier :)

answered Jan 02 '14 at 20:08

Eddy Verbruggen

3,550
1
15
27

Error while Implementing Pinterest using javascript

4 Answers4