vue ajax获取数据的时候,如何保证传递参数的安全或者说如何保护api的安全
点击提交,发送请求。
但是api:123用于加密的参数,直接暴露了。右键源代码就可以看到
<body>
<div class="row">
<div class="col-md-4 col-md-offset-4">
<table class="table table-bordered" id="content">
<tr>
<td>
商品分类
</td>
<td>
<select name="cid" v-model="cid">
<template v-for="vo in goodscategory">
<option v-bind:value="vo.goodscategory_id">{{vo.goodscategory_name}}</option>
</template>
</select>
{{cid}}
</td>
</tr>
<tr>
<td style="width: 30%">
商品名称
</td>
<td>
<input type="text" name="name" v-model="goodsname" value=""/>
<span>{{ goodsname }}</span>
</td>
</tr>
<tr>
<td>
排序
</td>
<td>
<input type="text" name="sort" v-model="sort"/>
{{sort}}
</td>
</tr>
<tr>
<td>
价格
</td>
<td>
<input type="text" v-model="price"/>
{{price}}
</td>
</tr>
<tr>
<td>
商品描述
</td>
<td>
<textarea name="desc" id="" cols="30" rows="5" v-model="desc"></textarea>
{{desc}}
</td>
</tr>
<tr>
<td colspan="2">
<button type="button" v-on:click="submit">提交</button>
</td>
</tr>
</table>
</div>
</div>
<script type="text/javascript">
var vm = new Vue({
el:"#content",
data: {
cid:0,
goodsname:"",
sort:0,
price:0,
desc:"",
goodscategory:[]
},
methods: {
submit: function () {
this.$http({
url: 'http://localhost/wang/index.php/Admin/Goods/createProcess',
method: 'POST',
emulateJSON: true,
data: {
cid: this.cid,
name: this.goodsname,
sort: this.sort,
price: this.price,
desc: this.desc
}
}).then(function(response) {
console.log(response.data);
}, function(response) {
});
}
},
ready: function() {
var self = this;
this.$http({url: 'http://localhost/wang/index.php/Home/Vue/goodscategory', method: 'POST'}).then(function (response) {
self.$set('goodscategory', response.data)
}, function (response) {
// error callback
});
}
})
</script>
上https
呗,这个其实就是正常的网站开发方面的安全问题,不是vue
独有的。
1.接口服务方输入控制
2.参数合法性校验
3.HTTPS
4.CSRFToken安全性校验