(Universal React + redux + react-router) How to avoid re-fetching route data on initial browser load?

I am using a static fetchData method on my Route component...

const mapStateToProps = (state) => ({
  posts: state.posts
})

@connect(mapStateToProps)
class Blog extends Component {

  static fetchData (dispatch) {
    return dispatch(fetchPosts())
  }

  render () {
    return (
      <PostsList posts={this.props.posts} />
    )
  }

}

... and collecting all promises before the initial render on the server side...

match({ routes, location }, (error, redirectLocation, renderProps) => {
    const promises = renderProps.components
      .filter((component) => component.fetchData)
      .map((component) => component.fetchData(store.dispatch))

    Promise.all(promises).then(() => {
      res.status(200).send(renderView())
    })
})

It works fine, the server waits until all my promises are resolved before rendering app.

Now, on my client script, I am doing something similar as on the server...

...
function resolveRoute (props) {
  props.components
    .filter((component) => component.fetchData)
    .map((component) => component.fetchData(store.dispatch))

  return <RouterContext {...props} />
}

render((
  <Provider store={store}>
    <Router
      history={browserHistory}
      routes={routes}
      render={resolveRoute} />
  </Provider>
), document.querySelector('#app'))

And it works fine. But, as you may deduct, on the initial page render, the static fetchData is getting called twice (once on the server and once on the client), and I don't want that.

Is there any suggestions on how to solve this? Recommendations?