## 1 简介 参考文件:https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch ## 2 使用 ### 基本用法 ```js // Example POST method implementation: async function postData(url = "", data = {}) { // Default options are marked with * const response = await fetch(url, { method: "POST", // *GET, POST, PUT, DELETE, etc. mode: "cors", // no-cors, *cors, same-origin cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached credentials: "same-origin", // include, *same-origin, omit headers: { "Content-Type": "application/json", // 'Content-Type': 'application/x-www-form-urlencoded', }, redirect: "follow", // manual, *follow, error referrerPolicy: "no-referrer", // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url body: JSON.stringify(data), // body data type must match "Content-Type" header }); return response.json(); // parses JSON response into native JavaScript objects } postData("https://example.com/answer", { answer: 42 }).then((data) => { console.log(data); // JSON data parsed by `data.json()` call }); ``` ### 上传文件 ```js const formData = new FormData(); const fileField = document.querySelector('input[type="file"]'); formData.append("username", "abc123"); formData.append("avatar", fileField.files[0]); fetch("https://example.com/profile/avatar", { method: "PUT", body: formData, }) .then((response) => response.json()) .then((result) => { console.log("Success:", result); }) .catch((error) => { console.error("Error:", error); }); ```