https://wouldyou.tistory.com/36#google_vignette

프론트에서 html2canvas를 이용해서 카드 이미지를 생성하는데 여기서 프로필사진이 보이지 않는 문제가 발생했다.

Untitled

왼쪽 상단에 있는 프로필사진은 S3에서 가져오는건데 여기서 cors문제가 발생하게 된다. 그래서 프로필 사진을 가져오지 못한 채로 카드 캡쳐가 진행되는 것이다.

이 문제를 해결하기 위해 canvas로 사진을 저장하기 전에 서버에 proxy를 만들어서 백엔드로 사진을 요청 받는다. (s3에 직접 요청하는 게 아니라 백엔드가 요청해서 받아오도록 하는 것)

그래서 proxy 컨트롤러를 하나 추가했다.

package com.b210.damda.util.canvas.controller;

import com.amazonaws.util.IOUtils;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;

import javax.servlet.http.HttpServletRequest;
import java.net.HttpURLConnection;
import java.net.MalformedURLException;
import java.net.URL;
import java.net.URLDecoder;

@Controller
@RequestMapping(value="/html2canvas")
public class html2canvasController {

    @RequestMapping(value="/proxy.json", method= RequestMethod.GET)
    @ResponseBody
    public byte[] html2canvasProxy(HttpServletRequest req) {
        byte[] data = null;
        try {
            URL url = new URL(URLDecoder.decode(req.getParameter("url"),
                    java.nio.charset.StandardCharsets.UTF_8.toString()));

            HttpURLConnection connection = (HttpURLConnection)
                    url.openConnection();
            connection.setRequestMethod("GET");

            if(connection.getResponseCode() == 200) {
                data = IOUtils.toByteArray(connection.getInputStream());
            } else {
                System.out.println("responseCode : "
                        + connection.getResponseCode());
            }
        } catch (MalformedURLException e) {
            data = "wrong URL".getBytes(java.nio.charset.StandardCharsets.UTF_8);
        } catch(Exception e) {
            System.out.println(e);
        }
        return data;
    }
}

프론트에게 해다


타임캡슐 참여코드 Invite 중복생성 문제

타임캡슐 참여코드로 참여하는데 Invite 테이블이랑 mapping 테이블 두 개를 생성한다.

현재 로직은 Invite 생성해서 방장이 추방을 했을 경우 Invite의 status가 “REJECTED”로 바뀌는데

문제는 다시 참여코드로 생성했을 때 Invite를 검증하지 않는 게 문제였다.