앱 테스트 서버 방화벽 설정 등 관련 문의

안녕하세요.

앱 번들을 처음으로 업로드 하고 테스트 진행 하려고 합니다.

QR 코드로 앱 진입 이후 자사 백엔드 서버와 통신이 제대로 안되는 것 같아 문의 드립니다.

개발 환경 및 환경 구성은 아래와 같습니다.

- 개발환경
  - web-view 환경 (react / react-router)

- 서버환경
  - 백엔드 서버에 mTLS 인증서를 통한 앱인토스 서버 요청 처리

- 네트워크 환경
  - AWS ALB 보안그룹 내 인바운드에 아래 IP 항목 추가
    - https://developers-apps-in-toss.toss.im/api/overview.html 에 명시된 방화벽

이외에 추가적으로 확인이 필요한 사항이 있을까요?

로컬 개발환경에서는 문제 없이 테스트 이후 앱 번들 생성하여 업로드 이후 테스트 앱에서 통신이 안되고 있습니다.


추가확인

임시로 인바운드 모든 트래픽 허용으로 하여도 접속이 안되는 것 같습니다.

아래는 프로젝트 설정 정보입니다.

// vite.config.ts
export default defineConfig(({ mode }) => {
  ...
  return {
    ...
    server: {
      proxy: {
        '/toss/api': {
          target: 'https://apps-in-toss.theminda.com'
          secure: true,
          changeOrigin: true,
          headers: {
            origin: 'https://apps-in-toss.theminda.com'
          },
          rewrite: path => path.replace(/^\/toss\/api/, '/api/v2/apps-in-toss'),
        }
        ...
      }
    }
  }
}

위와 같이 자사 벡엔드 서버로 전송하는 path 별 proxy 설정이 세개 정도 path 에 대하여 설정되어 있습니다.

// granite.config.ts
...
export default defineConfig({
  appName: 'minda',
  brand: {
    displayName: '민다',
    primaryColor: '#E26100',
    icon: 'https://image.theminda.com/assets/apps-in-toss/minda_logo.png',
    bridgeColorMode: 'basic',
  },
  web: {
    host: 'localhost',
    port: 5173,
    commands: {
      dev: 'vite',
      build: 'tsc -b && vite build',
    },
  },
  permissions: [
    {
      name: 'clipboard',
      access: 'write',
    },
  ],
  outdir: 'dist',
});