title: Meteor Single Signon oAuth Popup is Blank! (cross-origin frame error)
body: <p>I have no idea why this is happening.  We finally launched our app, everything works on the staging server, and then I deploy to an identical setup - and now this is happening - and I can't figure out why.</p>
  
  <p>You can see it happening for yourself: go to <a href="http://www.crunchyserial.com/" rel="nofollow noreferrer">http://www.crunchyserial.com/</a>
  <a href="https://i.stack.imgur.com/aHT0I.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/aHT0I.png" alt="enter image description here"></a></p>
  
  <p>Here is the error in the console:</p>
  
  <pre><code>Uncaught DOMException: Blocked a frame with origin "http://www.crunchyserial.com" from accessing a cross-origin frame.
      at http://www.crunchyserial.com/packages/oauth/end_of_popup_response.js:18:39
      at http://www.crunchyserial.com/packages/oauth/end_of_popup_response.js:37:3
  </code></pre>
  
  <p>If you refresh the blank oauth window, it closes and then you get this error:<a href="https://i.stack.imgur.com/vUXXE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vUXXE.png" alt="enter image description here"></a></p>
  
  <p>and on the server log you get this:</p>
  
  <pre><code>[00.00.00.00]{"line":"431","file":"oauth.js","message":"Error in OAuth Server: Failed to complete OAuth handshake with Google. failed [400] {   \"error\" : \"invalid_grant\",   \"error_description\" : \"Code was already redeemed.\" }","time":{"$date":1497382695634},"level":"warn"}
  [00.00.00.00]Exception while invoking method 'login' Error: Failed to complete OAuth handshake with Google. failed [400] {   "error" : "invalid_grant",   "error_description" : "Code was already redeemed." }
  [00.00.00.00]    at getTokens (packages/google-oauth/google_server.js:107:7)
      at Object.getServiceData [as handleOauthRequest] (packages/google-oauth/google_server.js:81:35)
      at OAuth._requestHandlers.(anonymous function) (packages/oauth2.js:27:31)
      at middleware (packages/oauth.js:203:5)
      at packages/oauth.js:176:5
  {"line":"431","file":"oauth.js","message":"Error in OAuth Server: Failed to complete OAuth handshake with Google. failed [400] {   \"error\" : \"invalid_grant\",   \"error_description\" : \"Code was already redeemed.\" }","time":{"$date":1497382701056},"level":"warn"}
  Exception while invoking method 'login' Error: Failed to complete OAuth handshake with Google. failed [400] {   "error" : "invalid_grant",   "error_description" : "Code was already redeemed." }
      at getTokens (packages/google-oauth/google_server.js:107:7)
      at Object.getServiceData [as handleOauthRequest] (packages/google-oauth/google_server.js:81:35)
      at OAuth._requestHandlers.(anonymous function) (packages/oauth2.js:27:31)
      at middleware (packages/oauth.js:203:5)
  [00.00.00.00]    at packages/oauth.js:176:5
  </code></pre>
  
  <p>Here is the <code>settings.json</code> I use in my <code>./deploy</code> directory for the production server:</p>
  
  <pre><code>{
    "public": {
      "analyticsSettings": {
        "Google Analytics" : {"trackingId": "//redacted//"}
      }
    },
    "private": {
      "oAuth": {
        "google": {
          "clientId": "//redacted//",
          "secret": "//redacted//",
          "loginStyle": "popup"
        },
        "facebook": {
          "appId": "//redacted//",
          "secret": "//redacted//",
          "loginStyle": "popup"
        },
        "twitter": {
          "consumerKey": "//redacted//",
          "secret": "//redacted//"
          "loginStyle": "popup"
        }
      }
    }
  }
  </code></pre>
  
  <p>Oddly enough, there is no difference between "redirect" and "popup" loginStyles... I don't notice ANY behavior difference in the app.</p>
  
  <p>This is my <code>mup.js</code>:</p>
  
  <pre><code>module.exports = {
    servers: {
      one: {
        host: '//redacted//',
        username: 'ubuntu',
        pem: "//redacted//"
        // password:
        // or leave blank for authenticate from ssh-agent
      }
    },
  
    meteor: {
      name: 'CrunchySerial',
      path: '../../CrunchySerial',
      servers: {
        one: {}
      },
      buildOptions: {
        serverOnly: true,
      },
      env: {
        ROOT_URL: 'http://www.crunchyserial.com',
        MONGO_URL: 'mongodb://localhost/meteor'
      },
  
      dockerImage: 'abernix/meteord:base',
      deployCheckWaitTime: 400
    },
  
    mongo: {
      oplog: true,
      port: //redacted//,
      servers: {
        one: {},
      },
    },
  };
  </code></pre>
  
  <p>I've tried the ROOT_URL with and without a <code>/</code> I've updated to all the latest versions...  And I still have no idea why this is happening.</p>