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

1688의 직접 이미지 링크를 웹사이트에 삽입했는데 표시하려는 제품 대신 손상된 이미지가 표시되었나요? 걱정하지 마세요, 혼자가 아닙니다! 이것은 매우 일반적인 현상입니다—그리고 이것은 1688이 의도적으로 하는 것입니다. 이 기사에서 원인과 해결책을 알아보겠습니다.

1688의 손상된 이미지

🔍 주요 원인: 1688이 Referer를 기반으로 이미지를 차단함

1688(다른 주요 전자상거래 플랫폼인 Taobao, JD.com, Alibaba와 함께)은 “hotlinking”(이미지 핫링킹)—즉, 서버에서 이미지를 가져와 웹사이트에 직접 표시하는 것—을 적극적으로 차단합니다.

작동 방식

사용자의 브라우저가 웹사이트에 접속하고 https://img.alicdn.com/...(또는 유사한 1688 도메인)에서 이미지를 로드하면 1688 서버는 HTTP Header에서 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를 우회합니다. 다른 프레임워크를 사용하여 유사한 기능을 구현할 수 있습니다.

// 사용 방법: 이 API를 img 태그의 src에 배치: <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 해킹”을 시도하지 마세요—처벌받기 쉽고, 신뢰를 잃으며, 불안정합니다.