下载图像时出现CORS问题

Question

我有一个API,它将base64字符串转换为图像并在Tomcat Server中写入图像.图像在调用API后成功写入,但在检索相同图像时出现错误:

"请求资源上没有'Access-Control-Allow-Origin'标头.因此不允许访问Origin.XMLHttpRequest无法加载http:// hostname:4444 // tmpFiles/31487660124865.jpg.没有'访问控制 - Allow-Origin'标头出现在请求的资源上.

我的代码如下:

public Message uploadImage(Map<String, String> map) {

    // Initializing the message
    Message message = new Message();

    try {

        // Get the file data
        String fileData = map.get("file_data");

        // Split the data with the comma
        String base64Image = fileData.split(",")[1];

        // Convert the base64 input to binary
        byte[] imageBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(base64Image);

        BufferedImage image = ImageIO.read(new ByteArrayInputStream(imageBytes));

        // Manipulations in File Name
        String fileName = map.get("file_name");
        String file = fileName.substring(0, fileName.indexOf("."));
        String fileExtension = fileName.substring(fileName.indexOf("."));

        // Get the current time
        Long time = new Date().getTime();

        // Write the file name with the current time to avoid redundancy
        String maniputedFileName = file + "" + time + fileExtension;
        System.out.println("manipulated file name is " + maniputedFileName);

        // Check if file name is not empty
        if (!maniputedFileName.isEmpty()) {

            // Get the root path of tomcat server
            String rootPath = System.getProperty("catalina.home");

            System.out.println("root Path:- " + rootPath);

            // File Directory/Path on tomcat server
            File fileDirectory = new File(rootPath + File.separator + "webapps/tmpFiles");

            // If file direcory does not exist
            if (!fileDirectory.exists())
                fileDirectory.mkdirs();

            File outputfile = new File(fileDirectory.getAbsolutePath() + File.separator + maniputedFileName);

            // Write created image on server
            ImageIO.write(image, "png", outputfile);

            // Set the success message
            message.setDescription("You successfully uploaded file=" + maniputedFileName);
            message.setObject(outputfile.getAbsolutePath());
            message.setValid(true);
            return message;

        }
        // Set the failure message
        else {
            message.setDescription("You failed to upload " + maniputedFileName + " because the file was empty.");
            message.setValid(false);
            return message;
        }
    }
    // Handling all exceptions
    catch (IOException e) {
        message.setDescription(e.getMessage());
        message.setValid(false);
        return message;
    }
}

而web.xml是:

     <filter>
        <filter-name>tokenfilter</filter-name>
        <filter-class>com.springiot.filter.TokenFilter</filter-class>
    </filter>
    <filter-mapping>
    <filter-name>tokenfilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>
<filter>
    <filter-name>SimpleCORSFilter</filter-name>
    <filter-class>com.springiot.filter.SimpleCORSFilter</filter-class>
</filter>
<filter-mapping>
    <filter-name>SimpleCORSFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

我的tokenFilter类是:

 HttpServletResponse response = (HttpServletResponse) res;

    response.addHeader("Access-Control-Allow-Origin", "*");
    response.addHeader("Access-Control-Allow-Methods", "POST, GET,OPTIONS, DELETE");
    response.addHeader("Access-Control-Max-Age", "3600");
    response.addHeader("Access-Control-Allow-Headers",
            "Content-Type, Access-Control-Allow-Headers, Authorization,X-Requested-With,token,userKey,user_id");

Answer 1

有一些规则需要遵循：

\n\n

\n
1. 如果您向不同的域发出请求 XMLHttpRequest，则会出现此问题。
\n
2. 为了安全策略，浏览器总是允许同源，而不是其他。如果浏览器发现任何不同的请求，那么它会阻止你。
\n

\n\n

这个问题[How to use a CORS proxy to get around \xe2\x80\x9cNo Access-Control-Allow-Origin header\xe2\x80\x9d issues]在这里得到解答： https: //stackoverflow.com/a/43881141/ 2293534

\n\n

\n

CORS 安全 - 通用允许

\n\n

\n
1. 将“Access-Control-Allow-Origin”标头设置为 *
\n
2. 有效地将内容转变为公共资源，允许从任何域访问。
\n

\n\n

应用场景：

\n\n

\n
1. 攻击者可以通过诱使用户访问 Internet 上攻击者控制的站点来从已将此标头设置为 * 的 Intranet 站点窃取数据。
\n
2. 当受害者导航到攻击者控制的站点时，攻击者可以通过受害者\xe2\x80\x99s 浏览器对其他远程应用程序进行攻击。
\n

\n

\n\n

我在这里给出了答案：这个 CORS 处理程序安全吗？ 您可以在此处查看 CORS。它会澄清你的更多。

\n\n

资源链接：

\n\n

\n
1. 跨源 XMLHttpRequest
\n
2. 为什么我的 JavaScript 会出现“请求的资源上不存在‘Access-Control-Allow-Origin’标头”错误，而 Postman 却没有？
\n

\n