运城市住房和城乡建设部网站网站免费高清素材软件
需求:在前端开发过程中,会遇到生产坏境不让用户打开控制台,防止不法分子虚假信息操作。
废话不多说一共两步,添加我们的js方法,和在全局使用这个方法。
第一步:添加我的js文件:
//禁用开发者工具
export default async () => {if ((localStorage.getItem('devTools') && localStorage.getItem('devTools') === 1) || localStorage.getItem('devTools') === '1') {return;}document.onkeydown = () => {//禁用F12if (window.event && window.event.keyCode === 123) {return false;//禁用ctrl+shift+i,} else if (window.event.ctrlKey && window.event.shiftKey && window.event.keyCode === 73) {return false;//屏蔽Shift+F10} else if (window.event.shiftKey && window.event.keyCode === 121) {return false;}};window.oncontextmenu = (e) => {e.preventDefault();};setInterval(function () {check();}, 1000);var check = function () {function doCheck(a) {if (('' + a / a)['length'] !== 1 || a % 20 === 0) {(function () {})['constructor']('debugger')();} else {(function () {})['constructor']('debugger')();}doCheck(++a);}try {doCheck(0);} catch (err) {console.error(err);}};check();
};
第二步:在全局使用,以vue项目为例,在main.js中引用使用
import disableDeveloperTools from '你存放js文件的路径';app.use(store);
app.use(router);//判断生产环境使用
if (import.meta.env.MODE === 'production') {disableDeveloperTools();
}app.mount('#app');