Page tree
Skip to end of metadata
Go to start of metadata

Note: This page details steps required by the iOS version of the Profound UI Mobile Client or a home-grown iOS Cordova-based mobile app. It is not needed for Android mobile apps.

Starting with Profound UI Mobile Client version 2.8.0 and the Cordova iOS platform version 6.0.0, cross-origin resource sharing (CORS) is now enforced. This means, out of the gate, that XHR requests made from a mobile app will fail due to cross-origin violations, because the origin of the request is the mobile device while the requested resource is the server on which Profound UI runs. The solution is to implement the CORS headers expected by the mobile client's web view, which will then allow access to those resources. Doing so is a two part process, consisting of a server configuration change and either a Cordova platform upgrade plus a configuration change, or an update to the Profound UI Mobile Client.

Step 1: Change the HTTP Server Configuration on IBM i

The HTTP server must be modified to send the CORS headers that are expected by iOS's web view. You can add the required headers to your HTTP server's httpd.conf file by editing the file located at /www/PROFOUNDUI/conf/httpd.conf and adding the following lines, if they aren't already present.

Please note that this step MUST be performed prior to updating mobile clients to a version that enforces CORS or they will cease to function.

# CORS support for Mobile Client
Header always set Access-Control-Allow-Origin "puimobile://localhost"
Header always set Access-Control-Allow-Methods "GET, POST, OPTIONS"
Header always set Access-Control-Allow-Headers "X-Requested-With, Content-Type, Origin, Authorization, Accept"
Header always set Access-Control-Max-Age "1000"
# Respond to OPTIONS requests (part of CORS) with a 204 "No Content"
RewriteEngine On
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=204,L]

The values of these headers may need to be adjusted, depending on your particular Profound UI applications and the type of requests that are expected. A brief explanation of each line is as follows:

Line 2: Allows HTTP requests to originate from a device with an origin of "puimobile://localhost".

Line 3: Specifies which HTTP request methods are allowed to originate from the mobile app. The OPTIONS method is required by CORS.

Line 4: Specifies which HTTP request headers are allowed to originate from the mobile app.

Line 5: The length of time (in seconds) that the results of an OPTIONS pre-flight request (the headers specified in lines 3 and 4) can be cached.

Lines 7-9: Directives that cause OPTIONS preflight requests to respond with a 204 "No Content" status. This indicates to the user-agent that aside from the returned headers, no response body exists.

After editing the httpd.conf file, remember to restart the server.

Step 2a: Update the Profound UI Mobile Client app

If the mobile app you use is the Profound UI Mobile Client, then once CORS has been implemented on your server it will be safe to update the app and start using it. 

Step 2b: Set your Cordova mobile app's origin

If the mobile app used is a home-grown Cordova-based app, it will need to be updated with the latest version of Cordova and the Cordova iOS platform, and then its origin can be configured. Recall that in line 2 of the sample apache configuration above, the allowed origin was set to "puimobile://localhost". This tells the user-agent (the mobile app) to allow code running with an origin of "puimobile://localhost" to request resources from the server. Thus, it follows that the mobile app's origin must be set to a matching value for everything to work. The iOS Profound UI Mobile Client as of version 2.8.0 is already configured with that origin. If you have created your own Cordova (or Cordova-based) mobile app, you will need to configure its origin appropriately. It doesn't need to be "puimobile://localhost"; it just needs to match the value returned by the server's Access-Control-Allow-Origin header response.

To set the origin specified in requests made by a Cordova app, add these lines to your project's `config.xml` file and rebuild your app.

<preference name="scheme" value="puimobile" />
<preference name="hostname" value="localhost" />

Note: if your app uses a different origin than "puimobile", e.g. "acmemobile", then you would replace "puimobile" with that value. (For example, if the app "scheme" is "acmemobile", then the Access-Control-Allow-Origin value in the server's http.conf file would be "acmemobile://localhost".)


Once Steps 1 and either 2a or 2b have been performed, your mobile apps should again work.

Further information

An explanation of Cross-Origin Resource Sharing (CORS): https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

Enabling CORS in a Cordova application: https://breautek.com/2020/07/14/enabling-cors/

  • No labels