我遇到过一些专门针对iOS和Android的解决方案,以防止屏幕捕获和截图。但是我如何在react native中禁用屏幕捕获?
i7uq4tfw1#
内部/android/app/src/main/java/com/{Project_Name}/MainActivity.java您可以添加以下行。通过setFlag FLAG_SECURE阻止截屏,使用以下代码作为示例:
/android/app/src/main/java/com/{Project_Name}/MainActivity.java
FLAG_SECURE
import android.os.Bundle; import android.view.WindowManager; ... @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); getWindow().setFlags(WindowManager.LayoutParams.FLAG_SECURE, WindowManager.LayoutParams.FLAG_SECURE); }
稍后当您要删除安全标志时
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_SECURE);
在AppDelegate.m中覆盖屏幕,举个例子:
AppDelegate.m
- (void)applicationWillResignActive:(UIApplication *)application { // fill screen with our own colour UIView *colourView = [[UIView alloc]initWithFrame:self.window.frame]; colourView.backgroundColor = [UIColor whiteColor]; colourView.tag = 1234; colourView.alpha = 0; [self.window addSubview:colourView]; [self.window bringSubviewToFront:colourView]; // fade in the view [UIView animateWithDuration:0.5 animations:^{ colourView.alpha = 1; }]; } - (void)applicationDidBecomeActive:(UIApplication *)application { // grab a reference to our coloured view UIView *colourView = [self.window viewWithTag:1234]; // fade away colour view from main view [UIView animateWithDuration:0.5 animations:^{ colourView.alpha = 0; } completion:^(BOOL finished) { // remove when finished fading [colourView removeFromSuperview]; }]; }
mdfafbf12#
因此,在React Native平台上构建iOS端的工作很少。所以请耐心地阅读下面的方法。我正在使用react-native-video包播放媒体。我的要求是显示微调,如果用户有屏幕录制启用。1.从https://developer.apple.com/documentation/uikit/uiscreen/2921651-captured?language=objc中我了解到captured属性设置为YES。我在AppDelegate.m中的didFinishLaunchingWithOptions方法下添加了观察者。[[UIScreen mainScreen] addObserver:self forKeyPath:@"captured" options:NSKeyValueObservingOptionNew context:nil];1.由于RN允许与本地模块通信,因此我决定添加网桥,以便在capture标志设置为YES时通知。我创建了两个文件ScreenRecordingNotification.h和.m.h
captured
didFinishLaunchingWithOptions
[[UIScreen mainScreen] addObserver:self forKeyPath:@"captured" options:NSKeyValueObservingOptionNew context:nil];
capture
#import <React/RCTBridgeModule.h> #import <React/RCTEventEmitter.h> #ifndef ScreenCaptureNotification_h #define ScreenCaptureNotification_h @interface ScreenCaptureNotification : RCTEventEmitter <RCTBridgeModule> -(void) isScreenCaptureEnabled:(BOOL)isCaptured; @end #endif /* ScreenCaptureNotification_h */
.m看起来像
#import <Foundation/Foundation.h> #import "ScreenCaptureNotification.h" #import <React/RCTLog.h> @implementation ScreenCaptureNotification + (id)allocWithZone:(NSZone *)zone { static ScreenCaptureNotification *sharedInstance = nil; static dispatch_once_t onceToken; dispatch_once(&onceToken, ^{ sharedInstance = [super allocWithZone:zone]; }); return sharedInstance; } RCT_EXPORT_MODULE(); - (NSArray<NSString *> *)supportedEvents { return @[ @"isScreenCaptureEnabled"]; } -(void) isScreenCaptureEnabled:(BOOL)isCaptured { [self sendEventWithName:@"isScreenCaptureEnabled" body:@{@"value": @(isCaptured)}]; } @end
1.在AppDelegate中导入#import "ScreenCaptureNotification.h"并添加以下方法。
#import "ScreenCaptureNotification.h"
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context { if ([keyPath isEqualToString:@"captured"]){ NSLog(@"Screen Capture is Enabled"); RCTLog(@"Screen Capture is Enabled"); if (@available(iOS 11.0, *)) { ScreenCaptureNotification *manager = [ScreenCaptureNotification allocWithZone: nil]; [manager isScreenCaptureEnabled:UIScreen.mainScreen.isCaptured]; } } }
在didFinishLaunchingWithOptions中添加[[UIScreen mainScreen] addObserver:self forKeyPath:@"captured" options:NSKeyValueObservingOptionNew context:nil];。这是iOS端的变化。1.现在您需要在.js文件中添加监听器,以便iOS发送通知。一旦你收到通知,你就可以决定如何处理它。大致看起来像下面。
addListener() { let bridge = new NativeEventEmitter(NativeModules.ScreenCaptureNotification); this.screenCaptureEnabled = bridge.addListener("isScreenCaptureEnabled",res => { this.setState({ screenCapture: true }) }) }
和
render() { if (this.state.screenCapture) { //Show spinner return <Spinner /> } return ( <Vido uri ... /> ) }
我愿意接受对这篇文章进行修改的建议。如果这篇文章对你有帮助的话,别忘了投赞成票。
xoefb8l83#
阻止截屏
通过setFlag secure防止捕获屏幕
getWindow().setFlags(WindowManager.LayoutParams.FLAG_SECURE, WindowManager.LayoutParams.FLAG_SECURE);
如果您想删除安全标志
gg58donl4#
在Android/android/app/src/main/java/com/{Project_Name}/MainActivity.java写一些导入语句
import android.os.Bundle; import android.view.WindowManager;
通过在MainActivity类中的代码下方使用setFlag安全设置来防止捕获屏幕
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); getWindow().setFlags(WindowManager.LayoutParams.FLAG_SECURE, WindowManager.LayoutParams.FLAG_SECURE); }
6tdlim6h5#
1.在appDelegate.m下面添加这行 didFinishLaunchingWithOptions 当用户正在屏幕记录退出应用程序时,如果屏幕记录在应用程序上未打开仅适用于ios react-native
0lvr5msh6#
screen shot false in your app把这个完整的代码放在你的Android/app/src/main/javacom/mainactivity/java
package com.Yourprojectname; import com.facebook.react.ReactActivity; import android.os.Bundle; import android.view.WindowManager; public class MainActivity extends ReactActivity { @Override protected String getMainComponentName() { return "YOUR PROJECT NAME"; } @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); getWindow().setFlags( WindowManager.LayoutParams.FLAG_SECURE, WindowManager.LayoutParams.FLAG_SECURE );}}
svdrlsy47#
你可以使用我自己定制的react-native-screenguard库。yarn add react-native-screenguardnpm i --save react-native-screenguard指南:https://github.com/gbumps/react-native-screenguard/blob/master/README.md
react-native-screenguard
yarn add react-native-screenguard
npm i --save react-native-screenguard
7条答案
按热度按时间i7uq4tfw1#
安卓
内部
/android/app/src/main/java/com/{Project_Name}/MainActivity.java
您可以添加以下行。通过setFlag
FLAG_SECURE
阻止截屏,使用以下代码作为示例:稍后当您要删除安全标志时
iOS
在
AppDelegate.m
中覆盖屏幕,举个例子:mdfafbf12#
因此,在React Native平台上构建iOS端的工作很少。所以请耐心地阅读下面的方法。
我正在使用react-native-video包播放媒体。我的要求是显示微调,如果用户有屏幕录制启用。
1.从https://developer.apple.com/documentation/uikit/uiscreen/2921651-captured?language=objc中我了解到
captured
属性设置为YES。我在AppDelegate.m中的didFinishLaunchingWithOptions
方法下添加了观察者。[[UIScreen mainScreen] addObserver:self forKeyPath:@"captured" options:NSKeyValueObservingOptionNew context:nil];
1.由于RN允许与本地模块通信,因此我决定添加网桥,以便在
capture
标志设置为YES时通知。我创建了两个文件ScreenRecordingNotification.h和.m
.h
.m看起来像
1.在AppDelegate中导入
#import "ScreenCaptureNotification.h"
并添加以下方法。在
didFinishLaunchingWithOptions
中添加[[UIScreen mainScreen] addObserver:self forKeyPath:@"captured" options:NSKeyValueObservingOptionNew context:nil];
。这是iOS端的变化。1.现在您需要在.js文件中添加监听器,以便iOS发送通知。一旦你收到通知,你就可以决定如何处理它。大致看起来像下面。
和
我愿意接受对这篇文章进行修改的建议。如果这篇文章对你有帮助的话,别忘了投赞成票。
xoefb8l83#
阻止截屏
通过setFlag secure防止捕获屏幕
如果您想删除安全标志
gg58donl4#
在Android
/android/app/src/main/java/com/{Project_Name}/MainActivity.java
写一些导入语句
通过在MainActivity类中的代码下方使用setFlag安全设置来防止捕获屏幕
6tdlim6h5#
1.在appDelegate.m下面添加这行 didFinishLaunchingWithOptions 当用户正在屏幕记录退出应用程序时,如果屏幕记录在应用程序上未打开仅适用于ios react-native
0lvr5msh6#
screen shot false in your app把这个完整的代码放在你的
Android/app/src/main/javacom/mainactivity/java
svdrlsy47#
你可以使用我自己定制的
react-native-screenguard
库。yarn add react-native-screenguard
npm i --save react-native-screenguard
指南:
https://github.com/gbumps/react-native-screenguard/blob/master/README.md