My addthis toolbox JavaScript widget not present on mobile device

Question

I'm using Ionic v1 and testing in Chrome (ionic serve) and View App (ionic upload).

I included this script in my index.html

<script src="https://s7.addthis.com/js/300/addthis_widget.js#pubid=foo&async=1"></script>

And added the https://github.com/thisissoon/angular-addthis directive.

<sn-addthis-toolbox class="addthis_custom_sharing"
                data-share="{
                    title: thing.title,
                    url: 'https://myurl/' + thing.id,
                    description: 'Check out my thing.'
                }">
  <a href class="addthis_button_email"></a>
  <a href class="addthis_button_facebook"></a>
  <a href class="addthis_button_twitter"></a>
  <a href class="addthis_button_google_plusone_share"></a>
</sn-addthis-toolbox>

When viewing my ionic app in Chrome or firefox everything looks great. When i push to Ionic view my addthis buttons are missing. In Chrome Dev Tools, things look great with any responsive view or device.

Any direction would be helpful here. How would i see error messages in Ionic view?

Why is the addthis.com js widget not working on mobile device?

TIA.

EDIT: I added the https and that got things a step further. (thanks to adamdport)

Now seeing Failed to load file://m.addthisedge.com/live/boost/foo/_ate.track.config_resp resource: NET ERR_FILE_NOT_FOUND

and

Uncaught TypeError: Cannot read property 'split' of null at r (https://s7.addthis.com/js/300/addthis_widget.js:2:44431) at e.exports (https://s7.addthis.com/js/300/addthis_widget.js:2:211271) at https://s7.addthis.com/js/300/addthis_widget.js:2:224158 at https://s7.addthis.com/js/300/addthis_widget.js:2:361724 at o (https://s7.addthis.com/js/300/addthis_widget.js:2:223353) at https://s7.addthis.com/js/300/addthis_widget.js:2:215504 at HTMLDocument.onReady (https://s7.addthis.com/js/300/addthis_widget.js:2:214257)

on addthis_widget.js line 2

FINAL EDIT and solution: The best way i learned to solve this problem was to hook up my Nexus 6p via usb, enable usb debugging, and https://developers.google.com/web/tools/chrome-devtools/remote-debugging/

Ropedancer

Your script doesn't appear to be available over https. If your Ionic URL uses https://, the // in your script src will try to also retrieve your script using https, and it might not load. – Eightieth

file:// will only work on your local file system. It won't work on a server. #12712084 – Eightieth

Answer 1

I resolved your original question regarding why your script wasn't loading: it involved your usage of // and switching between http and https. If your Ionic URL uses https://, the // in your script src will try to also retrieve your script using https, and it might not load.

Since you've edited, I've pointed out that file:// will only work on your local file system. If you try to reference it from a server, it will still try to load resources from the client's machine.

If you need further help, I'd suggest posting another question.

Eightieth

Yes, thanks for that help. Honestly i think, retrospectively, the best answer would be this link. developers.google.com/web/tools/chrome-devtools/… this would have shown the console errors ON my devicde, and lead me to my path of success. Hindsight being 20/20 and all. Thanks for the help. – Ropedancer

Answer 2

First of all as Ionic view does not support all the third party plugin so you have to build it first and test in real device. But I am not sure this will work. Because Add this share on website not app and as you are developing an app so you have to think like an app developer not like web developer. When you share something from website it will post into the social app's website. But when you share something from app it will post into the social app.

So in my suggestion if Add This still work on your real device, though you should not use this because as you are using Ionic so you have to share on app.

Groom