javascript - How to send clientIP in request headers using axios - Stack Overflow

admin管理员组

文章数量:1388527

My current Project structure is like this

- MyApp
  - client
  - config
  - server
  - shared
    - src
        myReactApp.jsx
    - services
        api.js
        userService.js

I want to send the client's IP address to the API server in all requests as a header I am using Axios to make requests to the server my api.js file has this

import axios from 'axios';

export default () =>
  axios.create({
    baseURL: config('apiUrl')
  });

and in my user service I call api.js like this

import api from './api'
export default {
  fetchUserProfileDetails() {
    return api().get('/user/profile')
  }
}

which I then use in my ponents as

import UserService from '../userService'

...

ponentDidMount () {
  UserService.fetchUserProfileDetails()
  .then(results => {
    // do stuff with the results
  })
}

what I want to know is how to send in the client's IP address in every request when I have this kind of setup The application is react based and is also Server-Side Rendered using express as the server I am able to get the Client's IP using req.connection.socket.remoteAddress.split(",")[0] and am also able to send that into the react application.

How to actually use that in axios?

I am using react's context API to send the IP inside the react application, is that a proper way to send information from the server to the react application?

My current Project structure is like this

- MyApp
  - client
  - config
  - server
  - shared
    - src
        myReactApp.jsx
    - services
        api.js
        userService.js

I want to send the client's IP address to the API server in all requests as a header I am using Axios to make requests to the server my api.js file has this

import axios from 'axios';

export default () =>
  axios.create({
    baseURL: config('apiUrl')
  });

and in my user service I call api.js like this

import api from './api'
export default {
  fetchUserProfileDetails() {
    return api().get('/user/profile')
  }
}

which I then use in my ponents as

import UserService from '../userService'

...

ponentDidMount () {
  UserService.fetchUserProfileDetails()
  .then(results => {
    // do stuff with the results
  })
}

what I want to know is how to send in the client's IP address in every request when I have this kind of setup The application is react based and is also Server-Side Rendered using express as the server I am able to get the Client's IP using req.connection.socket.remoteAddress.split(",")[0] and am also able to send that into the react application.

How to actually use that in axios?

I am using react's context API to send the IP inside the react application, is that a proper way to send information from the server to the react application?

• javascript
• reactjs
• express
• axios
• server-side-rendering

Share Improve this question Follow edited Oct 2, 2018 at 17:46 Syed Shamikh Shabbir asked Oct 2, 2018 at 17:34 Syed Shamikh ShabbirSyed Shamikh Shabbir 1,33211 gold badge1414 silver badges1818 bronze badges 1

• Send an XFF header developer.mozilla/en-US/docs/Web/HTTP/Headers/… – ness-EE Commented Jun 22, 2023 at 15:55

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 2

If you can already get the client's IP on your code you can set the default header of Axios just like axios.defaults.headers.mon['CLIENT_IP'] = clientIP.

If you don't have the client IP you can get that with third party app other with some code. Just take a look on this article https://ourcodeworld./articles/read/257/how-to-get-the-client-ip-address-with-javascript-only

But to get it it's better to use your server. In Express it's just req.ip.

本文标签： javascriptHow to send clientIP in request headers using axiosStack Overflow