Softonic

Trình làm rối mã JavaScript

Bước 1 / 2
Chế độ
Tiếp theo

Làm rối mã làm tăng chi phí để đọc hiểu mã nguồn JavaScript của bạn, không phải tuyệt đối (không có cách làm rối mã front-end nào là bất khả xâm phạm), nhưng đủ để khiến người ta ngại xem xét qua loa và làm chậm việc thu thập dữ liệu tự động. Công cụ này áp dụng mã hóa mảng chuỗi, xáo trộn định danh, làm phẳng luồng điều khiển và chèn mã chết tùy chọn, mỗi tùy chọn có thể bật tùy theo mức độ quyết liệt mà bạn mong muốn.

Cách làm rối mã JavaScript

  1. 1

    Dán mã nguồn

    Bất kỳ mã JS hợp lệ nào. Nếu mã phụ thuộc vào những tên thuộc tính toàn cục cụ thể của trang chủ, hãy đặt chúng làm tên dành riêng.

  2. 2

    Chọn kỹ thuật

    Mã hóa chuỗi (hex / base64), xáo trộn định danh, làm phẳng luồng điều khiển, chèn mã chết, lớp bọc tự bảo vệ.

  3. 3

    Chọn hồ sơ mục tiêu

    Trình duyệt (an toàn với ES5, không có API Node), Node.js (cho phép `require`, `Buffer`), hoặc thấp (chủ yếu là rút gọn).

  4. 4

    Làm rối mã

    Công cụ xuất ra mã đã biến đổi kèm mức chênh lệch kích thước. Các thiết lập quyết liệt có thể khiến đầu ra lớn gấp 3–5 lần so với mã nguồn.

Các kỹ thuật và cái giá phải trả

Kỹ thuật Tăng công sức của kẻ tấn công Chi phí lúc chạy Chi phí kích thước
Đổi tên biến Thấp Không đáng kể Nhỏ hơn (hiệu ứng phụ của việc rút gọn)
Mã hóa mảng chuỗi Trung bình Nhỏ (một lần tra cứu cho mỗi chuỗi) +10–30%
Làm phẳng luồng điều khiển Cao Có thể đo được (~2–5%) +50–150%
Chèn mã chết Thấp (bảo mật phô trương) Nhỏ +20–50%
Lớp bọc tự bảo vệ Trung bình Kiểm tra một lần +5–10%
Bảo vệ chống gỡ lỗi Trung bình (phát hiện DevTools) Kiểm tra một lần +5%
VM / ảo hóa (trả phí) Rất cao Lớn (5–20 lần) +300–500%

Những gì việc làm rối mã không thể bảo vệ

  • Bí mật. Bất kỳ hằng số nào trong mã nguồn front-end đều có thể đọc được nếu có đủ thời gian. Khóa API, bí mật xác thực, logic định giá, đừng bao giờ trông cậy vào việc làm rối mã để giấu chúng. Hãy chuyển chúng sang phía máy chủ.
  • Thuật toán có đầu ra quan sát được. Nếu trình duyệt có thể chạy nó, kẻ tấn công với trình gỡ lỗi có thể quan sát mọi đầu vào và đầu ra. Làm rối mã chỉ làm chậm điều đó chứ không ngăn được.
  • Thu thập dữ liệu tự động quy mô lớn. Chống thu thập dữ liệu dựa vào phát hiện hành vi (dấu vân tay trình duyệt, giới hạn tần suất, CAPTCHA), chứ không dựa vào việc làm rối mã nguồn.

Khi nào việc làm rối mã đáng làm

  • Chống can thiệp trên các SDK nhúng (cấp phép, SDK quảng cáo, client trò chơi).
  • Nâng chi phí cho việc sao chép–dán một cách dễ dàng một triển khai cạnh tranh.
  • Khiến việc phân loại script tự động khó hơn đối với các trình thu thập dữ liệu diện rộng.

Khi nào việc này phản tác dụng

  • Bạn đã có sẵn một bộ đóng gói. Webpack + Terser ở chế độ production đã rút gọn và xáo trộn các biến cục bộ. Thêm một lượt làm rối mã nữa mang lại rất ít giá trị và làm phình kích thước gói.
  • Bạn đang tối ưu cho First Paint / Core Web Vitals. Làm rối mã quyết liệt khiến gói tăng gấp ba, gây hại cho FCP và LCP.
  • Bạn phải gỡ lỗi trên production. Làm rối mã nặng khiến stack trace của Sentry gần như vô dụng nếu không có source map tương ứng, mà phát hành source map thì lại vô hiệu hóa việc làm rối mã.

Những sai lầm thường gặp

  • Coi việc làm rối mã tương đương với mã hóa. Không phải vậy, nó chỉ là một rào cản làm chậm.
  • Phát hành source map cùng với gói đã làm rối lên production. Điều này vô hiệu hóa hoàn toàn việc làm rối mã.
  • Làm rối các thư viện bên thứ ba mà bạn đã tải từ CDN. Bạn chịu thiệt về kích thước mà chẳng được lợi gì.

Câu hỏi thường gặp

Không. Làm rối mã là một rào cản làm chậm, không phải một ổ khóa. Một người phân tích quyết tâm với trình gỡ lỗi sẽ khôi phục được logic. Nó nâng chi phí đủ để ngăn việc xem xét qua loa và phần lớn trình thu thập dữ liệu tự động, nhưng đó không phải là bảo mật.

Nếu bạn truy cập thuộc tính một cách động (obj["field_name"], Object.keys(obj)), hoặc phụ thuộc vào tên hàm/lớp cụ thể cho trang chủ, hãy thêm chúng vào danh sách dành riêng. Nếu không, việc đổi tên thuộc tính có thể làm hỏng các tích hợp bên ngoài.

Hãy giữ lại mã nguồn gốc. Trình làm rối mã là một phép biến đổi một chiều; bạn không thể khôi phục chính xác bản gốc từ đầu ra đã làm rối, chỉ có thể thu được một bản gần đúng đọc được.

Làm rối nhẹ thêm khoảng 10–30%. Làm phẳng luồng điều khiển cộng với mảng chuỗi thêm 50–150%. Các thiết lập nặng nhất có thể làm kích thước tăng gấp ba. Hãy kiểm tra bộ đếm kích thước đầu ra trước khi phát hành.

Công cụ liên quan

Bảng tham chiếu ASCII

Bảng ASCII đầy đủ từ 0 đến 127 với giá trị thập phân, thập lục phân, bát phân, nhị phân và ký hiệu tham chiếu ký tự số HTML, gồm NUL, LF và DEL.

Tham chiếu ký tự HTML

Danh sách có thể tìm kiếm các thực thể HTML, mã tên và mã số tương ứng của chúng, cùng chức năng sao chép chỉ với một cú nhấp cho các ký tự đặc biệt và biểu tượng.

Bảng tham khảo phím tắt

Tìm phím tắt mặc định theo tài liệu của VS Code, Chrome và Bash dùng GNU Readline trên macOS, Windows và Linux.

Bảng tra cứu nhanh Markdown

Tài liệu Markdown thực dụng với bản xem trước thực tế và ví dụ có thể sao chép cho tiêu đề, danh sách, bảng, mã, liên kết, hình ảnh và cú pháp GFM.

Trình định dạng HTML

Định dạng HTML cục bộ trong trình duyệt với thụt lề hai hoặc bốn khoảng trắng. HTML không được tải lên hoặc xác thực.

Công cụ xác thực số điện thoại

Kiểm tra cấu trúc số theo quốc gia và xem khu vực, loại số cùng các định dạng E.164, quốc tế, quốc gia và RFC 3966.

Công cụ này có phiên bản bằng các ngôn ngữ khác