Android Implementation Guide
In Android Studio, go to your
manifests/AndroidManifest.xmlfile and add the following:
<uses-permission android:name="android.permission.INTERNET"/>This allows the WebView to access the internet within the app.
If you allow your customers to submit attachments through your ParqEx ticket form using the "Add File" button, you also need to add the following to your AndroidManifest file:
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>In your
layout/activity_main.xmlfile add the following:
<WebView
android:id="@+id/my_web_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>In your
MainActivity.ktfile add the following:
package com.example.myapplication
import android.content.pm.ApplicationInfo
import android.os.Build
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.webkit.JavascriptInterface
import android.webkit.WebView
import android.webkit.WebViewClient
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
if (0 != (applicationInfo.flags and
ApplicationInfo.FLAG_DEBUGGABLE)) {
WebView.setWebContentsDebuggingEnabled(true)
}
}
my_web_view.settings.javaScriptEnabled = true
my_web_view.settings.domStorageEnabled = true
my_web_view.settings.databaseEnabled = true
my_web_view.webViewClient = object : WebViewClient() {
}
my_web_view.loadUrl(BASE_URL)
}
companion object {
private val BASE_URL = "<YOUR WEB TICKET SUBMISSION URL WITH PARQEX>"
}
}This is the basic code for opening your main ParqEx page (which should auto-launch ParqEx) in a webview. If ParqEx is not installed on your main page or does not auto-launch, contact your ParqEx Sales Engineer or Solutions Engineer or ParqEx support. Note: to customize the behavior of the webview in various ways, please consult the documentation.
Navigating back to ParqEx after opening a link to a KB article
Users have the ability to see the original KB articles that contain the solutions ParqEx returns by clicking on the "Read Article" link underneath each solution. On desktop, these links open in a new browser tab. On mobile, if you follow this guide, those links will open in the same webview. However, in this scenario, the user needs a way to navigate back to ParqEx. Add this code to enable the device Back button to trigger the "Back" navigation function in the webview:
Passing data to the webview
In certain situations, it is necessary to pass data to ParqEx running in the webview, e.g. to specify which language the app is using so ParqEx can be properly localized, or metadata (like mobile platform, app version, user ID, etc.). This can easily be accomplished by setting JS variables on the webpage when launching the webview. Put all your variables in the window.parqexConfig object. If you want the data to be passed directly as certain custom fields, please use the custom field ID as the variable name, as below:
Getting data from the webview
To facilitate this, your native app needs to find out from the webview whether this native flow needs to launch after the webview dismisses itself (i.e. if the user took an action that needs to be handled in the native app). Your native app also needs to get the context & information that the user selected/entered/provided at the beginning of the ParqEx flow, so they don't have to re-type their information. Both of these things can be accomplished with the following code.
Define a callback function to receive the user's original request:
Make this callback available to the webview:
Inject the handler onto the webpage:
Make sure you use the exact variable path: window.parqex.native.androidSupportOptionHandler.handle because that is what ParqEx will call when a native app option is clicked by the user in the ParqEx webview.
Clean up: Be sure to clean up the handler as follows:
(Optional) Enable webview console logs for debugging If you want to be able to see the webview browser log messages in your Android Studio for debugging purposes, do this:
Now your
MainActivity.ktshould look like this:
Closing the webview when the user is done with the ParqEx app
When a user is done using the ParqEx app, they may navigate back to the native app by using the menu, clicking on a back button or the home icon. If they click on any option to end the ParqEx app experience, the webview needs to pass control back to the native app. This happens through another callback function which the ParqEx app/modal calls. Use the following code to handle that callback:
Injecting multiple JavaScript functions
In order to inject multiple JavaScript functions into the Webview, like handling access options, enter and exit simultaneously, you would set up your injectJavaScriptFunction() like this:
Allowing users to upload photos, documents, and files
To allow the users to upload photos, documents, and files from their local device to the ParqEx app, you will need to add the following code:
Intercept URL requests from within a webview
There are many options to intercept URL's within a Webview on Android, each one depends on the scope and the requirements that you have.
Option 1: Override URL loading
Give the host application a chance to take control when a URL is about to be loaded in the current WebView. If a WebViewClient is not provided, by default WebView will ask Activity Manager to choose the proper handler for the URL. If a WebViewClient is provided, returning true causes the current WebView to abort loading the URL, while returning false causes the WebView to continue loading the URL as usual.
For API<24 please use
This option has the next limitations:
It does not catch POST request.
It is not triggered on any resources loaded inside the page. i.e. images, scripts, etc.
It is not triggered on any HTTP request made by JavaScript on the page.
For more information about this method please refer to the documentation
Option 2: Redirect resources loading
Notify the host application that the WebView will load the resource specified by the given url.
onLoadResource providers similar functionality to shouldOverrideUrlLoading. ButonLoadResource will be called for any resources (images, scripts, etc) loaded on the current page including the page itself.
You must put an exit condition on the handling logic since this function will be triggered on loadUrl(newUrl). For example:
This option has the next limitations:
It is not triggered on any HTTP request made by JavaScript on the page. For more information please refer to the documentation.
Option 3: Handle all requests
Notify the host application of a resource request and allow the application to return the data. If the return value is null, the WebView will continue to load the resource as usual. Otherwise, the return response and data will be used.
This callback is invoked for a variety of URL schemes (e.g., http(s):, data:, file:, etc.), not only those schemes which send requests over the network. This is not called for javascript: URLs, blob: URLs, or for assets accessed via file:///android_asset/ or file:///android_res/ URLs.
In the case of redirects, this is only called for the initial resource URL, not any subsequent redirect URLs.
For example, we want to provide a local error page.
This function is running in a background thread similar to how you execute an API call in the background thread. Any attempt to modify the content of the WebView inside this function will cause an exception. i.e. loadUrl, evaluateJavascript, etc.
For API<21 please use:
This option has the next limitations:
There is no payload field on the
WebResourceRequest. For example, if you want to create a new user with a POST API request. You cannot get the POST payload from theWebResourceRequest. - This method is called on a thread other than the UI thread so clients should exercise caution when accessing private data or the view system. For more information please refer to the documentation
Other options: There are other non-conventional options that can allow us to:
Resolve payload for POST requests. - Ensure JS override available on every page. - Inject JS code into each HTML page. These options are for more specifics requirements and are using JS or HTML overriding if you want to explore those options, please refer to this post, but most of the scenarios are cover on the above options.
Last updated
Was this helpful?