Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I get http headers in React.js

I've made a request to a React page, and I need to get the headers from the request.

I call the page via the URL:

http://localhost/dashboard

and I set headers, for example authcode=1234.

I then load the page with this route:

<Route path="dashboard" name="dashboard" component={Dashboard} onEnter={requireAuth}></Route>

is there something like this.props.header, I can call in the page constructor?

like image 475
Wayneio Avatar asked Jun 04 '17 13:06

Wayneio


2 Answers

You cant get current page headers without sending a http request via javascript. See this answer for more info.

Add a dummy api url on your server and hit it after your page loadn then you can get the headers.

class App extends React.Component{
    //some code
    componentDidMount(){
       fetch(Some_API).then(response=>{
           console.log(response.headers)
       })
    }
    //some code
}
like image 70
Anurag Awasthi Avatar answered Oct 31 '22 11:10

Anurag Awasthi


It's not possible to access page headers via client JavaScript. You can get these request headers on your server side and then pass them into index.html of your React app. For example:

//in index.html
<head>
...
  <script>
    window.__INITIAL_HEADERS__ = {/* page headers */};
  </script>
</head>
<body>
...
</body>

Then in your app you can access the headers via window.__INITIAL_HEADERS__ variable.

like image 32
GProst Avatar answered Oct 31 '22 10:10

GProst