我制作了一個使用 API 的報價生成器網站。當我單擊生成報價時，它只是停留在加載中 我該如何解決？
function randomQuote(){
quoteBtn.classList.add("loading");
quoteBtn.innerText = "Loading Quote...";
fetch("http://api.quotable.io/random").then(response => response.json()).then(result => {
quoteText.innerText = result.content;
authorName.innerText = result.author;
quoteBtn.classList.remove("loading");
quoteBtn.innerText = "New Quote";
quoteBtn.addEventListener("click", randomQuote);
});
}
我也收到這個錯誤，我不知道如何解決
index.js:12 Mixed Content: The page at 'https://mrquoter.netlify.app/' was loaded over HTTPS, but requested an insecure resource 'http://api.quotable.io/random'. This request has been blocked; the content must be served over HTTPS.
此外，當我在本地服務器上運行它時，它運行良好，但我將它托管在 netlify.app 上，它給出了一個錯誤
uj5u.com熱心網友回復：
使用安全端點：
https://api.quotable.io/random也許用于
async/await使您的代碼更易于決議。將按鈕保留在要更新的元素之外。
const button = document.querySelector('button');
const quote = document.querySelector('.quote');
const endpoint = 'https://api.quotable.io/random';
button.addEventListener('click', handleClick, false);
async function handleClick() {
const response = await fetch(endpoint);
const data = await response.json();
quote.textContent = data.content;
}.quote { margin-top: 1em; }<button>New quote</button>
<div class="quote"></div>uj5u.com熱心網友回復：
當您擁有HTTPS網站時，您不能混合從HTTP源加載資源，因為它會改變您的 HTTPS 網站的行為（即安全網站不再安全），這會在您的 HTTPS 網站上打開新的攻擊媒介，如此處所述。
uj5u.com熱心網友回復：
您只需將查詢 URL 更改為“https://api.quotable.io/random”，因為您的網站使用 HTTP，但您使用 HTTP 呼叫 API
HTTPs 是 HTTP 的安全版本
您可以在此處找到有關 HTTP 和 HTTPS 的更多資訊
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/474052.html
標籤：javascript html