如何在JS中实现一个用户禁止保存图片功能-创新互联

今天就跟大家聊聊有关如何在JS中实现一个用户禁止保存图片功能，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

创新互联是一家专注于网站建设、网站设计与策划设计,宜州网站建设哪家好?创新互联做网站,专注于网站建设十年,网设计领域的专业建站公司;建站业务涵盖:宜州等地区。宜州做网站价格咨询:13518219792

场景

在业务需求中不希望用户保存图片，因为是一些供内部使用的图片。

思路

• 添加事件禁止选择、拖拽、右键（简单的禁止用户保存图片，但无法阻止用户打开控制台查看，或是直接抓包）
• 将之转换为 canvas（让浏览器认为不是图片以此禁止用户对之进行图片的操作，但无法阻止抓包）
• 禁止用户使用控制台查看源码（阻止浏览器打开控制台，但无法阻止抓包）
• 传输图片使用自定义格式（可以阻止抓包，但需要后台配合）

注：以下内容使用 react+ts 实现

添加事件禁止选择、拖拽、右键

简而言之，这是一种简单有效的方式，能够在用户不打开控制台的情况下阻止用户保存图片。

export function preventDefaultListener(e: any) {
 e.preventDefault()
}

;

文章标题：如何在JS中实现一个用户禁止保存图片功能-创新互联
文章位置：http://scjbc.cn/article/jgpsc.html