Add a better way to set / override the User Agent #4

EddyVerbruggen · Jan 2, 2018 · 1386cb7 · 1386cb7
1 parent 51cda32
commit 1386cb7
Show file tree

Hide file tree

Showing 7 changed files with 94 additions and 57 deletions.
diff --git a/README.md b/README.md
@@ -80,5 +80,22 @@ export function webViewLoaded(args: observable.EventData) {
 }
 ```
 
+### `setUserAgent`
+You can set this as a header, but it seems to work better setting it in a different way,
+so use this function if you want to override the user agent in your webview.
+
+Note that on iOS this will override the user agent header in all of your webviews.
+
+```typescript
+import { WebViewUtils } from 'nativescript-webview-utils';
+import { WebView } from 'tns-core-modules/ui/web-view';
+import * as observable from 'tns-core-modules/data/observable';
+
+export function webViewForUserAgentLoaded(args: observable.EventData) {
+  const wv: WebView = <WebView>args.object;
+  WebViewUtils.setUserAgent(wv, "My Super Duper User-Agent!");
+}
+```
+
 ## Credits
 Quite some code was borrowed from [this repo](https://github.com/okmttdhr/nativescript-webview-custom-header).
diff --git a/demo/app/main-page.ts b/demo/app/main-page.ts
@@ -23,4 +23,9 @@ export function webViewLoaded(args: observable.EventData) {
   headers.set("Foo", "Bar :P");
   headers.set("X-Custom-Header", "Set at " + new Date().toTimeString());
   WebViewUtils.addHeaders(wv, headers);
+}
+
+export function webViewForUserAgentLoaded(args: observable.EventData) {
+  const wv: WebView = <WebView>args.object;
+  WebViewUtils.setUserAgent(wv, "My Super Duper User-Agent!");
 }
diff --git a/demo/app/main-page.xml b/demo/app/main-page.xml
@@ -8,6 +8,9 @@
       <Label text="And now with custom headers:" class="t-20 text-center c-black" textWrap="true"/>
       <WebView id="webviewWithCustomHeaders" loaded="webViewLoaded" height="400" src="https://httpbin.org/headers"/>
 
+      <Label text="Set custom User Agent (on iOS this affects ALL webviews of your app)" class="t-20 text-center c-black" textWrap="true"/>
+      <WebView id="webViewForUserAgent" loaded="webViewForUserAgentLoaded" height="400" src="https://httpbin.org/headers"/>
+
     </StackLayout>
   </ScrollView>
 </Page>
diff --git a/src/index.d.ts b/src/index.d.ts
@@ -2,4 +2,5 @@ import { WebView } from "tns-core-modules/ui/web-view";
 
 export const WebViewUtils: {
   addHeaders: (wv: WebView, headers: Map<string, string>) => void;
+  setUserAgent: (wv: WebView, userAgent: string) => void;
 };
diff --git a/src/package.json b/src/package.json
@@ -1,59 +1,59 @@
 {
-    "name": "nativescript-webview-utils",
-    "version": "1.0.0",
-    "description": "Add custom headers to a NativeScript WebView. Perhaps more utils later.",
-    "main": "webview-utils",
-    "typings": "index.d.ts",
-    "nativescript": {
-        "platforms": {
-            "android": "3.0.0",
-            "ios": "3.0.0"
-        }
-    },
-    "scripts": {
-        "tsc": "tsc -skipLibCheck",
-        "build": "npm i && tsc",
-        "postclone": "npm i && node scripts/postclone.js && cd ../demo && npm i && cd ../src && npm run plugin.link",
-        "test.android": "npm i && npm run tsc && npm run tslint && cd ../demo && tns build android && tns test android --justlaunch",
-        "test.ios": "npm i && npm run tsc && npm run tslint && cd ../demo && tns build ios && tns test ios --justlaunch",
-        "tslint": "cd .. && tslint \"**/*.ts\" --config tslint.json --exclude \"**/node_modules/**\"",
-        "plugin.link": "npm link && cd ../demo && npm link nativescript-webview-utils && cd ../src",
-        "plugin.tscwatch": "npm run tsc -- -w",
-        "demo.ios": "npm i && npm run tsc && cd ../demo && tns run ios --syncAllFiles",
-        "demo.android": "npm i && npm run tsc && cd ../demo && tns run android --syncAllFiles",
-        "demo.reset": "cd ../demo && rimraf platforms",
-        "plugin.prepare": "npm run tsc && cd ../demo && tns plugin remove nativescript-webview-utils && tns plugin add ../src",
-        "clean": "cd ../demo && rimraf hooks node_modules platforms && cd ../src && rimraf node_modules && npm run plugin.link",
-        "ci.tslint": "npm i && tslint '**/*.ts' --config '../tslint.json' --exclude '**/node_modules/**'"
-    },
-    "keywords": [
-        "ecosystem:NativeScript",
-        "NativeScript",
-        "JavaScript",
-        "Android",
-        "iOS",
-        "WebView",
-        "Headers",
-        "WebView Headers"
-    ],
-    "author": {
-        "name": "Eddy Verbruggen",
-        "email": "eddyverbruggen@yourdomain.com"
-    },
-    "bugs": {
-        "url": "https://github.com/EddyVerbruggen/nativescript-webview-utils/issues"
-    },
-    "license": "Apache-2.0",
-    "homepage": "https://github.com/EddyVerbruggen/nativescript-webview-utils",
-    "readmeFilename": "README.md",
-    "devDependencies": {
-        "tns-core-modules": "^3.3.0",
-        "tns-platform-declarations": "^3.3.0",
-        "typescript": "~2.4.0",
-        "prompt": "^1.0.0",
-        "rimraf": "^2.5.0",
-        "tslint": "^5.0.0"
-    },
-    "dependencies": {},
-    "bootstrapper": "nativescript-plugin-seed"
+  "name": "nativescript-webview-utils",
+  "version": "1.1.0",
+  "description": "Add custom headers to a NativeScript WebView. Perhaps more utils later.",
+  "main": "webview-utils",
+  "typings": "index.d.ts",
+  "nativescript": {
+    "platforms": {
+      "android": "3.0.0",
+      "ios": "3.0.0"
+    }
+  },
+  "scripts": {
+    "tsc": "tsc -skipLibCheck",
+    "build": "npm i && tsc",
+    "postclone": "npm i && node scripts/postclone.js && cd ../demo && npm i && cd ../src && npm run plugin.link",
+    "test.android": "npm i && npm run tsc && npm run tslint && cd ../demo && tns build android && tns test android --justlaunch",
+    "test.ios": "npm i && npm run tsc && npm run tslint && cd ../demo && tns build ios && tns test ios --justlaunch",
+    "tslint": "cd .. && tslint \"**/*.ts\" --config tslint.json --exclude \"**/node_modules/**\"",
+    "plugin.link": "npm link && cd ../demo && npm link nativescript-webview-utils && cd ../src",
+    "plugin.tscwatch": "npm run tsc -- -w",
+    "demo.ios": "npm i && npm run tsc && cd ../demo && tns run ios",
+    "demo.android": "npm i && npm run tsc && cd ../demo && tns run android --syncAllFiles",
+    "demo.reset": "cd ../demo && rimraf platforms",
+    "plugin.prepare": "npm run tsc && cd ../demo && tns plugin remove nativescript-webview-utils && tns plugin add ../src",
+    "clean": "cd ../demo && rimraf hooks node_modules platforms && cd ../src && rimraf node_modules && npm run plugin.link",
+    "ci.tslint": "npm i && tslint '**/*.ts' --config '../tslint.json' --exclude '**/node_modules/**'"
+  },
+  "keywords": [
+    "ecosystem:NativeScript",
+    "NativeScript",
+    "JavaScript",
+    "Android",
+    "iOS",
+    "WebView",
+    "Headers",
+    "WebView Headers"
+  ],
+  "author": {
+    "name": "Eddy Verbruggen",
+    "email": "eddyverbruggen@yourdomain.com"
+  },
+  "bugs": {
+    "url": "https://github.com/EddyVerbruggen/nativescript-webview-utils/issues"
+  },
+  "license": "Apache-2.0",
+  "homepage": "https://github.com/EddyVerbruggen/nativescript-webview-utils",
+  "readmeFilename": "README.md",
+  "devDependencies": {
+    "tns-core-modules": "^3.3.0",
+    "tns-platform-declarations": "^3.3.0",
+    "typescript": "~2.4.0",
+    "prompt": "^1.0.0",
+    "rimraf": "^2.5.0",
+    "tslint": "^5.0.0"
+  },
+  "dependencies": {},
+  "bootstrapper": "nativescript-plugin-seed"
 }
diff --git a/src/webview-utils.android.ts b/src/webview-utils.android.ts
@@ -9,6 +9,10 @@ export class WebViewUtils extends android.webkit.WebViewClient {
   private _view: any;
   private _origClient: any; // WebViewClient
 
+  public static setUserAgent(wv: WebView, userAgent: string) {
+    wv.android.getSettings().setUserAgentString(userAgent);
+  }
+
   public static addHeaders(wv: WebView, headers: Map<string, string>) {
     WebViewUtils.headers = headers;
     // Wrap this in a timeout for Android, otherwise webview.android might not be initialized

diff --git a/src/webview-utils.ios.ts b/src/webview-utils.ios.ts
@@ -10,6 +10,12 @@ export class WebViewUtils extends NSObject implements UIWebViewDelegate {
   private _owner: WeakRef<WebView>;
   private _originalDelegate: any; // UIWebViewDelegateImpl
 
+  public static setUserAgent(wv: WebView, userAgent: string) {
+    // note that overrides the useragent for ALL webviews for the app, but that's prolly not a problem
+    NSUserDefaults.standardUserDefaults.registerDefaults(
+        NSDictionary.dictionaryWithObjectForKey(userAgent, "UserAgent"));
+  }
+
   public static addHeaders(wv: WebView, headers: Map<string, string>) {
     (<any>wv)._delegate = WebViewUtils.initWithOwner(new WeakRef(wv));
     WebViewUtils.headers = headers;
@@ -22,6 +28,7 @@ export class WebViewUtils extends NSObject implements UIWebViewDelegate {
     return delegate;
   }
 
+  // TODO this is prolly different for WKWebView
   // You can customize your http headers here.
   public webViewShouldStartLoadWithRequestNavigationType(webView: UIWebView, request: NSURLRequest, navigationType: number) {
     const urlString: string = request.URL.absoluteString;