簡體   English   中英

Javascript - 從 Chrome 控制台隱藏源文件

[英]Javascript - Hide source files from chrome console

我自己對 Javascript 開發有點陌生。 最近,我一直在使用 React 和 ExpressJS 開發一個 Web 應用程序。 Express 將交付前端 React 頁面的靜態捆綁(使用 Parcel)文件。 代碼組織是這樣的:

> dist\    
>     [static files here] 
> node_modules \ 
> src \
>     client\
>        compontents\       
>        index.html
>        index.js
>     server\
>       models\
>       routes\
>       index.js

構建過程運行良好,我得到了一個完美運行的網絡應用程序。 問題是谷歌瀏覽器的源代碼開發工具為客戶端公開了我的所有源代碼。 暴露的源代碼文件

一些谷歌搜索使我想到了諸如黑盒和混淆之類的術語。 但我很難理解他們。 對它們的一些解釋和關於隱藏源文件的建議會有所幫助。 謝謝!

終於得到了。 我必須在包裹構建命令中包含 --no-source-maps

parcel build ./src/client/index.html --no-source-maps

基本上,網絡瀏覽器需要下載您的 .js 文件才能工作。 你無法阻止這一點。 但是,在已發布的 react 項目中,js 文件被縮小了,因此您無需擔心暴露源代碼。

您可以通過使用HideJS 之類的服務來創建您網站的交互式流,而不是實際編譯代碼。

代碼永遠不會到達他們的計算機,因此不可能看到它。

如果您不設置以下選項,您的 React 源代碼(未最小化)將可見。 您需要關閉 GENERATE_SOURCEMAP 標志。

在 package.json 中

"scripts": { ... "build": "GENERATE_SOURCEMAP=false react-scripts build", ... }

完全阻止您網站上的檢查元素是不可能的。 但是您可以阻止一些流行的訪問方式。

1.在瀏覽器上使用F12鍵:

This can be blocked using javascript key event listener. Use the below script to do accomplish it.

$(document).keydown(function(e){
    if(e.which === 123){ 
       return false; 
    } 
});

2. 右鍵的使用

You can block this using javascript or with just your html

<html oncontextmenu="return false">
</html>
or

$(document).bind("contextmenu",function(e) { 
    e.preventDefault();

});

3. 其他涉及Ctrl鍵的快捷鍵的使用

將此代碼段包含在 body 元素中。

oncontextmenu="返回假" onkeydown="返回假;" onmousedown="返回假;"

4. 通過在打開檢查器時臨時移除 DOM

下面的代碼片段的作用是檢測調試器何時打開,刪除代碼並將代碼存儲在變量中,當調試器關閉時,它返回它。

var currentHtmlContent;

var element = new Image();

var elementWithHiddenContent = document.querySelector("#element-to-hide");

var innerHtml = elementWithHiddenContent.innerHTML;   


element.__defineGetter__("id", function() {

    currentHtmlContent= "";

});

setInterval(function() {

    currentHtmlContent= innerHtml;

    console.log(element);

    console.clear(); 

    elementWithHiddenContent.innerHTML = currentHtmlContent;

}, 1000);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM