ReactJS，試圖從JIRA的REST API獲取訪問JSON數據，但無法這樣做。

Question

我被困了幾個小時，試圖弄清楚為什么我無法使用REST API從JIRA中的JSON數據訪問和傳輸數組中的數據。 簡而言之，通過JIRA REST API文檔提供的基本身份驗證位於： https : //developer.atlassian.com/server/jira/platform/basic-authentication/ ，我正在嘗試在JIRA網站內獲取JSON數據通過URL。 在我的本地主機頁面的控制台日志中，我似乎收到以下錯誤消息： 跨域讀取阻止（CORB）阻止了跨域響應 。 不太確定如何解決此問題，我的數組中的數據為空（試圖獲取此數組中的所有JSON數據，但是不起作用）。 我不確定是否可以根據我在componentDidMount（）方法中通過Internet查找的格式完全正確地提取數據。

任何幫助表示贊賞。

const base64 = require('base-64');

constructor(props)
{
   super(props);
   isLoaded: false,
   jiraData: []
}

componentDidMount()
{
   let headers = new Headers();
   headers.append("Content-Type", "application/json");
   headers.append("Accept", "application/json");
   headers.append('Authorization', 'Basic ' + 
   base64.encode('hiddenusername:hiddenpassword'));

   fetch('http://ksr-ca-qmaltjira.ca.kronos.com:8061/rest/api/2/search?jql=project=SUP&maxResults=2', {method:'GET', headers: headers})
   .then(res => res.json())
   .then(res => {
      this.setState(
      {
        isLoaded: true,
        tableHeight: height + "px",
        jiraData: res
      });

    });

}


render()
{
  var { isLoaded, jiraData } = this.state;
  //Checking whether there is data in my array 
  const emptyOrNot = !!jiraData.length && !!jiraData.length ? <p>not empty</p> : <p>empty</p>
}

return(
 <div className="App">
 {emptyOrNot}
 </div>
)

Answer 1

請在其他答案中閱讀有關CORS的解釋。 基本上，除非已將其配置為允許跨域請求，否則您無法從網頁向其他來源的服務器發出請求。 而且由於您無法控制Jira，因此無法執行此操作。

此外，即使您可以這樣做，我還是強烈建議您不要這樣做，因為您會將用戶名和密碼暴露給訪問您網頁的任何人。

構建它的正確方法是創建自己的API，該API可以與Jira對話而無需處理CORS問題（CORS僅適用於來自瀏覽器的請求）。 然后，您可以從此處為您的React應用程序提供服務，或者啟用CORS並從任何地方提供服務。 這也可以保護您的Jira憑據，因為它們不會在客戶端應用程序中公開。