CODEWITHSUNDEEP
javascriptandroidkotlinandroid-webview
Marc Rasmussen
Marc Rasmussen

Reputation: 20555

Android WebView of local website manipulating the URL

When using an Android WebView I am able to load in my custom web application using the view.loadUrl("https://example.com/assets/www/index.html") method.

Where the webpage is stored locally in my android assets

However there is a slight issue. This will set the URL of my page to http://example.com/assets/www/index.html. What I would like to do, is to load my content using a much simpler URL such as: http://example.com

However I can't seem to find a solution for this other than hosting my website remotely.

Here is my current Activity:

class MainActivity : AppCompatActivity() {
    private var myWebView: WebView? = null

    @SuppressLint("SetJavaScriptEnabled")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val assetLoader = WebViewAssetLoader.Builder()
            .setDomain("example.com")
            .addPathHandler("/assets/", WebViewAssetLoader.AssetsPathHandler(this))
            .addPathHandler("/build/", WebViewAssetLoader.AssetsPathHandler(this))
            .addPathHandler("/res/", WebViewAssetLoader.ResourcesPathHandler(this))
            .build()
        initiateWebView(findViewById(R.id.webv), assetLoader);
    }

    private fun initiateWebView(view: WebView, assetLoader: WebViewAssetLoader) {
        myWebView = view;

        view.webViewClient = LocalContentWebViewClient(assetLoader)
        view.settings?.javaScriptEnabled = true
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            WebView.setWebContentsDebuggingEnabled(true)
        }
        myWebView?.addJavascriptInterface(JsWebInterface(this), "androidApp")
        view.loadUrl("https://example.com/assets/www/index.html")

    }

    override fun onBackPressed() {
        if (myWebView?.canGoBack() == true) {
            myWebView?.goBack()
        } else {
            super.onBackPressed()
        }
    }

}

private class LocalContentWebViewClient(private val assetLoader: WebViewAssetLoader) :
    WebViewClientCompat() {
    private val jsEventHandler = com.example.minsundhedpoc.JSEventHandler();

    @RequiresApi(21)
    override fun shouldInterceptRequest(
        view: WebView,
        request: WebResourceRequest
    ): WebResourceResponse? {
        return assetLoader.shouldInterceptRequest(request.url)
    }

    override fun shouldOverrideUrlLoading(view: WebView, request: WebResourceRequest): Boolean {
        val url = view.url
        // Log.d("LOG","previous_url: " + url);
        return false
    }

    override fun onPageCommitVisible(view: WebView, url: String) {
        super.onPageCommitVisible(view, url)
        jsEventHandler.sendEvent(view, "myCustomEvent");

    }

    // to support API < 21
    override fun shouldInterceptRequest(
        view: WebView,
        url: String
    ): WebResourceResponse? {
        return assetLoader.shouldInterceptRequest(Uri.parse(url))
    }

}

Upvotes: 0

Views: 1585

Answers (2)

Hussien Fahmy
Hussien Fahmy

Reputation: 1285

Simple answer to your question. No you can't do that. of course there is will be work around such as VPN or tunneling

BUT think about it a minute. letting the user see a local website with a domain name ?

of course he will try to access it from the browser. and won't be able to do that.

And what if you want to update your website ? you will need to completely update the app. that's not practical.

Consider using a remote web hosting like firebase hosting it's for free and giving you 2 doamins (example.web.app) and (example.firebaseapp.com) and you can use any custom domain, there is a providers can give you a custom domain for free (strongly not recommend that as they can withdraw it any time) like freenome and for paid domain providers there is some cheap solutions like cosmotown and dynadot

Upvotes: 2

Pavlo Ostasha
Pavlo Ostasha

Reputation: 16699

It is not really an 'Android question' but rather a 'domain settings' one. And the answer to it is the Domain Masking technique.

For your case, it should be relatively easy to implement. Firstly check if you have the .htaccess file and if there is no one - you should create it and upload it to where your site code is stored.

The main line of code in that file should be

DirectoryIndex index.html

In your case, it should look something like

DirectoryIndex assets/www/index.html

If there is no such a line in your .htaccess file you should add it. This simple trick will redirect all the traffic from your plain domain URL name http://example.com to the index.html file you have specified there.

Moreover, you can specify a proper redirect in this file making all the users of your domain name access completely different domains. You can do it via

RewriteEngine On
RewriteRule ^something/?$ /something/else/

This way each time someone accesses: https://somedomain.com the actual content that will be displayed will be for: https://someotherdomain.com while the URL will remain unchanged.

Maybe some more work will be required based on your actual settings and code but this is a pretty good place to start fixing this issue.

If you want to run the site from the assets folder of your android app - this method won't work because you have no apache running inside your app on your phone.

I don't think it is even possible to achieve what you want with regular WebView and AssetManager - the assets folder is a files folder and to use the file from it you have to have a use file from it by its relative path.

I guess you can create some sort of routing/redirecting system over the AssetManager or over WebView - but it will be quite difficult to make. But you can start by looking at how it is implemented in Apache with .htaccess - it is open source.

Upvotes: -1

Related Questions