title: How do I load external scripts into my Chrome extension?
body: <p>I'm trying to pop open a tab with the Facebook login sample code, from within my Chrome extension. I'm using straight up tutorial code in this example so far.</p>
  
  <p>The tab opens up properly, however, facebook's javascript fails to load due to a cross site security policy issue, and I'm getting an inline script error, too - which seems odd (unless maybe dynamically added elements have inline script which triggers the error message?)</p>
  
  <p>Where can I learn how to properly do this kind of thing?</p>
  
  <p>Errors:</p>
  
  <pre><code>Refused to load script from 'https://connect.facebook.net/en_US/all.js' because of Content-Security-Policy.
  Refused to execute inline script because of Content-Security-Policy.
  </code></pre>
  
  <p>background.js:</p>
  
  <pre><code>chrome.tabs.create({url: 'popup.html'}) 
  </code></pre>
  
  <p>popup.html: //sample login code from facebook api documentation</p>
  
  <pre><code>  &lt;head&gt;
      &lt;title&gt;Facebook Client-side Authentication Example&lt;/title&gt;
      &lt;script type="text/javascript" src="popup.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="fb-root"&gt;&lt;/div&gt;
      &lt;script&gt;
  
      &lt;/script&gt;
  
      &lt;h1&gt;Facebook Client-side Authentication Example&lt;/h1&gt;
        &lt;div id="auth-status"&gt;
          &lt;div id="auth-loggedout"&gt;
            &lt;a href="#" id="auth-loginlink"&gt;Login&lt;/a&gt;
          &lt;/div&gt;
          &lt;div id="auth-loggedin" style="display:none"&gt;
            Hi, &lt;span id="auth-displayname"&gt;&lt;/span&gt;  
          (&lt;a href="#" id="auth-logoutlink"&gt;logout&lt;/a&gt;)
        &lt;/div&gt;
      &lt;/div&gt;
  
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>popup.js://sample code from facebook dev</p>
  
  <pre><code>// Load the SDK Asynchronously
  (function (d) {
      var js, id = 'facebook-jssdk',
          ref = d.getElementsByTagName('script')[0];
      if (d.getElementById(id)) {
          return;
      }
      js = d.createElement('script');
      js.id = id;
      js.async = true;
      js.src = "https://connect.facebook.net/en_US/all.js";
      ref.parentNode.insertBefore(js, ref);
  }(document));
  
  // Init the SDK upon load
  window.fbAsyncInit = function () {
      FB.init({
          appId: '', // App ID
          channelUrl: '//' + window.location.hostname + '/channel', // Path to your Channel File
          status: true, // check login status
          cookie: true, // enable cookies to allow the server to access the session
          xfbml: true // parse XFBML
      });
  
      // listen for and handle auth.statusChange events
      FB.Event.subscribe('auth.statusChange', function (response) {
          if (response.authResponse) {
              // user has auth'd your app and is logged into Facebook
              FB.api('/me', function (me) {
                  if (me.name) {
                      document.getElementById('auth-displayname').innerHTML = me.name;
                  }
              })
              document.getElementById('auth-loggedout').style.display = 'none';
              document.getElementById('auth-loggedin').style.display = 'block';
          } else {
              // user has not auth'd your app, or is not logged into Facebook
              document.getElementById('auth-loggedout').style.display = 'block';
              document.getElementById('auth-loggedin').style.display = 'none';
          }
      });
  
      // respond to clicks on the login and logout links
      document.getElementById('auth-loginlink').addEventListener('click', function () {
          FB.login();
      });
      document.getElementById('auth-logoutlink').addEventListener('click', function () {
          FB.logout();
      });
  }
  </code></pre>