使用 axios 在 react-native 中使用 POST 方法获取 API 数据

Posted 2023-03-28

【中文标题】使用 axios 在 react-native 中使用 POST 方法获取 API 数据

【英文标题】：Get API data with POST method in react-native with axios

【发布时间】：2018-06-21 18:38:48

【问题描述】：

我需要使用 axios 在 react-native 应用程序中获取数据。我可以使用如下简单的 GET 方法获取数据：

class AlbumList extends Component 

  state =  albums: [] ;

componentWillMount() 
  //axios.get('https://rallycoding.herokuapp.com/api/music_albums') .then(response => console.log(response));
  axios.get('http://rallycoding.herokuapp.com/api/music_albums')

  .then(response => this.setState( albums: response.data ));
        
        renderAlbums() 
          return this.state.albums.map(album =>
          <AlbumDetail key=album.title album=album />);
         // return this.state.albums.map(album => <Text>album.title</Text>);
        

render() 
    console.log(this.state);

return (
   <View>
        this.renderAlbums()
    </View>    
);

如何使用POST 方法从 API 获取数据，并且还需要传递标头和 api-username、api-password、apitoken？

我需要像 https://***.com/a/41358543/949003 这样的东西，但要使用 AXIOS。

编辑：

我需要从LINNWORK API 获取数据。如果有人这样做，请指导。他们首先需要authorize，然后我可以从那里获取数据。所以授权，然后下一步。

【参考方案1】：

axios post 方法采用 3 个参数，即 url、data 和 config。

您可以按如下方式构造 axios 发布请求：

axios.post(
    'http://rallycoding.herokuapp.com/api/music_albums', 
    
       'param1': 'value1',
       'param2': 'value2',
       //other data key value pairs
    ,
    
       headers: 
           'api-token': 'xyz',
            //other header fields
       
    
);

在您的情况下，您需要访问https://api.linnworks.net/api/Inventory/GetCategories，根据docs，这需要Authorization 标头中来自auth api 的token。所以你通过 axios 的 GET 请求将是：

axios.get("https://api.linnworks.net/api/Inventory/GetCategories",  
    headers: 
      'Authorization': 'token-from-auth-api'
    
).then((response) => 
    console.log(response.data);
)

【讨论】：

您的输出非常有价值，请检查编辑，以便我解决问题。非常感谢

@Jai 你能从 auth api 生成访问令牌吗？

我有用于 Cakephp 项目的访问令牌和用户名密码。我将在 react native 应用程序中使用相同的内容。

@Jai 你能通过私人谈话分享细节吗？到时候帮到你会更容易

好的。请告诉我如何进行私人对话？