Embedding Tweet on Lightning Component

Question

I am trying to embed a single tweet into a lightning component. I have a static resource to load the widget.js file of twitter. On my cmp file,

Please see sample code below:

//cmp file the script is a widget.js off of https://platform.twitter.com/widgets.js
<ltng:require scripts="/resource/widget" afterScriptsLoaded="{!c.twitterLoaded}"/>

<div class="container">
  <aura:unescapedHtml value="{!c.embedTweet}" />
</div>

//controller
({
   twitterLoaded : function() {
      //assume that I have set the embedTweet attribute

      if(window.twttr) {
        window.twttr.load(
           document.querySelector('.container');
        )
      }
   }
)}

This throws an error because twitter is trying to append a script onto the page. I was wondering if anyone knows of a workaround in embedding single tweets?

A sample of the error here

widget:1 Refused to load the script 'https://platform.twitter.com/js/tweet.ec328711a3507dfee1de85f104e9a308.js' because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension: 'unsafe-inline' 'unsafe-eval' https://ssl.gstatic.com/accessibility/"

More info on what I'm trying to here:

Embedding Single Tweets

Initializing after widget script has loaded

Answer 1

There are many ways to get this done.

There is a sample Twitter feed that I have used in a class:

https://github.com/jfparadis/mastering-lightning-code-samples/tree/master/metadata/aura/basics401

We get the data via apex. I am sure that you can adapt that sample to your needs.