title: How can I use the Google API in a chrome extension?
body: <p>I'm now searching for hours how I can use the Google API in a chrome extension. All I want to do is to parse the contents of a website and insert it as a new event to Google Calender. I got the parsing and everything, but it seems to be impossible to use the Google API inside a Chrome extension. I'm just trying to write an example event when clicking the button in my chrome extension, but it keeps refusing to load the Google API with this error:</p>
  
  <pre><code>Refused to load the script 'https://apis.google.com/js/platform.js' because it violates the following Content Security Policy directive: "script-src 'self' blob: filesystem: chrome-extension-resource:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
  </code></pre>
  
  <p>My manifest.json:</p>
  
  <pre><code>{
      "manifest_version": 2,
  
      "name": "DVB2Calender",
      "description": "This extension will export the current viewed schedule to your Google Calender.",
      "version": "1.0",
  
      "content_security_policy": "script-src 'self' https://apis.google.com/; object-src 'self'",
  
      "browser_action": {
       "default_icon": "icon.png",
       "default_popup": "popup.html"
      },
      "permissions": [
       "activeTab"
       ]
  }
  </code></pre>
  
  <p>My popup.html</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;!doctype html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;DVB2Calender&lt;/title&gt;
      &lt;meta http-equiv="Content-Security-Policy" content="default-src *;"&gt;
      &lt;script src="popup.js"&gt;&lt;/script&gt;
      &lt;script src="https://apis.google.com/js/platform.js" async defer&gt;
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
  
      &lt;h1&gt;DVB to Calender&lt;/h1&gt;
      &lt;button id="exportToCalender"&gt;Export this calender to Google Calender!&lt;/button&gt;
  
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My popup.js:</p>
  
  <pre><code>document.addEventListener('DOMContentLoaded', function() {
      var checkPageButton = document.getElementById('exportToCalender');
      checkPageButton.addEventListener('click', function() {
  
          chrome.tabs.getSelected(null, function(tab) {
              var head = document.getElementsByTagName('head')[0];
              var script = document.createElement('script');
              script.type = 'text/javascript';
              script.src = "https://apis.google.com/js/client.js?onload=callbackFunction";
              head.appendChild(script);
  
              d = document;
              var download = d.getElementsByClassName('icon-link ico-calender')[6];
              var request = makeHttpObject();
              request.open("GET", download, true);
              request.send(null);
              request.onreadystatechange = function() {
                  if (request.readyState === 4) {
                      var resultText = request.responseText;
                      array = CSVToArray(resultText, ":");
                      alert(resultText);
  
                      var resource = {
                          "summary": "Appointment",
                          "location": "Somewhere",
                          "start": {
                          "dateTime": "2011-12-16T10:00:00.000-07:00"
                          },
                          "end": {
                          "dateTime": "2011-12-16T10:25:00.000-07:00"
                          }
                      };
                      var request = gapi.client.calendar.events.insert({
                      'calendarId': 'primary',
                      'resource': resource
                      });
                      request.execute(function(resp) {
                      console.log(resp);
                      });
                  }
              };
          }
      }
  }
  </code></pre>