与 Axios 的 API 集成 - 显示用户名和密码弹出窗口答案

【问题标题】：API Integration with Axios - Username and Password PopUp Showing Up与 Axios 的 API 集成 - 显示用户名和密码弹出窗口
【发布时间】：2021-09-28 23:53:50
【问题描述】：

我被分配了一项与集成 API 相关的任务。我已经能够从 API 获取信息，但是出现了一个弹出窗口，要求我提交用户名和密码。我有用户名和密码，但我的想法是无需弹出该弹出窗口即可登录。

代码如下：

const getPlate = () => {
        let licensePlate = document.getElementById('licensePlate');
        let licensePlateNumber = licensePlate.value;
        if (licensePlate.value === "") {
            alert('¡Debe introducir el número de matrícula para poder avanzar!');
        } else {
            Axios.get( * URL GOES HERE * ).then((response) => {
                let plate = response;
                console.log(plate.data[i].make);
                });
            }
    }

<div id="carDataContainer">
     <div id="licensePlateContainer">
          <input type="text" name="licensePlate" id="licensePlate" placeholder="Matrícula - ej. 001 BNDO"></input>
          <button type="button" id="plateBtn" onClick={ getPlate }>Search</button>
     </div>
</div>

【问题讨论】：

看起来资源需要一个基本授权标头。
警报被显示是因为if 也被满足Axios 应该axios.get;你能解释一下I have the username and password 部分吗？
当然。我有访问 API 的凭据并在弹出窗口中提交它工作正常。这个想法是让那个弹出窗口不出现。这是一个付费 API，我的公司要求我将其集成到应用程序中。

标签： javascript node.js reactjs api

【解决方案1】：

您应该向 axios 提供用户/密码（看起来需要基本身份验证）。尝试将该信息添加到您的请求中：

Axios.get( * URL GOES HERE *, {
                  auth: {
                       username: "your-username",
                       password: "your-pass",
                  }
            } ).then((response) => {
                let plate = response;
                console.log(plate.data[i].make);
                });
            }

【讨论】：

【解决方案2】：

您需要基本身份验证

见：https://stackoverflow.com/a/44239543/7662325

如果这不起作用，你可以使用这个：https://stackoverflow.com/a/53939140/7662325

【讨论】：

感谢您的帮助，Muhammed，已经在 Ariel 的帮助下解决了这个问题。无论如何，我检查了它以进一步了解。