there was a problem uploading the file. Setting: with-credentials= "true" is invalid. Check the data that header did not bring into cookie in the submitted url, which caused the submission to report an error

<style lang="less">
    @import "../../../styles/common.less";
    @import "../../css/upload.less";
    @import "../../css/work-flow.less";
</style>

<template>
    <Row>
        <Card>
            <a href="static/template.csv" target=_blank>
            <p slot="title">
                <Icon type="ios-download-outline"></Icon>
                
            

            </a>
            <Upload
                    type="drag"
                    :action="url"
                    :headers="{"Content-Type": "multipart/form-data"}"
                    :with-credentials="true"
                    :format="["csv"]"
                    :data="data"
                    :on-format-error="handleFormatError"
                    :before-upload="handleBeforeUpload"
                    :on-progress="handleProgress"
                    :on-success="handleSuccess"
                    :on-error="handleError"
            >
                <div style="padding: 60px 0;height: 200px;">
                    <Icon type="ios-cloud-upload" size="52" style="color: -sharp3399ff"></Icon>
                    

                </div>
            </Upload>
        </Card>
    </Row>
</template>

<script>
  import msgutil from "@/utils/message"
  import Api from "@/api"
  import Axios from "axios"
  import Cookies from "js-cookie"

  export default {
    name: "file-upload",
    data () {
      return {
        uploadList: [],
        url:"",
        data:{},
      };
    },
    methods: {
      getData(){
        this.url = Api.uploadRecipeLocation
        this.data={WEBID:Cookies.get("WEBID")}
      },
      handleFormatError (file) {
        msgutil.nWarning(this,""," " + file.name + " ")
      },
      handleBeforeUpload (file) {
        msgutil.nWarning(this,""," " + file.name + " ")

      },
      handleProgress (event, file) {
        msgutil.nInfo(this,""," " + file.name + " ")
        //  
//        let fd = new FormData()
//        fd.append("file", file)
//        Axios.post(this.url,fd).then((res) => {
//          console.log(res)
//        }, (res) => {
//          console.log(res)
//        });
//        return false;
      },
      handleSuccess (evnet, file) {        console.log(file)
        console.log(event);

        this.$Notice.success({
          title: "",
          desc: " " + file.name + " "
        });
      },
      handleError (event, file) {
        console.log(file)
        this.$Notice.error({
          title: "",
          desc: " " + file.name + " "
        });
      },
      handleView (name) {
      },
      handleRemove (file) {
        //  upload 
      },
    },
    mounted () {
    },
    created () {
      this.getData()
    }
  }
</script>