Merge pull request #11 from CoolBitX-Technology/fix/show_alert_to_ssl_error

🐛 [CW-25785] fix: add SSL error handling with user confirmation in WebViewClient

Author: a0979470582

README.md

@@ -1,82 +1,65 @@
 # React Native WebView
 
-![star this repo](https://img.shields.io/github/stars/react-native-webview/react-native-webview?style=flat-square)
-[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
-[![NPM Version](https://img.shields.io/npm/v/react-native-webview.svg?style=flat-square)](https://www.npmjs.com/package/react-native-webview)
-![Npm Downloads](https://img.shields.io/npm/dm/react-native-webview.svg)
+A forked version of React Native WebView customized for CoolBitX Technology projects.
 
-**React Native WebView** is a community-maintained WebView component for React Native. It is intended to be a replacement for the built-in WebView (which was [removed from core](https://github.com/react-native-community/discussions-and-proposals/pull/3)).
+## 🚀 Getting Started
 
-### Maintainers
+### Clone and Install
 
-**Many thanks to these companies** for providing us with time to work on open source.  
-Please note that maintainers spend a lot of free time working on this too so feel free to sponsor them, **it really makes a difference.**
+```bash
+# Clone the repository
+git clone https://github.com/CoolBitX-Technology/react-native-webview.git
 
-- [Thibault Malbranche](https://github.com/Titozzz) ([Twitter @titozzz](https://twitter.com/titozzz)) from [Brigad](https://www.brigad.co/en-gb/about-us)  
-[*Sponsor me* ❤️ !](https://github.com/sponsors/Titozzz)
+# Navigate to project directory
+cd react-native-webview
 
+# Install dependencies
+yarn install
+```
 
-Windows and macOS are managed by Microsoft, notably:
-- [Alexander Sklar](https://github.com/asklar) ([Twitter @alexsklar](https://twitter.com/alexsklar)) from [React Native for Windows](https://microsoft.github.io/react-native-windows/)
-- [Chiara Mooney](https://github.com/chiaramooney) from [React Native for Windows @ Microsoft](https://microsoft.github.io/react-native-windows/)
-
-Shout-out to [Jamon Holmgren](https://github.com/jamonholmgren) from [Infinite Red](https://infinite.red) for helping a lot with the repo when he had more available time.
-
-### Disclaimer
-
-Maintaining WebView is very complex because it is often used for many different use cases (rendering SVGs, PDFs, login flows, and much more). We also support many platforms and both architectures of react-native.
-
-Since WebView was extracted from the React Native core, nearly 500 pull requests have been merged.  
-Considering that we have limited time, issues will mostly serve as a discussion place for the community, while **we will prioritize reviewing and merging pull requests.** 
-
-### Platform compatibility
-
-This project is compatible with **iOS**,  **Android**, **Windows** and **macOS**.  
-This project supports both **the old** (paper) **and the new architecture** (fabric).  
-This project is compatible with [expo](https://docs.expo.dev/versions/latest/sdk/webview/).
-
-### Getting Started
-
-Read our [Getting Started Guide](docs/Getting-Started.md). If any step seems unclear, please create a pull request.
+### Build for Android
 
-### Versioning
+```bash
+# Run Android example app
+yarn run android
+```
 
-This project follows [semantic versioning](https://semver.org/). We do not hesitate to release breaking changes but they will be in a major version.
+> **Note**: Once the build is complete, the example app will automatically open on your connected Android device or emulator.
 
-### Usage
+## 📦 Publishing
 
-Import the `WebView` component from `react-native-webview` and use it like so:
+### 1. Update Version
 
-```tsx
-import React, { Component } from 'react';
-import { StyleSheet, Text, View } from 'react-native';
-import { WebView } from 'react-native-webview';
+Update the version in `package.json`:
 
-// ...
-const MyWebComponent = () => {
-  return <WebView source={{ uri: 'https://reactnative.dev/' }} style={{ flex: 1 }} />;
+```json
+{
+  "version": "13.13.4-cbx.6"
 }
 ```
 
-For more, read the [API Reference](./docs/Reference.md) and [Guide](./docs/Guide.md). If you're interested in contributing, check out the [Contributing Guide](./docs/Contributing.md).
+**Example**: `13.13.4-cbx.5` → `13.13.4-cbx.6`
+
+### 2. Publish to NPM
 
-### Common issues
+```bash
+yarn run publish:npm
+```
 
-- If you're getting `Invariant Violation: Native component for "RNCWebView does not exist"` it likely means you forgot to run `react-native link` or there was some error with the linking process
-- If you encounter a build error during the task `:app:mergeDexRelease`, you need to enable multidex support in `android/app/build.gradle` as discussed in [this issue](https://github.com/react-native-webview/react-native-webview/issues/1344#issuecomment-650544648)
+When prompted, enter the new version (e.g., `13.13.4-cbx.6`).
 
-#### Contributing
+> **Note**: Two-factor authentication is required for NPM publishing.
 
-Contributions are welcome, see [Contributing.md](https://github.com/react-native-webview/react-native-webview/blob/master/docs/Contributing.md)
+### 3. Verify Publication
 
-### License
+After successful publication, verify the new version at:
+📍 [https://www.npmjs.com/package/@coolwallet-app/react-native-webview](https://www.npmjs.com/package/@coolwallet-app/react-native-webview)
 
-MIT
+## 🔗 Links
 
-### Translations
+- **NPM Package**: [@coolwallet-app/react-native-webview](https://www.npmjs.com/package/@coolwallet-app/react-native-webview)
+- **Original Repository**: [react-native-webview/react-native-webview](https://github.com/react-native-webview/react-native-webview)
 
-This readme is available in:
+## 📄 License
 
-- [Brazilian portuguese](docs/README.portuguese.md)
-- [French](docs/README.french.md)
-- [Italian](docs/README.italian.md)
+This project maintains the same license as the original react-native-webview project.

android/src/main/java/com/reactnativecommunity/webview/RNCWebViewClient.java

@@ -14,6 +14,7 @@
 import android.webkit.WebResourceResponse;
 import android.webkit.WebView;
 import android.webkit.WebViewClient;
+import android.app.AlertDialog;
 
 import androidx.annotation.Nullable;
 import androidx.annotation.RequiresApi;
@@ -38,6 +39,8 @@
 import java.util.Objects;
 import java.util.concurrent.atomic.AtomicReference;
 
+import java.net.URL;
+
 public class RNCWebViewClient extends WebViewClient {
     private static String TAG = "RNCWebViewClient";
     protected static final int SHOULD_OVERRIDE_URL_LOADING_TIMEOUT = 250;
@@ -181,12 +184,12 @@ public void onReceivedSslError(final WebView webView, final SslErrorHandler hand
         String topWindowUrl = webView.getUrl();
         String failingUrl = error.getUrl();
 
-        // Cancel request after obtaining top-level URL.
-        // If request is cancelled before obtaining top-level URL, undesired behavior may occur.
-        // Undesired behavior: Return value of WebView.getUrl() may be the current URL instead of the failing URL.
-        handler.cancel();
-
         if (!topWindowUrl.equalsIgnoreCase(failingUrl)) {
+            // Cancel request after obtaining top-level URL.
+            // If request is cancelled before obtaining top-level URL, undesired behavior may occur.
+            // Undesired behavior: Return value of WebView.getUrl() may be the current URL instead of the failing URL.
+            handler.cancel();
+
             // If error is not due to top-level navigation, then do not call onReceivedError()
             Log.w(TAG, "Resource blocked from loading due to SSL error. Blocked URL: "+failingUrl);
             return;
@@ -223,12 +226,25 @@ public void onReceivedSslError(final WebView webView, final SslErrorHandler hand
 
         description = descriptionPrefix + description;
 
-        this.onReceivedError(
-                webView,
-                code,
-                description,
-                failingUrl
-        );
+        // --- Show an AlertDialog to let the user choose whether to proceed ---
+        final int finalCode = code;
+        final String finalDescription = description;
+        final String finalMessage = "Attackers may attempt to steal your information from " + getDomainFromUrl(failingUrl) + " (e.g., passwords, messages, or credit card details)."
+            + "\n\nThis could be due to a misconfiguration or an intercepted connection. Continuing is unsafe."
+            + "\n\n" + finalDescription;
+        AlertDialog.Builder builder = new AlertDialog.Builder(webView.getContext());
+        builder.setTitle("⚠️ Your connection is not private");
+        builder.setMessage(finalMessage);
+        builder.setCancelable(false);
+        builder.setPositiveButton("Cancel", (dialog, which) -> {
+            handler.cancel(); // Cancel the request
+            // Only call onReceivedError here since this represents an actual load failure
+            this.onReceivedError(webView, finalCode, finalDescription, failingUrl);
+        });
+        builder.setNegativeButton("Continue", (dialog, which) -> {
+            handler.proceed(); // Proceed with loading
+        });
+        builder.show();
     }
 
     @Override
@@ -338,4 +354,14 @@ protected WritableMap createWebViewEvent(WebView webView, String url) {
     public void setProgressChangedFilter(RNCWebView.ProgressChangedFilter filter) {
         progressChangedFilter = filter;
     }
+
+    private String getDomainFromUrl(String urlString) {
+        try {
+            URL url = new URL(urlString);
+            return url.getHost(); // 取得 domain，例如 "example.com"
+        } catch (Exception e) {
+            e.printStackTrace();
+            return urlString; // 如果解析失敗就回原 URL
+        }
+    }
 }

package.json

@@ -10,7 +10,7 @@
     "Thibault Malbranche <[email protected]>"
   ],
   "license": "MIT",
-  "version": "13.13.4-cbx.5",
+  "version": "13.13.4-cbx.7",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"