vue+element中解决upload跨域问题
在element中upload上传文件中,直接把调用方法写在action中是造成跨域的根源,解决方法就是重写upload+proxyTable.changeOrigin = true.upload中,<el-form-item label="上传模板只能zip文件"style="width: 550px;"><!-- TemplateData.FileId --><e
·
在element中upload上传文件中,直接把调用方法写在action中是造成跨域的根源,解决方法就是重写upload+proxyTable.changeOrigin = true.
upload中,使用:http-request代替action
<el-form-item label="上传模板只能zip文件" style="width: 550px;"><!-- TemplateData.FileId -->
<el-upload
class="avatar-uploader put"
action="upload"
:http-request="handleUploadFile"
accept=".zip"
:data = "{dir: 'B2BInfo'}"
:show-file-list="true"
:on-success="ziphandleAvatarSuccess"
:before-upload="zipbeforeAvatarUpload">
<i class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
// 重写文件上传方法
handleUploadFile (params) {
axios({
method: 'post',
url: '/templateApi/UploadTemplate/UploadFile/',
headers: {'Content-Type': 'application/json'},
})
},
然后找到config/index.js,修改proxyTable下的changeOrigin为true,true代表允许跨域。关于proxyTable,可以查看文章:
https://blog.csdn.net/qq_41566366/article/details/107382533
proxyTable: {
'**/*': {
target: 'http://loc-admin.114my.com/',
changeOrigin: true,
filter: function (pathname, req) {
if(pathname.indexOf('/api') == 0){
return true;
}
return pathname.match('^/[^static|_|content].*$') || pathname.match('^/api/.*?$')
}
},
'/templateApi':{
target: 'http://loc-dynamicsite.114my.com:8086/api/',
changeOrigin: true,
pathRewrite:{ // 路径重写,
'^/templateApi': ''
}
},
},
更多推荐
已为社区贡献3条内容
所有评论(0)