https://segmentfault.com/q/1010000005618139

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>
解决方案： 
1.接口服务方输入控制
2.参数合法性校验
3.HTTPS
4.CSRFToken安全性校验

这对用户是透明的，防范思路：

1.服务端CSRFToken校验
2.refer校验
3.同一用户的频度控制

输出响应前服务端对SessionID混淆前缀并加密（MD5），埋点在HTML隐藏<Input />，所有请求将此字段发送给服务端，校验是否相等
 判断$_REQUEST['Referer']，判断这个字段是不是为空或者不是你希望的域名

 
 
二
这类查看数据的api，有什么秘密可言么？如果真有秘密，那应该在api鉴权上下功夫，譬如要求访问这个api的人必须登录啊，或者有相应权限啊什么的。

否则如果仅仅是大众数据，本来也是给人看的，那能防得住么？

还有一点你没搞清楚，信息安全重点在信息，但你理解成获取信息的渠道了。

Api就算防，也不是防止别人知道你的api，而且防止别人非法通过你的api获取里面的数据

那么vue这种项目，用session还是cookie储存用户状态。
https是在什么时候加密数据

首先，session是存在于服务端的存储用户状态的东西。cookie是在客户端保存数据的东西。二者完全不是一回事。

但通常我们配合使用，在客户端用cookie保存一个sessionID，用户每次发请求到后端都带着这个sessionID，后端接收到请求后根据这个sessionID再从不管缓存也好、memcached之类的缓存工具也好里面拿出对应的session数据使用。

https是协议层的东西，通常公司的运维、it工程师搞定，当然如果你确实需要了解，可以网上查资料

vue ajax获取数据的时候，如何保证传递参数的安全或者说如何保护api的安全的更多相关文章

  1. vue 中使用 AJAX获取数据的方法

    在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...

  2. jquery通过ajax获取数据，控制显示的数据条数

    效果图: 现在我们可以先看它的json数据,如图所示:                然后可以对应我们的代码进行理解. jquery通过ajax获取数据,并通过窗口大小控制显示的数据条数,以及可以根据 ...

  3. jquery.ajax和Ajax 获取数据

    前几天接触了jquery 看到里面ajax的部分,自己也不是很懂,然后有重复看了即便,然后写了一个小功能,分享下...我刚学的.有错误的请指教. 验证用户名是否存在 在checkname_jqajax ...

  4. node.js之用ajax获取数据和ejs获取数据

    摘要:学了node之后有时候分不清前台和后台,今天用ajax和ejs来从后台获取数据,没有数据库,用json数据来进行模拟数据库:来区分前台和后台需要干什么? 一.用ejs获取数据 1.文件目录 2. ...

  5. 获取链接的参数，判断是否是微信打开，ajax获取数据

    //获取链接参数function GetQueryString(name) {    var reg = new RegExp("(^|&)" + name + " ...

  6. select2 AJAX获取数据

    页面效果: index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"& ...

  7. debug - vue中通过ajax获取数据时,如何避免绑定的数据中出现property of undefined错误

    因为获取服务器是异步的,所以 vue 先绑定数据. 如果 ??? 是通过 ajax 异步获取的,在获取之前,???是未定义的.此时在外面的标签上添加一个 v-if="???" 可以 ...

  8. 用Nodejs+Express搭建web，nodejs路由和Ajax传数据并返回状态，nodejs+mysql通过ajax获取数据并写入数据库

    小编自学Nodejs,看了好多文章发现都不全,而且好多都是一模一样的 当然了,这只是基础的demo,经供参考,但是相信也会有收获 今天的内容是用Nodejs+Express搭建基本的web,然后呢no ...

  9. [NodeJs] 用Nodejs+Express搭建web，nodejs路由和Ajax传数据并返回状态，nodejs+mysql通过ajax获取数据并写入数据库

    小编自学Nodejs,看了好多文章发现都不全,而且好多都是一模一样的 当然了,这只是基础的demo,经供参考,但是相信也会有收获 今天的内容是用Nodejs+Express搭建基本的web,然后呢no ...

随机推荐

  1. vue基础学习（三）

    03-01  vue的生存周期-钩子函数 <style> [v-cloak]{display:none;} </style> <div id="box" ...

  2. Java设计模式之（一）------单例模式

    1.什么是单例模式? 采取一定的办法保证在整个软件系统中,单例模式确保对于某个类只能存在一个实例.有如下三个特点: ①.单例类只能有一个实例 ②.单例类必须自己创建自己的实例 ③.单例类必须提供外界获 ...

  3. springBoot系列教程03：redis的集成及使用

    1.为了高可用,先安装redis集群 参考我的另一篇文章 http://www.cnblogs.com/xiaochangwei/p/7993065.html 2.POM中引入redis <de ...

  4. vmware workstation14永久激活密钥分享

    vmware workstation14永久激活密钥分享 VMware Workstation是一款功能强大的桌面虚拟计算机软件,简单来说就是最强的中文虚拟机了,可以在桌面上运行不同的操作系统,下面就 ...

  5. php SeasLog使用以及liunx环境下安装

    1.下载SeasLog http://pecl.php.net/package/SeasLog php官方 https://github.com/Neeke/SeasLog 作者的github  2. ...

  6. Python：名片管理系统（增加登录功能后出现问题，求教）

    我将一个简单的名片管理系统定义成了函数.. 2层. 一个登录界面: 一个名片管理系统使用界面: 逻辑是:登录成功=>跳入名片系统使用界面,同时,跳出登录界面,给出欢迎使用,程序结束. 此时问题来 ...

  7. Java框架之Spring MVC（一）

    一.Spring简介 Spring MVC是当前最优秀的 MVC 框架,自从Spring 2.5 版本发布后,由于支持注解配置,易用性有了大幅度的提高.Spring 3.0 更加完善,实现了对 Str ...

  8. 【转】sublime text 3 显示空格和Tab

    因为sublime text3确实太好用了所以也用它写代码了,可是在Python3第一步把preferences.sublime-setting-Default里面的"draw_white_ ...

  9. Django----->inclusion_tag的使用

    一种比较普遍的tag类型是只是渲染其它模块显示下内容,这样的类型叫做Inclusion Tag. 常用的模板标签是通过渲染 其他 模板显示数据的. 比如说,Django的后台管理界面,它使用了自定义的 ...

  10. RPC-非阻塞通信下的同步API实现原理，以Dubbo为例

    Netty在Java NIO领域基本算是独占鳌头,涉及到高性能网络通信,基本都会以Netty为底层通信框架,Dubbo 也不例外.以下将以Dubbo实现为例介绍其是如何在NIO非阻塞通信基础上实现同步 ...