Image Hotlinking: 1688 이미지가 웹사이트에서 오류로 표시되는 이유는?

1688의 직접 이미지 링크를 웹사이트에 삽입했는데 표시하려는 제품 대신 손상된 이미지가 표시된 적이 있나요? 걱정하지 마세요, 당신만 그런 것이 아닙니다! 이것은 매우 흔한 현상입니다—그리고 1688이 의도적으로 하는 일입니다. 이 글에서 원인과 해결 방법을 함께 알아보겠습니다.

1688의 손상된 이미지

🔍 주요 원인: 1688이 Referer를 기준으로 이미지를 차단합니다

1688(Taobao, JD.com, Alibaba 등 다른 대형 이커머스 플랫폼과 함께)은 “hotlinking”—즉, 그들의 서버에서 이미지를 가져와 당신의 웹사이트에 직접 표시하는 행위—을 적극적으로 차단합니다.

작동 원리

사용자의 브라우저가 당신의 웹사이트에 접속하여 https://img.alicdn.com/...(또는 유사한 1688 도메인)에서 이미지를 로드하면, 1688의 서버는 HTTP 헤더 Referer를 확인합니다. 이 필드는 사용자가 어떤 페이지에서 접속했는지를 나타냅니다.

Referer가 1688 도메인이 아닌 경우(예: yourwebsite.com에서 접속한 경우), 1688은 다음을 수행합니다:

오류 이미지를 반환합니다(보통 “403 Forbidden”, “Hotlinking not allowed” 또는 “1688” 문구가 있는 흐릿한 이미지).
또는 403 상태 코드를 반환하여 이미지가 표시되지 않게 합니다.

이것은 1688의 기술 팀이 신중하게 설계한 대역폭 및 자원 보호 조치입니다.

💡 1688은 왜 이렇게 하는가?

이유	설명
대역폭 절약	1688의 이미지는 보통 매우 큽니다(고해상도, 제품 수가 많음). 수천 개의 다른 웹사이트가 핫링크하면 서버의 대역폭 소모가 커져 운영 비용이 증가합니다.
저작권 및 브랜드 보호	경쟁사나 소규모 상점이 제품 이미지를 무료로 사용해 재판매하는 것을 원하지 않습니다.
원본 페이지로 트래픽 유도	제품을 보고 싶다면 실제 1688 페이지로 방문하세요—이미지를 “도용”하여 별도 웹사이트를 만드는 것은 금지입니다.
불공정 경쟁 방지	많은 사람들이 실제 상품 없이 Shopee, Lazada, TikTok Shop 등에서 상점을 만들기 위해 1688 이미지를 사용합니다 → 1688은 이를 막고자 합니다.

✅ 해결 방법

1688의 허가 없이 Referer를 합법적으로 우회할 수는 없습니다. 하지만 안전하고 합법적인 몇 가지 대안이 있습니다:

1. 이미지를 다운로드하여 자신의 웹사이트에 업로드

가장 간단하고 효과적인 해결 방법입니다:

1688에서 이미지 다운로드 → 웹사이트의 /images/ 디렉토리에 저장
<img src="https://yourwebsite.com/images/product1.jpg"> 사용

장점: 법을 위반하지 않고, 차단되지 않으며, 로딩 속도가 더 빠릅니다(외부 서버에 의존하지 않기 때문).

주의: 저작권을 침해하지 않도록 하세요(독점 제품인 경우 공급업체에 허가를 요청해야 합니다).

2. CDN 또는 이미지 호스팅 서비스 사용

Cloudinary, Imgur, AWS S3과 같은 서비스가 좋은 대안이 될 수 있습니다:

이 서비스에 이미지를 업로드 → 새 링크 획득
1688에 의존하지 않는다는 점을 보장합니다

장점: 이미지 최적화, 빠른 로딩 속도, 동적 이미지 편집과 같은 추가 기능을 통합할 수 있습니다.

3. referer 우회

면책 조항: “referer 우회”를 사용하면 다음과 같은 위험이 발생할 수 있습니다:

1688의 서비스 약관 위반
IP 또는 계정 차단 가능성
지속 가능하지 않음—일시적인 방법에 불과함

사용 여부를 신중히 고려하세요.

다음 예제는 Expressjs를 사용하여 referer를 우회합니다. 다른 프레임워크를 사용해 유사하게 구현할 수도 있습니다.

// Sử dụng bằng cách đặt api này trong src của thẻ img: <img src=`/proxy-image?url=https://cbu01.alicdn.com/img/ibank/ten_anh.jpg` />
app.get('/proxy-image', async (req, res) => {
  const imageUrl = req.query.url

  if (!imageUrl) {
    return res.status(400).send('Missing "url" query parameter')
  }

  try {
    const parsedUrl = new URL(imageUrl)

    const userAgent = req.headers['user-agent'] || USER_AGENT

    const response = await fetch(imageUrl, {
      headers: {
        Referer: parsedUrl.origin,
        'User-Agent': userAgent,
      },
    })

    if (!response.ok) {
      console.warn(`[Image Proxy] Failed ${response.status}: ${imageUrl}`)
      return res.status(response.status).send(`HTTP ${response.status}`)
    }

    const buffer = await response.arrayBuffer()
    const contentType = response.headers.get('content-type') || 'image/jpeg'

    res.setHeader('Content-Type', contentType)
    res.setHeader('Cache-Control', 'public, max-age=86400')
    res.setHeader('Vary', 'Accept-Encoding')
    res.end(Buffer.from(buffer))
  } catch (error) {
    console.error(`[Image Proxy] Error: ${error.message}`)
    res.status(500).send('Internal Server Error')
  }
})

AI를 사용하여 위 코드를 원하는 프로그래밍 언어로 변환할 수 있습니다. 또한 nginx와 같은 정적 프록시 서버를 사용해서도 이 우회를 구현할 수 있습니다.

🔧 빠른 확인: Referer 차단 여부 확인하기

다음 방법으로 referer 차단 여부를 쉽게 확인할 수 있습니다:

DevTools 열기 (F12) → Network 탭
페이지 새로고침 → 이미지 파일 찾기 → 클릭
확인:
- Status: 403 Forbidden인가요?
- Response: “Hotlinking is not allowed” 이미지가 보이나요?
- Headers → Referer: 당신의 도메인인가요?

맞다면 → referer로 차단된 것입니다!

✅ 결론

최선의 해결 방법: 이미지를 다운로드하여 웹사이트나 CDN에서 호스팅하세요. referer를 “해킹”하려 하지 마세요—제재를 받기 쉽고, 신뢰를 잃으며, 안정적이지 않습니다.