张xiaok
张xiaok
  • 发布:2018-01-11 13:11
  • 更新:2018-01-11 14:21
  • 阅读:15843

【报Bug】vue-axios的post请求返回结果500服务器端错误

分类:HBuilder

详细问题描述
[内容]

重现步骤
[步骤]以hbuilder的服务器的形式在chrome中打开,点击页面上的axios的get请求方式没问题,post方式
[结果]
[期望]

运行环境
[系统版本] windows7
[浏览器版本]chrome 最新
[IDE版本]更新最新版本
[mui版本]

附件
[代码片段] 请求的是一个本地的package.json 文件(随便建一个有内容的文件就行),但是get方式没有问题,但是post方式返回服务器端错误,不能正确返回文件的内容, 但是使用webstorm就没有问题
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<div id="app" class="container">
<h1>vue-axios插件</h1>
<a href="javascript:;" class="btn btn-primary" v-on:click="get">Get请求</a>
<a href="javascript:;" class="btn btn-primary" @click="post">Post请求</a>
<a href="javascript:;" class="btn btn-primary" @click="http">http请求</a>
<br />
<span>{{msg}}</span>
</div>

<script>
new Vue ({
el:"#app",
data:{
msg: 'Welcome to Your Vue.js App'
},
mounted(){
axios.interceptors.request.use(config=>{
console.log("init request"+config);
return config;
}),
axios.interceptors.response.use(config=>{
console.log("init response"+config);
return config;
})
},
methods:{
get:function(){
axios.get("../package.json",{
params:{
userId:99
},
hearders:{
token:"loginToken"
}
}).then(res=>{
this.msg = res.data;
}).catch(err=>{
this.msg = err;
}
);
},
post(){
axios.post("../package.json",{
userId:888
},{
headers:{
token:"Tom"
}
}).then(res=>{
this.msg = res.data;
}).catch(err=>{
this.msg = err;
});
},
http(){
axios({
url:"../package.json",
method:"post",
params:{ //get方式传递参数
userId:"200"
},
data:{//post方式传递参数
userName:"zhangsan"
},
headers:{
token:"http-text-token"
}
}).then(res=>{
this.msg = res.data;
})
}
}
})
</script>
</body>
</html>

[安装包]

联系方式
[QQ]243685895
[电话]13516356824

2018-01-11 13:11 负责人:无 分享
已邀请:
lxl

lxl

post就不是用来获取文件的,是用来提交信息的!

该问题目前已经被锁定, 无法添加新回复