問題概述：在基于 springboot 和 vue（element-UI） 的專案中，在一個可以正常請求的介面中加入一個陣列引數時會報跨源請求錯誤。
注：只要不帶陣列作為引數時可以正常請求，后端設定 @CrossOrigin 無效
部分代碼如下：
從上到下依次為：
樹形選擇（引數獲取）
請求引數結構
及賦值方法
<el-tree
:data="https://bbs.csdn.net/topics/treeData"
:props="defaultProps"
node-key="id"
ref="tree"
show-checkbox
:node-click="treeClick"></el-tree>
</el-card>
dataForm: {
id: '',
categoryList1: []
},
getCategory () {
this.dataForm.categoryList1 = this.$refs.tree.getCheckedNodes() // 引數賦值
console.log(this.dataForm)
this.getDataList() // 發送請求
},
其中樹形引數按 nodes 和 keys 都試過，還是不行
錯誤資訊：
已攔截跨源請求：同源策略禁止讀取位于 http://localhost:8080/sxbscm-admin/pfm/platformmaterialcateg…ry/page?order=&orderField=&page=1&limit=10&id=&categoryList1[]=1&categoryList1[]=2&categoryList1[]=3&_t=1572006822480 的遠程資源。（原因：CORS 頭缺少 'Access-Control-Allow-Origin'）。
已攔截跨源請求：同源策略禁止讀取位于 http://localhost:8080/sxbscm-admin/pfm/platformmaterialcateg…ry/page?order=&orderField=&page=1&limit=10&id=&categoryList1[]=1&categoryList1[]=2&categoryList1[]=3&_t=1572006822480 的遠程資源。（原因：CORS 請求未能成功）。
Error: "Network Error"
createError createError.js:16
handleError xhr.js:81
請求頭：
Host: localhost:8080
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:69.0) Gecko/20100101 Firefox/69.0
Accept: */*
Accept-Language: zh-CN,zh;q=0.8,zh-TW;q=0.7,zh-HK;q=0.5,en-US;q=0.3,en;q=0.2
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: GET
Access-Control-Request-Headers: tenant_code,token
Referer: http://localhost:8001/
Origin: http://localhost:8001
Connection: keep-alive
引數：
查詢字串
order
orderField
page 1
limit 10
id
categoryList1[] […]
0 1
1 2
2 3
_t 1572006822480
后端介面：
@CrossOrigin
@GetMapping("page")
@ApiOperation("分頁")
@ApiImplicitParams({
@ApiImplicitParam(name = Constant.PAGE, value = "當前頁碼，從1開始", paramType = "query", required = true, dataType="int") ,
@ApiImplicitParam(name = Constant.LIMIT, value = "每頁顯示記錄數", paramType = "query",required = true, dataType="int") ,
@ApiImplicitParam(name = Constant.ORDER_FIELD, value = "排序欄位", paramType = "query", dataType="String") ,
@ApiImplicitParam(name = Constant.ORDER, value = "排序方式，可選值(asc、desc)", paramType = "query", dataType="String")
})
@RequiresPermissions("pfm:platformmaterialcategory:page")
public Result<PageData<PlatformMaterialCategoryDTO>> page(@ApiIgnore @RequestParam Map<String, Object> params){
PageData<PlatformMaterialCategoryDTO> page = platformMaterialCategoryService.page(params);
return new Result<PageData<PlatformMaterialCategoryDTO>>().ok(page);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/155351.html
標籤：JavaScript
上一篇：HTML文本編輯器支持互動嗎？