[취약점마이닝] 소스맵, webpck 소스코드 유출 취약점

1. npm을 사용하여 reverse-souecemap 설치

1.1 npm 설치

공식 홈페이지를 방문하여 설치 패키지를 다운로드한 후 다음을 클릭하세요.
https://nodejs.org/en
설치 패키지가 자동으로 환경 변수를 추가합니다.

설치 성공 여부 확인

npm -v

1.2 npm 구성 최적화

두 개의 폴더 node_cache 및 node_global을 만듭니다.

1.2.1 글로벌 모듈 저장 경로 및 캐시 경로

명령 실행

npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

1.2.2 이미지 소스 변경

npm config set registry=http://registry.npm.taobao.org 

방금 구성한 내용이 적용되는지 확인

npm config list

1.2.3 npm 업그레이드 및 업데이트 및 환경 변수 추가

# npm install 安装或更新模块 -g代表全局安装，即安装到D:\nodejs\node_global目录下
npm install npm -g

설치 오류:

프롬프트 메시지에 따라 관리자 모드에서 cmd를 열고 업데이트 명령을 다시 실행하면 설치가 성공합니다.

이때 글로벌에 어떤 모듈이 설치되어 있는지 다시 확인하면 우리가 설치한 npm을 찾을 수 있습니다.

npm list -global

기본 모듈 경로가 D:\nodejs\node_modules 디렉터리이므로
전역 디렉터리를 D:\nodejs\node_global\node_modules 디렉터리로 변경했는데, npm install 등의 명령어를 직접 실행하면 오류가 발생합니다.
환경 변수 NODE_PATH를 추가해야 하며 내용은 D:\nodejs\node_global\node_modules입니다.

1.3 역방향 소스맵 설치

npm install reverse-sourcemap -g

설치가 잘 되었는지 확인

在这里插入代码片

환경변수
D:\nodejs\node_global을 추가

하고 다시 실행하면 도움말 정보가 정상적으로 보이는 것을 확인하였다.

2. reverse-sourcemap을 사용하여 소스 코드를 역으로 가져옵니다.

reverse-sourcemap --output-dir 自定义输出目录 xxx.js.map

3. 버그 수정

이 취약점을 방지하려면 SourceMap 기능을 비활성화하거나 프로덕션 환경에서 SourceMap 파일에 대한 액세스를 제한해야 합니다. 예를 들어 Webpack 구성에서 SourceMap 기능을 비활성화합니다.

// webpack.config.js
module.exports = {
    
    
  // ...
  devtool: false,
};

또는 웹 서버 구성에서 SourceMap 파일에 대한 액세스를 제한합니다.

nginx

# nginx configuration
location /static/ {
    
    
  # 只允许本地访问
  allow 127.0.0.1;
  deny all;
  alias '/path/to/source-maps/';
}