enable属性的不安全性

我们在开发过程中，常常会用到enable这个属性来对按钮、输入框等等组件进行控制，往往依赖于一个变量来决定它是否可以被操作。但是这种做法往往是不安全的。原因就是用户可以通过浏览器元素检查修改该值，因此，如果涉及重要操作的组件，必须要严格控制该组件的操作权限与显示与否。
例如，button通过enable进行权限控制，并且在enable后没有进行进一步的验证，这就很危险。
开发中遇到的例子：简单描述一下之前的功能。通知发布，在密码输入正确前，“添加通知”按钮是disable状态，他需要在验证码框中输入密码，在每次输入后，前端检查密码是否正确，正确后将“添加通知”按钮enable，点击后跳转到通知编辑页面进行编辑，然后发布通知。

前人的做法是，输入框改变后，就进行密码验证，如果正确，就将添加通知的按钮enable，并设置编辑权限为true，然后跳转到编辑页面。同时做了路由跳转的限制，没有权限不可进入编辑页面。发布通知时并未进行权限验证。

漏洞是：用户直接检查元素，并将按钮enable，可以直接进入编辑页面。这是因为在点击添加通知后，直接将权限标志设为true造成。

我的改正：
第一次修改：由于非法用户是通过enable按钮进入编辑页面，他并不知道密码，所有在输入密码时，我将密码存储，并在最终发布时进行再次验证，这样即使非法用户能进入该页面，也无法进行通知发布。

这样解决了非法用户能发布通知的问题，但是并不完善，因为非法用户根本不应该看到这个编辑页面。

第二次修改：在第一次修改的基础上，将button块直接通过条件渲染v-if进行显示控制。这样，非法用户无法查看到button，也没有办法进入编辑页面。

这种修改的方法相对来讲好了一些。但是VUE注意不要用v-show就是了。非法用户没有办法进入编辑页面。

**其实这些都是不必要的。**因为正常的设计逻辑就不会出现这种错误。正常的设计思路就是，输入密码并确认后验证密码是否正确，正确就进行跳转，不正确就拒绝；配合路由跳转的限制，用户也无法直接输入url进入该页面，所以这是正常思路。

总之，涉及重要操作的组件，不要把权限控制暴露出来。