为什么我发送post请求给后端:8080/#/home/cardlist:1 Access to XMLHttpRequest at 'http://127.0.0.1:8888/api/add' from origin 'http://localhost:8080' has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

这是因为浏览器的同源策略限制了跨域请求（即协议、域名、端口号任一不相同的请求）。服务器在收到请求时，会检查请求头中的 content-type 是否被允许，如果不被允许，则会返回 preflight response，告诉浏览器请求被拒绝。解决方法可以在服务器端设置 Access-Control-Allow-Headers 来允许请求头中的 content-type。

相关问题

fetchCardData(){ let _this=this; this.$axios.get("http://localhost:8080/softwork_war/Servletfindallbook").then(function(response){ _this.cardList = response.data; _this.card.id = response.data.id; _this.card.imageUrl = response.data.img; _this.card.title = response.data.bookname; }).catch(function(err){ console.log(err); }); },

这段代码是使用 axios 库向本地服务器发送 GET 请求，获取名为 "http://localhost:8080/softwork_war/Servletfindallbook" 的 API 接口返回的数据，并将数据赋值给卡片列表 this.cardList 中。同时也将卡片的 id、图片地址和标题从返回的数据中分别取出，并赋值给 this.card 对象的相应属性。在请求过程中，如果发生错误，则通过 catch 语句捕获并输出错误信息到控制台。

// 获取就诊卡信息 queryCardInfo() { this.$api.outpatient.queryCardInfo({ data: {patId: ''}, reqLoading: false, resToastClear: false, }).then((response) => { if (response.data.Code == 0) { let data = response.data.Data; this.cardList = data; } }); },

这段代码是一个 Vue.js 组件中的方法，用于获取就诊卡信息。具体实现是调用了一个名为 `$api.outpatient.queryCardInfo` 的 API 接口，并传入一个参数对象 `{data: {patId: ''}, reqLoading: false, resToastClear: false}`。其中 `data` 属性表示传入接口的参数，`reqLoading` 属性表示请求时是否显示加载动画，`resToastClear` 属性表示请求成功后是否清空之前的提示信息。最后通过 Promise 的方式，根据接口返回的数据来更新组件中的 `cardList` 数据。