非同步 JS 訓練二：第2課 ── 認識 promise chain 鏈接與錯誤處理

認識 promise chain 鏈接與錯誤處理

by hung19091

HTML

<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
尊貴的客戶您好，您上次的消費內容是：<p>
訂單編號：<span id="id"/><p>
訂單內容：<span id="content"/><p>
訂單金額：<span id="amount"/><p>
希望這次也能有機會服務您！<p>

JavaScript

$.get("https://codelove.tw/fake-api/get-current-user-unstable", {}).then((res) => {
  return $.get("https://codelove.tw/fake-api/get-orders-unstable", {
    user_id: res.data.user.id
  });
}).then((res) => {
  return $.get("https://codelove.tw/fake-api/get-order-details-unstable", {
    order_id: res.data.orders.length
  });
}).then((res) => {
  $('#id').text(res.data.order.id);
  $('#content').text(res.data.order.content);
  $('#amount').text(res.data.order.amount);
}).catch((err) => {
  alert('抱歉，系統出了點問題，請稍後再試一次。');
});