HI akiraly good cage,but can not set background imgae

[sin66x]

I made it by using these codes: 1- A servlet like

/*
 * Copyright 2011 Király Attila
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
package com.example.config;

import com.github.cage.Cage;
import com.github.cage.GCage;
import com.rqbank.pishkhan.apiinterface.session.SessionHandler;
import com.rqbank.pishkhan.apiinterface.util.CommonUtil;
import org.bouncycastle.mime.encoding.Base64OutputStream;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;

/**
 * An example servlet that generates captcha images directly to the response
 * stream.
 * 
 * @author akiraly
 * 
 */

@WebServlet("/captcha")
public class CaptchaServlet extends HttpServlet {

    private static final long serialVersionUID = 1490947492185481844L;

    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        GCage gCage = new GCage();
        String token = CommonUtil.generateCaptcha(6);
        String sessionId = Captcha.addCaptcha(token);
        response.setContentType("image/"+gCage.getFormat());
        response.setHeader("Cache-Control", "no-cache");
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setDateHeader("Expires", 0);
        response.setHeader("Progma", "no-cache");
        response.setDateHeader("Max-Age", 0);
        response.setHeader("SessionId", sessionId);
        gCage.draw(token, new Base64OutputStream(response.getOutputStream()));
    }

    private static final Cage cage = new GCage();

    /**
     * Generates a captcha token and stores it in the session.
     * 
     * @param session
     *            where to store the captcha.
     */
    public static void generateToken(HttpSession session) {
        final String token = cage.getTokenGenerator().next();

        session.setAttribute("captchaToken", token);
        markTokenUsed(session, false);
    }

    /**
     * Used to retrieve previously stored captcha token from session.
     * 
     * @param session
     *            where the token is possibly stored.
     * @return token or null if there was none
     */
    public static String getToken(HttpSession session) {
        final Object val = session.getAttribute("captchaToken");

        return val != null ? val.toString() : null;
    }

    /**
     * Marks token as used/unused for image generation.
     * 
     * @param session
     *            where the token usage flag is possibly stored.
     * @param used
     *            false if the token is not yet used for image generation
     */
    protected static void markTokenUsed(HttpSession session, boolean used) {
        session.setAttribute("captchaTokenUsed", used);
    }

    /**
     * Checks if the token was used/unused for image generation.
     * 
     * @param session
     *            where the token usage flag is possibly stored.
     * @return true if the token was marked as unused in the session
     */
    protected static boolean isTokenUsed(HttpSession session) {
        return !Boolean.FALSE.equals(session.getAttribute("captchaTokenUsed"));
    }

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        final HttpSession session = req.getSession(false);
        final String token = session != null ? getToken(session) : null;
        if (token == null || isTokenUsed(session)) {
            resp.sendError(HttpServletResponse.SC_NOT_FOUND,
                    "Captcha not found.");

            return;
        }

        setResponseHeaders(resp);
        markTokenUsed(session, true);
        cage.draw(token, resp.getOutputStream());
    }

    /**
     * Helper method, disables HTTP caching.
     * 
     * @param resp
     *            response object to be modified
     */
    protected void setResponseHeaders(HttpServletResponse resp) {
        resp.setContentType("image/" + cage.getFormat());
        resp.setHeader("Cache-Control", "no-cache, no-store");
        resp.setHeader("Pragma", "no-cache");
        final long time = System.currentTimeMillis();
        resp.setDateHeader("Last-Modified", time);
        resp.setDateHeader("Date", time);
        resp.setDateHeader("Expires", time);
    }
}

2- An HTML/JS Like:

<html>
<script src="jquery-3.3.1.min.js"></script>
<script>
    $.ajax({
        type : 'GET',
        url : '/captcha',
        success : function(data,status,xhr) {
            $('#captcha').attr('style', ('background: url(data:image/jpg;base64,'+data+');height: 32px;\n' +
                '    width: 179px;\n' +
                '    background-size: 90px;\n' +
                '    background-repeat: no-repeat;\n' +
                '    background-position: right').replace(/\s+/g, ''));
        }
    });
</script>
<body>
<input id="captcha" placeholder="Captcha" >

</body>
</html>

Of course if you want to use it you should add JQuery library.

=============

The mail issue was that JS adds white spaces in the base64 data, you could delete it by .replace(/\s+/g, '')