redux-devtools-extension: Getting ERROR: Blocked a frame with origin "http://localhost:3000" from accessing a frame with origin "null".

Getting error: VM1651:1123 Uncaught SecurityError: Blocked a frame with origin "http://localhost:3000" from accessing a frame with origin "null". The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "file". Protocols must match. when opening redux devtools extension.

My configuration:

...
let middleware = applyMiddleware(thunk)
  if (__DEV__) {
    const devTools = window.devToolsExtension ? window.devToolsExtension() : f => f
    middleware = compose(middleware, devTools)
  }

  const store = middleware(createStore)(rootReducer, initialState)
...

We’re using KOA2 node server. Everything works fine, but stops when I’m opening devTools extension.

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 2
Comments: 15 (1 by maintainers)

Most upvoted comments

I did manage to resolve my firebase/Redux DevTools issue.

It turns out I was taking the user object from Firebase’s onAuthStateChanged callback and passing that into my action payload. Kind of like this:

firebase.auth().onAuthStateChanged((user) => {
    if (!user) return; // Logged out
    store.dispatch({
        type: 'UPDATE_USER',
        payload: user,       // << Bad - don't do this
    });
});

The fix was to copy just the data I needed from the user object rather than passing the whole object in.

firebase.auth().onAuthStateChanged((user) => {
    if (!user) return; // Logged out
    store.dispatch({
        type: 'UPDATE_USER',
        payload: {
            uid: user.uid,     // << Just the bits we need
            email: user.email,
            displayName: user.displayName,
        },
    });
});

The difference here, is that in the second version we are passing primitive types (strings) where as in the first version we are passing references. The references point to a scope which Redux DevTools is not allowed to access. Hence the warning.

There are probably other Firebase objects that would cause the same issue. firebase.User comes to mind.

Hope that helps someone.

+18

mikehazell on Jun 7, 2016

@mikehazell Thanks that was my problem.

ghost on Jun 7, 2016