如何使用 API 令牌從 REST API 獲取數據

Question

我正在嘗試在我的 React 應用程序中使用 Axios 庫為 Z80791B8AE76D9 請求從 Jira Rest API 獲取數據。 為了通過 Jira API 訪問數據，需要 API 令牌。 我在我的 Jira 帳戶設置中生成了一個 API 令牌，但我不知道如何將它包含在我的 http 請求中以獲得訪問權限。

這是 Jira 文檔提供的用於從 Jira 板獲取問題的端點：

curl -u admin:admin http://localhost:8080/jira/rest/api/2/issue/TEST-10 | python -mjson.tool

這是用於將數據設置為獲取的數據的 React state 鈎子：

    const [jiraTicket, setJiraTicket] = useState([]);

這是 API 請求的獲取 function 請求（${} 將填充用戶輸入）：

    function getJiraTicket() {
    axios.get(`${username}:${apiToken}@Content-Type:application/json/https:/${jiraSiteName}.atlassian.net/rest/api/2/issue/${projectKey}-${ticketId}`)
        .then((res) => {
            const data = res.data;
            setJiraTicket(data);
        })
}

react 組件返回中的按鈕應該調用 fetch function：

return(
   <Container>
      <Button onClick{getJiraTicket()}>Fetch Jira Ticket</Button>
   </Container>
);

這是我目前遇到的錯誤，因為授權沒有按照我的方式工作（我替換了提供的用戶名、API 令牌等，用於此示例）：

GET http://localhost:3000/username:apitoken@https:/sitename.atlassian.net/rest/api/2/issue/projectkey-ticketid 404（未找到）

編輯：

我目前的做法：

    function getJiraTicket() {
    axios.get(`${userName}:${apiToken}@https://${siteName}.atlassian.net/rest/api/2/issue/${projectId}-${ticketId}`,{
        auth: {
            username: userName,
            password: apiToken,
        },
        withCredentials: true
    })
        .then((res) => {
            const data = res.data;
            console.log(data);
            setJiraTicket(data);
        })
        .catch(err => {
            // This error means: The request was made and the server responded with a status code
            if(err.res) {
                console.log(err.res.data);
                console.log(err.res.status);
                console.log(err.res.headers);
                console.log("request was made and server responded with status");
            // The request was made but no response was received
            } else if (err.request) {
                console.log(err.request);
                console.log("request was made, but no response was received");
            // Something happened in setting up the request that triggered an error
            } else {
                console.log("Error", err.message);
                console.log("request is note set up correctly");
            }
            console.log(err.config);
        })

當前錯誤，我根據 axios 文檔定義：“請求已發出，但未收到響應”

在 Postman 中運行良好的端點（Postman 中提供了基本身份驗證）： https://sitename.atlassian.net/rest/api/2/issue/projectid-ticketid

Answer 1

Axios 使用標題配置來獲取/發布，因此您不應將它們包含在 URL 中。 以下是您應該如何構造 URL 並應用標頭的一般示例：

let axiosUrl = `${username}:${apiToken}@https://${jiraSiteName}.atlassian.net/rest/api/2/issue/${projectKey}-${ticketId}`
axios({
    baseURL: axiosUrl,
    method: 'get',
    headers: {
        "Content-Type": "application/json"
    },
    //timeout: 2000,
})
    .then((res) => {
        setJiraTicket(res.data);
    })
     .catch(function (error) {
         console.log(error);
     });

Answer 2

更新：當應用程序嘗試直接訪問 Jira API 端點時，不允許 CORS 訪問。 進行此限制是為了防止對特定 Jira 站點的隨機身份驗證請求，因為訪問是基於 session 的身份驗證。 但是，如果使用 OAuth 2.0 而不是基本身份驗證，則可以訪問 API 端點，因為應用程序將通過此鏈接將用戶重定向到 Jira 身份驗證本身：

https://auth.atlassian.com/authorize ? 觀眾=api.atlassian.com&
client_id=YOUR_CLIENT_ID&
范圍=REQUESTED_SCOPE_ONE%20REQUESTED_SCOPE_TWO&
redirect_uri=https://YOUR_APP_CALLBACK_URL&
state=YOUR_USER_BOUND_VALUE& response_type=code& prompt=consent

來源： https://developer.atlassian.com/cloud/jira/platform/oauth-2-3lo-apps/#known-issues