Sample code for implementing interface signature with Vue+Springboot

1. Implementation ideas

The purpose of interface signature is to ensure that request parameters are not tampered with, whether the requested data has timed out, whether the data is submitted repeatedly, etc.

Interface signature diagram

When the client submits a request, it signs the following parameters according to the agreed signature method, and then submits the parameters and signature together to the server:

1. Request header part (header)
AppID: Different appIDs are assigned to different callers.
noce: The serial number of the request to prevent repeated submission.
timestamp: request timestamp, used to verify whether the request has timed out.

2. Data part
Path: Concatenate all key=value pairs according to the parameters in path.
Query: Concatenate all key=value pairs.
Form: Concatenate all key=value pairs
Body: Json, concatenated according to all key=value. String, the entire string is concatenated as a string.

sign

After the server submits the handover request, it also splices the received "request header part" and "data part" parameters. The signature submitted by the client is then verified to be correct.

2. Code implementation

The client (Vue) first needs to install the "jsrsasign" library to implement RSA encryption, decryption, signing, and verification functions.
Official address: http://kjur.github.io/jsrsasign/
Execute the following command:

npm install jsrsasign -save

After the installation is complete, package sign.js

import {KJUR, KEYUTIL, hex2b64, b64tohex} from 'jsrsasign'

// Signature algorithm const ALGORITHM = 'SHA256withRSA'

// Private key signature const RSA_SIGN = (privateKey, src) => {
    const signature = new KJUR.crypto.Signature({'alg': ALGORITHM})
    // To parse the key const priKey = KEYUTIL.getKey(privateKey) 
    signature.init(priKey)
    // Pass in the plaintext to be signed signature.updateString(src) 
    const a = signature.sign()
    // Convert to base64 and return return hex2b64(a) 
}
// Public key verification const RSA_VERIFY_SIGN = (publicKey, src, data) => {
    const signature = new KJUR.crypto.Signature({'alg': ALGORITHM, 'prvkeypem': publicKey})
    signature.updateString(src) 
    return signature.verify(b64tohex(data))
}

export {
    RSA_SIGN,
    RSA_VERIFY_SIGN
}

The client (Vue) uses sign.js to sign and verify the signature.

const src = 'I am a test string 2'

const publicKey = '-----BEGIN PUBLIC KEY-----\n' +
            'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC35wxzdTzseajkYL06hEKBCEJu\n' +
            'JQ/nySId2oTnsxbLiSTEjpAESSbML1lqkKaIwjrSFZzyLMH6DirsoEQcATqqoCDU\n' +
            '/H9QNVb5jMSAxxdQusQkTWz6k07bEuy1ppVjpGxNi8o2OGNd+lwPC/hOSDR7lpfm\n' +
            'aXLIjEwKSXzil7YAHQIDAQAB\n' +
            '-----END PUBLIC KEY-----'

const privateKey = '-----BEGIN PRIVATE KEY-----\n' +
            'MIICdQIBADANBgkqhkiG9w0BAQEFAASCAl8wggJbAgEAAoGBALfnDHN1POx5qORg\n' +
            'vTqEQoEIQm4lD+fJIh3ahOezFsuJJMSOkARJJswvWWqQpojCOtIVnPIswfoOKuyg\n' +
            'RBwBOqqgINT8f1A1VvmMxIDHF1C6xCRNbPqTTtsS7LWmlWOkbE2LyjY4Y136XA8L\n' +
            '+E5INHuWl+ZpcsiMTApJfOKXtgAdAgMBAAECgYB2PAcGSC7mPoW2ZvfiIlx7hurm\n' +
            '0885D1hu5yohqUOTklXgRWQUTU+zYRHU8LERJgcZQKoKDXqdIPS584Q2mRe0uZMr\n' +
            'vaiaBVEnHQreUJUQ8UN12pPUdBHDZvOk3L7/fZHk6A8uy5e09p2rsn+Vfki3zijp\n' +
            '7Pd758HMtjuiHBb2QQJBAOuN6jdWBr/zb7KwM9N/cD1jJd6snOTNsLazH/Z3Yt0T\n' +
            'jlsFmRJ6rIt/+jaLKG6YTR8SFyW5LIQTbreeQHPw4FECQQDH3Wpd/mBMMcgpxLZ0\n' +
            'F5p1ieza+VA5fbxkQ0hdubEP26B6YwhkTB/xMSOwEjmUI57kfgOTvub36/peb8rI\n' +
            'JdwNAkB3fzwlrGeqMzYkIU15avomuki46TqCvHJ8jOyXHUOzQbuDI5jfDgrAjkEC\n' +
            'MKBnUq41J/lEMueJbU5KqmaqKrWxAkAyexlHnl1iQVymOBpBXkjUET8y26/IpZp0\n' +
            '1I2tpp4zPCzfXK4c7yFOQTQbX68NXKXgXne21Ivv6Ll3KtNUFEPtAkBcx5iWU430\n' +
            '0/s6218/enaa8jgdqw8Iyirnt07uKabQXqNnvbPYCgpeswEcSvQqMVZVKOaMrjKO\n' +
            'G319Es83iq/m\n' +
            '-----END PRIVATE KEY-----\n'


console.log('plain text:', src)
const data = RSA_SIGN(privateKey, src)
console.log('Signed result:', data)

const res = RSA_VERIFY_SIGN(publicKey, src, data)
console.log('Signature verification result:', res)

After the server (Spring boot) receives the request, it needs to verify the data and signature.

First, introduce the dependency - hutool toolkit. Hutool is a Java toolkit, and it is just a toolkit. It helps us simplify every line of code, reduce every method, and make the Java language "sweet".

Official website: https://www.hutool.cn/

Add the following configuration under pom.xml:

<dependency>
    <groupId>cn.hutool</groupId>
    <artifactId>hutool-all</artifactId>
    <version>5.3.5</version>
</dependency>

The server (Spring boot) must first obtain the data requested by the client (Vue). As described above, the request data has two parts, namely the "request header part" and the "data part". Therefore, it is necessary to configure the interceptor to obtain the above two parts.

Configure the interceptor (MyInterceptor.java), the code is as follows:

import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Component;
import org.springframework.util.StreamUtils;
import org.springframework.web.servlet.HandlerInterceptor;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@Slf4j
@Component
public class MyInterceptor implements HandlerInterceptor {

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        //Get request parameters String queryString = request.getQueryString();
        log.info("Request parameters:{}", queryString);

        // Get the header
        log.info("key:{}",request.getHeader("timestamp"));

        MyHttpServletRequestWrapper myRequestWrapper = new MyHttpServletRequestWrapper(request);
        //Get the request body
        byte[] bodyBytes = StreamUtils.copyToByteArray(myRequestWrapper.getInputStream());
        String body = new String(bodyBytes, request.getCharacterEncoding());

        log.info("Request body: {}", body);

        return true;
    }
}

When getting the "request body", since the "HttpServletRequest" can only be read once, after the interceptor reads it, the subsequent Controller is empty when reading, so you need to rewrite the HttpServletRequestWrapper:

import org.springframework.util.StreamUtils;

import javax.servlet.ReadListener;
import javax.servlet.ServletInputStream;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletRequestWrapper;
import java.io.*;


public class MyHttpServletRequestWrapper extends HttpServletRequestWrapper {

    /**
     * The cached HTTP body
     */
    private byte[] body;

    public MyHttpServletRequestWrapper(HttpServletRequest request) throws IOException {
        super(request);
        body = StreamUtils.copyToByteArray(request.getInputStream());
    }

    @Override
    public ServletInputStream getInputStream() throws IOException {
        InputStream bodyStream = new ByteArrayInputStream(body);
        return new ServletInputStream(){

            @Override
            public int read() throws IOException {
                return bodyStream.read();
            }

            @Override
            public boolean isFinished() {
                return false;
            }

            @Override
            public boolean isReady() {
                return true;
            }

            @Override
            public void setReadListener(ReadListener readListener) {

            }
        };
    }

    @Override
    public BufferedReader getReader() throws IOException {
        return new BufferedReader(new InputStreamReader(getInputStream()));
    }
}

After that, you need to create a filter and replace "ServletRequest" with "MyHttpServletRequestWrapper". The code is as follows:

import lombok.extern.slf4j.Slf4j;

import javax.servlet.*;
import javax.servlet.http.HttpServletRequest;
import java.io.IOException;

@Slf4j
public class RepeatedlyReadFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {

    }

    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        ServletRequest requestWrapper = null;
        if (servletRequest instanceof HttpServletRequest) {
            requestWrapper = new MyHttpServletRequestWrapper((HttpServletRequest) servletRequest);
        }
        if(requestWrapper == null) {
            filterChain.doFilter(servletRequest, servletResponse);
        } else {
            filterChain.doFilter(requestWrapper, servletResponse);
        }

    }

    @Override
    public void destroy() {

    }
}

Then create a custom configuration, CorsConfig.java, and add filters and interceptors to the configuration:

import com.xyf.interceptor.MyInterceptor;
import com.xyf.interceptor.RepeatedlyReadFilter;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.boot.web.servlet.FilterRegistrationBean;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;

@Configuration
public class CorsConfig extends WebMvcConfigurationSupport {

    private MyInterceptor myInterceptor;

    @Autowired
    public CorsConfig (MyInterceptor myInterceptor) {
        this.myInterceptor = myInterceptor;
    }

    //Register filter@Bean
    public FilterRegistrationBean<RepeatedlyReadFilter> repeatedlyReadFilter() {
        FilterRegistrationBean registration = new FilterRegistrationBean();
        RepeatedlyReadFilter repeatedlyReadFilter = new RepeatedlyReadFilter();
        registration.setFilter(repeatedlyReadFilter);
        registration.addUrlPatterns("/*");
        return registration;
    }


    @Override
    protected void addInterceptors(InterceptorRegistry registry) {
        // addPathPatterns adds the namespace that needs to be intercepted;
        // excludePathPatterns adds exclusion interception namespace registry.addInterceptor(myInterceptor).addPathPatterns("/**");
        //.excludePathPatterns("/api/sys/login")
    }

}

Finally, complete the signature verification. The code is as follows:

import cn.hutool.core.codec.Base64;
import cn.hutool.crypto.SecureUtil;
import cn.hutool.crypto.asymmetric.Sign;
import cn.hutool.crypto.asymmetric.SignAlgorithm;


byte[] data = "I am a test string 2".getBytes();
        String publicKey = "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC35wxzdTzseajkYL06hEKBCEJu\n" +
                "JQ/nySId2oTnsxbLiSTEjpAESSbML1lqkKaIwjrSFZzyLMH6DirsoEQcATqqoCDU\n" +
                "/H9QNVb5jMSAxxdQusQkTWz6k07bEuy1ppVjpGxNi8o2OGNd+lwPC/hOSDR7lpfm\n" +
                "aXLIjEwKSXzil7YAHQIDAQAB";

Sign sign = SecureUtil.sign(SignAlgorithm.SHA256withRSA,null,publicKey);

//Signature String sent by the client qm = "IhY3LNuFn0isud1Pk6BL2eJV3Jl/UzDCYsdG9CYyJwOGqwnzStsv/RiYLnVP4bnQh1NRPMazY6ux/5Zz5Ypcx6RI5W1p5BDbO2afuIZX7x/eIu5utwsanhbxEfvm3XOsyuTbnMDh6BQUrXb4gUz9qgt9IXWjQdqnQRRv3ywzWcA=";
byte[] signed = Base64.decode(qm);

//Verify the signature boolean verify = sign.verify(data, signed);

3. Public key and private key generation

You can generate public and private keys online through some websites: https://www.bejson.com/enc/rsa/

bejson generates public and private keys online

4. Other issues

Because the client adds the signature and the server verifies the signature. Therefore, the method of adding and verifying signatures must be consistent, otherwise the signature cannot be verified. Vue and Java have different signature tool libraries, so be sure to test them before use.

This is the end of this article about the sample code of Vue+Springboot to implement interface signature. For more related Springboot interface signature content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!

You may also be interested in:

Solution to the 404 problem after SpringBoot interface call
A simple tutorial on using the SpringBoot visual interface development tool magic-api
Implementation method of Spring Boot interface parameter encryption and decryption
Common algorithms and characteristics of Spring Boot interface current limiting
Detailed explanation of creating scheduled tasks in springboot through annotations and interfaces
Java springboot interface quickly get started, take you to get started quickly in half an hour

<<: Pitfalls encountered when installing the decompressed version of MySQL 5.7.20 (recommended)

>>: How to install the standalone version of spark in linux environment without using hadoop