将 API KEY 放入 axios答案

【问题标题】：Put API KEY in axios将 API KEY 放入 axios
【发布时间】：2020-03-13 08:52:23
【问题描述】：

我刚开始学习 React，但是当我尝试使用 axios 向 CoinMarketCap API 发出请求并尝试了几种方法来设置我的 API 密钥时遇到了问题。我也尝试过 Postman，但消息显示 API 密钥丢失。

export const apiBaseURL = 'https://pro.coinmarketcap.com';

这样尝试过

dispatch({ type: FETCHING_COIN_DATA })
return axios.get(`${apiBaseURL}/v1/cryptocurrency/map`, 
{ headers = 
{ 'X-CMC_PRO_API_KEY': 'apicode', } 
})

这个

dispatch({ type: FETCHING_COIN_DATA })
let config = { 'X-CMC_PRO_API_KEY': 'apicode' };
return axios.get(`${apiBaseURL}/v1/cryptocurrency/map`, { headers: config })

还有这个

dispatch({ type: FETCHING_COIN_DATA })
return axios.get(`${apiBaseURL}/v1/cryptocurrency/map?X-CMC_PRO_API_KEY=apicode`)

谢谢

【问题讨论】：

标签： react-native axios expo

【解决方案1】：

使用CMC_PRO_API_KEY作为查询参数，而不是X-CMC_PRO_API_KEY：

dispatch({ type: FETCHING_COIN_DATA })
return axios.get(`${apiBaseURL}/v1/cryptocurrency/map?CMC_PRO_API_KEY=apicode`)

【讨论】：

【解决方案2】：

将X-Api-Key 添加到带有axios 的http 请求的简短答案可以总结为以下示例：

        const url =
          "https://someweirdawssubdomain.execute-api.us-east-9.amazonaws.com/prod/custom-endpoint";

        const config = {
          headers: {
            "Content-Type": "application/json",
          },
        };

        // Add Your Key Here!!!
        axios.defaults.headers.common = {
          "X-API-Key": "******this_is_a_secret_api_key**********",
        };

        const smsD = await axios({
          method: "post",
          url: url,
          data: {
            message: "Some message to a lonely_server",
          },
          config,
        });

将密钥添加到默认标题是我可以让它工作的唯一方法。

【讨论】：

对我来说很好的答案和解决方案 - 我使用环境变量而不是秘密 api 密钥通过执行 process.env.APIKEY

【解决方案3】：

我意识到这已经解决了；为了替代方案，我是这样做的。我在/includes/axios创建了一个axios的实例：

import axios from "axios";

const instance = axios.create({
    baseURL: "https://example.com/api",
    headers: {
        "Content-Type": "application/json",
        "x-api-key": "****API_KEY_HERE****",
    },
});

export default instance;

现在 axios 可以通过给定配置导入项目中的任何位置。理想情况下，出于安全原因，您希望将 secret 添加到 ENV 变量中。

【讨论】：