구글 크롬 콘솔 'Attestation check for Topics on' 에러 원인과 해결방법

구글 크롬 콘솔 'Attestation check for Topics on' 에러 원인과 해결방법

최근 구글 크롬 브라우저에서 'Attestation check for Topics on https://pagead2.googlesyndication.com/ failed'라는 에러를 콘솔에서 마주한 사용자들이 많아졌습니다. 이 문제는 최신 크롬 버전(118.0.5993.71)에서 주로 발생하며, 많은 사용자들이 이 에러의 원인과 해결 방법을 찾지 못하고 있습니다.

구글에서도 이 문제에 대한 문서나 가이드를 제공하지 않아서 해결에 어려움을 겪는 경우가 많습니다. 이번 글에서는 이 에러가 발생하는 원인과 해결 방법을 상세히 설명드리겠습니다.

드물게 티스토리 블로그에서는 구글 아날리틱스 플러그인에서 문제를 발생시키는 중입니다.

'Attestation check for Topics on' 에러의 원인

'Attestation check for Topics on' 에러는 크롬 브라우저가 새로운 실험적 기능인 'Topics API'를 사용하면서 발생합니다. 이 기능은 브라우저가 사용자의 관심사를 기반으로 광고 타겟팅을 개선하기 위해 사용되는데, 보안 및 프라이버시 관련 요소를 검증하는 과정에서 문제가 생기면 콘솔에 해당 에러를 출력합니다.

이 에러는 대부분 'browsing-topics'에 대한 'Permissions-Policy' 헤더 설정이 되어 있지 않아 발생합니다. 크롬은 특정 사이트에서 Topics API 사용 여부를 확인하기 위해 이 헤더를 참조하게 되는데, 대부분의 웹사이트에서는 이 실험적 기능을 구현하지 않았기 때문에 에러가 발생하는 것입니다.

즉, 브라우저가 'browsing-topics' 정책을 검사하려고 시도했지만, 해당 설정이 없거나 잘못되어 있기 때문에 에러가 발생하는 것입니다. 이 에러는 특히 광고 관련 자바스크립트를 호출할 때 많이 나타나며, 사용자들이 이를 처리하는 방법에 대해 혼란을 겪고 있습니다.

'Attestation check for Topics on' 에러 해결 방법

이 문제를 해결하기 위해서는 'Permissions-Policy' 헤더에 'browsing-topics=()' 값을 설정하여 Topics API를 비활성화해야 합니다. 이를 통해 브라우저가 해당 정책을 더 이상 확인하지 않게 되고, 따라서 콘솔에 에러 메시지가 출력되는 것을 방지할 수 있습니다. 아래에서는 각 웹 서버 환경에 맞는 해결 방법을 제시합니다.

1. Apache(.htaccess 파일 사용)

Apache 서버를 사용하고 있다면, .htaccess 파일에 다음 코드를 추가하여 'Permissions-Policy' 헤더를 설정할 수 있습니다:

<IfModule mod_headers.c>
    Header set Permissions-Policy "browsing-topics=()"
</IfModule>

이 설정을 추가하면, 브라우저가 Topics API에 대한 정책을 확인하지 않기 때문에 에러가 발생하지 않습니다.

2. Nginx 서버 설정

Nginx 서버를 사용하고 있다면, 다음과 같이 server {} 블록에 'Permissions-Policy' 헤더를 추가할 수 있습니다:

server {
    ...
    add_header Permissions-Policy "browsing-topics=()" always;
    ...
}

이 설정을 통해 모든 HTTP 응답에 'Permissions-Policy' 헤더가 포함되며, Topics API의 검증을 비활성화할 수 있습니다.

3. Node.js + Express 사용 시

Node.js와 Express를 사용하고 있다면, 다음과 같은 방식으로 응답 헤더에 'Permissions-Policy'를 추가할 수 있습니다:

const express = require("express");
const app = express();

app.use((req, res, next) => {
    res.append('Permissions-Policy', 'browsing-topics=()');
    next();
});

이 코드는 모든 요청에 대해 'Permissions-Policy' 헤더를 추가하여 Topics API 검증을 비활성화합니다.

4. HAProxy 설정

HAProxy를 사용 중이라면, frontend 구성 블록 또는 특정 backend 블록에 다음과 같이 설정할 수 있습니다:

http-response set-header Permissions-Policy "browsing-topics=()"

이 설정을 통해 모든 백엔드에 대해 동일한 헤더가 적용되며, Topics API 관련 에러를 방지할 수 있습니다.

에러를 방지하기 위한 권장사항

현재 'browsing-topics'에 대한 'Permissions-Policy'는 실험적 기능으로, 모든 브라우저에서 동일하게 지원되는 것은 아닙니다. 이 기능은 브라우저가 사용자의 관심사를 파악하고 맞춤형 광고를 제공하기 위해 사용되지만, 대부분의 웹사이트에서는 이를 필요로 하지 않습니다. 따라서, 'Permissions-Policy: browsing-topics=()' 설정을 통해 이 기능을 비활성화하는 것이 권장됩니다.

또한, 이러한 에러가 발생하지 않도록 하기 위해서는 웹사이트의 보안 헤더를 주기적으로 점검하고 업데이트하는 것이 중요합니다. 이를 위해 securityheaders.com과 같은 도구를 사용하여 웹사이트의 보안 헤더 설정을 검사하고 부족한 부분을 보완할 수 있습니다.

결론

구글 크롬 콘솔에서 'Attestation check for Topics on' 에러는 실험적 기능인 Topics API와 관련된 보안 헤더 설정이 부족하여 발생하는 문제입니다. 이를 해결하기 위해서는 웹 서버에 적절한 'Permissions-Policy' 헤더를 추가하여 Topics API를 비활성화하면 됩니다. 각 서버 환경에 맞는 설정 방법을 적용하여 이 문제를 해결할 수 있으며, 이를 통해 개발자 도구 콘솔에서 더 이상 해당 에러 메시지가 출력되지 않게 할 수 있습니다.

이와 같은 보안 헤더 설정은 웹사이트의 보안성을 높이는 데도 기여하므로, 주기적인 점검과 업데이트를 통해 웹사이트의 안정성을 유지하는 것이 좋습니다.

키워드: 구글 크롬 콘솔, Attestation check for Topics, Permissions-Policy 헤더, Topics API, Chrome 에러 해결, .htaccess 설정, Nginx 설정, Node.js Express, 보안 헤더 설정, 웹사이트 보안