vue 前端请求数据时约定的MD5等方式加密可以在浏览器控制台源代码中看到加密方式，如何解决？

Question

需求：是为了防止别人用postman等工具恶意调用接口；简单来讲就是接口只能在我的网页里调用，其他方式一律不能调用；

因此前后端约定了一套加密方式： 如（MD5('用户手机号'+'约定字符串'+时间戳)）
然后我把上面这个结果放在了请求头里，通过key:'testA'传递给后端;
testA: xxxxxxxxxxxx;

如此初步解决了别人恶意调用接口的问题，但是过了几天发现被破解了，原来我搜了在浏览器控制台-源代码如图：

应该怎么规避这个问题；或者我的加密思路不对，应该怎样做能避免这个呢？

Answer 1

简单的一句话就是：浏览器能拿到的东西，就不能阻止别人去拿。除非你写专用浏览器把密钥内置到浏览器中（都还是存在被破解出来的可能性）

这也是为什么前端永远不可信的原因，后端必须要做安全验证和数据有效性验证。

参阅：

• 安全地在前后端之间传输数据 - 「1」技术预研 - SegmentFault 思否
• 安全地在前后端之间传输数据 - 「2」注册和登录示例 - SegmentFault 思否
• 安全地在前后端之间传输数据 - 「3」真的安全吗？ - SegmentFault 思否

Answer 2

给个参考

Answer 3

这个应该先定义什么是恶意调用？比如短时间频繁调用，那应该针对的是这个短时间频繁调用去做处理，限制同一ip短时间的访问次数。
我在控制台进行接口访问算不算恶意的呢？

想防止工具调用有个方法，就是接口在请求后返回一个新的标识符，类似sessionId的，每次请求带上这个sessionId，由后端校验这个sessionId是否合法。这个sessionId短时有效。

Answer 4

1. 严格来说，你的需求做不到。
2. 你们目前的方案，只是给自己增加了一些负担，意义不大。
3. 你可以加强一些混淆手段，比如把 md5 改成 mhno1，但是治标不治本。
4. 没有办法彻底防止别人在你们页面外访问你们的接口，只能通过一些规则做限制，不过我觉得价值不大。

5. 一般来说，接口只要保证以下几点即可：

   1. 不能伪造数据
   2. 所有数据都合法
   3. 不能伪造用户身份