文章主要介紹的是頁面504 Gateway Time-out 的解決思路
一、504 Gateway Time-out 原因？
因為瀏覽器訪問介面請求，默認超時事件是1分鐘，當遇到504介面超時，首先我們要看下 ajax介面請求是否設定了 timeout ，其次看下nginx是否設定了代理超時時間，
二、檢查步驟
1.前端ajax設定
$.ajax({
url: '',//介面地址
type: 'post',//請求方式
data: postData,//請求引數
timeout: 1000*60*10,//設定超時時間為8s
success: function(data){
console.log(data)
},
complete:function(XHR,TextStatus){
if(TextStatus=='timeout'){ //超時執行的程式
console.log("請求超時！");
}
}
})2.nginx代理超時設定
proxy_connect_timeout 600;
proxy_read_timeout 600;
proxy_send_timeout 600;
proxy_buffering off;
proxy_buffer_size 128k;
proxy_buffers 100 128k;三、問題擴展（原生js封裝ajax請求）
因為當時使用jquery的ajax請求，介面統一定義的dataType:json，由于介面回傳的檔案流，導致成功success回呼沒有觸發，又不想修改dataType，因此使用原生js 封裝ajax請求，
getAjax(url,callback){
var timeoutFlag=null;
var xhr=new XMLHttpRequest();
var url=""//請求路徑，get請求可以把引數拼到地址里
xhr.open(type,url,async);//type請求型別 url地址 async是否異步請求
xhr.responseType='blob';//如果回傳資料是檔案流 可以設定為blob型別
xhr.timeout=1000*60*60;//超時時間 此處設定的一小時
xhr.setRequestHeader('token',token);//設定header token
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
window.clearTimeout(timeoutFlag);
if(xhr.status==200 || xhr.status==304){
callback(xhr.response);
}
}
}
xhr.send(data);//如果post請求 引數在此定義傳遞
timeoutFlag=window.setTimeout(function(){//計時器，超時后處理
window.clearTimeout(timeoutFlag);
xhr.abort();
},xhr.timeout);
}
//呼叫ajax
getAjax('URL',function(res){
//邏輯處理
})
感謝您的瀏覽，希望可以幫助到你，后續繼續更新文章（不喜勿噴，哈哈）
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/297544.html
標籤：其他