Is it possible for the webpage to detect that it is accessed from the webview app?

user_9375533 0
Viewed 1958

Let's say I have a website that contains only 2 pages.

  1. http://example.com
  2. http://example.com/webview.html

Then I created a webview react native application it can be simple as this:

App.js

import React, { Component } from 'react';
import { WebView } from 'react-native';

export default class MyWeb extends Component {
  render() {
    return (
      <WebView
        source={{uri: 'http://example.com/webview.html'}}
        style={{marginTop: 20}}
      />
    );
  }
}

Now my question is: Is it possible for the webpage to detect that it is accessed from the webview app?

Let's say I have a condition in the webview.html file like:

if ( webview ) {
  return 'webview';
}
else {
  return 'normal browser'
}

Maybe something like inserting a javascript, maybe a variable from the webview to webpage? Then I can use that variable to check its existence then if it exists then it is webview, else it is not.

I know javascript can detect the browser used, screen resolution, os, and etc. So is this possible?

The app has a target OS of Android and iOS.

react-native webview android javascript ios
1 Answers

Try use the navigator.userAgent.

You can set custom UserAgent in your target application's webview.

For iOS: 

 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    UIWebView *webView = [[UIWebView alloc] initWithFrame:CGRectZero];
    NSString *userAgent = [webView stringByEvaluatingJavaScriptFromString:@"navigator.userAgent"];
    NSString *newUserAgent = [userAgent stringByAppendingString:@" Your Custom Key"];//your custom key
    NSDictionary *dictionary = [NSDictionary dictionaryWithObjectsAndKeys:newUserAgent, @"UserAgent", nil];
    [[NSUserDefaults standardUserDefaults] registerDefaults:dictionary];
}

For Android: 

WebSettings settings = webview.getSettings();

String ua = webview.getSettings().getUserAgentString();  
webview.getSettings().setUserAgentString(ua+"; Your Custom Key");

In h5 , you can fetch the ua and determine the target

user_53414890
Related