接口加密方案

最近的新项目需要考虑到安全性的需求,为了防止别人盗刷接口,就在请求拦截器里对所有接口请求进行了参数加密校验,校验不通过后端就会将请求拦截,从而达到加密的目的。

前端加密逻辑

加密方法:

js 复制代码
// utils/sign.js
import md5 from 'blueimp-md5'

// 密钥
const MD5_SIGN_KEY = 'abc123'

const md5Func = (obj) => {
	let keys = Object.keys(obj).sort()
	let sign = ''
	keys.forEach(item => {
		if (obj[item]) {
			sign += obj[item].toString()
		}
	})
	// 拼接密钥
	sign += MD5_SIGN_KEY
	// md5加密sign参数
	return md5(sign)
}

export { md5Func }

前端拦截器配置:

js 复制代码
// utils/http.js
import axios from 'axios'
import { md5Func } from '@/utils/sign'

const http = axios.create({
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 5000
})

// request 拦截器
http.interceptors.request.use(
  config => {
    if (config.method.toLocaleUpperCase() === 'GET') {
		config.query = {
			...config.query,
			sign: md5Func(config.query || {})
		}
	}

	if (config.method.toLocaleUpperCase() === 'POST') {
		config.body = {
			...config.body,
			sign: md5Func(config.body || {})
		}
	}
  },
  error => {
    return Promise.reject(error)
  }
)

// response 拦截器
service.interceptors.response.use(
  response => {
    if (data.code !== 200) {
      return Promise.reject(newError(data.message || 'Error'))
    } else {
      return data
    }
  },
  error => {
    return Promise.reject(error)
  })

export default http

原理:前后端维护同一个密钥,将参数加密为sign参数,后端用同样的方法加密,比对前端的sign参数是否一致,一致则校验通过,不一致则校验不通过。

后端加密逻辑,以PHP举例

php 复制代码
function verify($data=[]) {
	// 密钥
	$secretKey='abc123'
	ksort($data);
	$sign = '';
	foreach($data as $key => $value) {
		if ($key != 'sign') {
			$sign .= $value;
		}
	}
	$sign .= $secretKey
	$sign = md5($sign)
	// 比较前端传过来的签名与后端计算的签名是否一致
	if ($sign == $data['sign']) {
		return true;
	} else {
		return false;
	}
}
相关推荐
英俊潇洒美少年7 小时前
Vue 生产环境打包:SourceMap、压缩、混淆、加密全解 + 最佳实践
前端·javascript·vue.js
小江的记录本7 小时前
【JVM虚拟机】垃圾回收GC:四种引用类型:强引用、软引用、弱引用、虚引用(附《思维导图》+《面试高频考点清单》)
java·jvm·spring boot·后端·python·spring·面试
xingyuzhisuan7 小时前
网络 Token 常见故障原理,基础排查科普
运维·服务器·网络·php
m0_535817557 小时前
从0到1上手Claude Code:Windows安装+88api配置全流程
windows·gpt·node.js·claude·claudecode·88api
小马爱打代码8 小时前
Spring源码 第四篇:Spring 5 源码深度拆解:AOP 全流程核心原理
java·后端·spring
巴博尔8 小时前
UNIAPP中NVUE页面 动画
android·前端·javascript·ios·uni-app
z落落8 小时前
C#String字符串
开发语言·c#·php
猫头虎-前端技术8 小时前
JS 作用域与闭包:从变量提升到闭包陷阱的超详细解析
开发语言·javascript·云计算·bootstrap·ecmascript·openstack·perl
ServBay8 小时前
2026 Mac 本地大模型部署深度解析与混合架构指南
后端·macos·aigc
一拳一个娘娘腔9 小时前
【SRC漏洞挖掘系列】第10期:GraphQL & API 安全 —— 现代 API 的“裸奔”时代
后端·安全·graphql