Debugging network requests in the Moodle App: Difference between revisions

Latest revision as of 13:01, 14 July 2022

Important:

This content of this page has been updated and migrated to the new Moodle Developer Resources. The information contained on the page should no longer be seen up-to-date.

Why not view this page on the new site and help us to migrate more content to the new site!

Introduction

This guide will help you find and report problems with the Moodle App on your site.

It is especially useful for the following problems:

Unable to log in on your site.
When you receive one of the following error messages in the app:
- "Can not find data record in database table external_functions".
- "Invalid response value detected".
- "Cannot get course contents".

Enabling debugging on your Moodle site

Go to Debugging in the Site administration.
For "Debug messages" select 'DEVELOPER'.
Tick "Display debug messages".
Click the 'Save changes' button.

Remember to disable debugging again once you have finished debugging your problem.

Enabling debugging on the Moodle App

Go to the More tab.
Go to Settings > General.
Enable "Display debug messages".

Remember to disable debugging again once you have finished debugging your problem.

First attempts

At this point, you may not need to go further on this guide.

Log out and log in again into your site and try to reproduce the error. Hopefully, with Moodle and app debugging enabled you will see an explanatory message of what is happening.

If you are unable to find a solution, contact a Moodle Partner or post in the Moodle for mobile forum on moodle.org for non-guaranteed community support.

Setting up the debugging tool

Using a Browser

In your Chromium-based browser, you can access your site using the hosted versions of the app in master.apps.moodledemo.net (the latest stable version) and integration.apps.moodledemo.net.

Once you're using your site, you can open the Network panel of the developer tools and inspect requests. If you're only interested in web service requests, you can filter writing .php in the filter input.

Using a mobile device or emulator

If you are using a native device, keep in mind that some requests are not executed through the webview and you won't be able to see them in the network inspector of your developer tools. Instead, you'll have to use native tools the debug the requests.

For example, in Android you can use the Network Profiler.

General strategy

Here's how to debug web service errors:

Ignore requests that don’t start with token.php or server.php.
Once you have selected a request you want to inspect, open the "Response" tab and check if you see an error.
If you don't understand how to fix the error, you can search in Moodle Mobile FAQ to check if there is a known solution.
If you are unable to find a solution, contact a Moodle Partner or post in the Moodle for mobile forum on moodle.org for non-guaranteed community support.

Troubleshooting

How to log into a site configured to use browser or embedded authentication

You can execute the following in the JavaScript console:

window.handleOpenURL("moodlemobile://URL?token=WSTOKEN");

You can also launch a normal authentication process (allowing the authentication popup) and capture the redirect to moodlemobile://... created by the admin/tool/mobile/launch.php script and then execute the following in the console:

window.handleOpenURL("moodlemobile://token=ABCxNGUxMD........=");

@@ Line 1: / Line 1: @@
-{{Moodle Mobile}}== Introduction ==
+{{Template:Migrated|newDocId=/general/app/development/network-debug}}
+{{Moodle App (Ionic 5)}}
-This guide will help you find and report problems with the Moodle Mobile app on your site.
+== Introduction ==
+This guide will help you find and report problems with the Moodle App on your site.
 It is especially useful for the following problems:
-* Unable to log in on your site
+* Unable to log in on your site.
 * When you receive one of the following error messages in the app:
-** Can not find data record in database table external_functions
+** "Can not find data record in database table external_functions".
-** Invalid response value detected
+** "Invalid response value detected".
-** Cannot get course contents
+** "Cannot get course contents".
-== Requirements ==
-* Moodle 3.0 onwards (your site needs at least this version)
-* Google Chrome or Chromium browser
-[[{{ns:file}}:moodlemobile_enabledebug.png|thumb|300px]]
 == Enabling debugging on your Moodle site ==
+# Go to Debugging in the Site administration.
-# Go to Debugging in the Site administration
+# For "Debug messages" select 'DEVELOPER'.
-# For "Debug messages" select 'DEVELOPER'
+# Tick "Display debug messages".
-# Tick "Display debug messages"
 # Click the 'Save changes' button.
-Note: Remember to disable debugging again once you have finished debugging your problem.
-== Setting up Chrome ==
-[[{{ns:file}}:moodlemobile_chrome_inspect_network.png|thumb|300px]]
-Debugging the mobile app is not so easy, so we have provided an online web version of the app that can be easily debugged using the Chrome browser.
-# Open your Chrome browser and go to https://prototype.moodle.net/mobile/webapp/
-# Open your browser options (icon at the top-right of your browser window), then go to More tools -> Developer tools
-# Dock the new panels on the right side (in the new panel top-right options choose “Dock to the right” icon)
-# Click the Network tab (at the top-center)
-# Enable the filter (filter shape icon) so it changes to colour red
-# In the new text field displayed when enabling the filter write <code>.php</code>
-Now you are ready to debug all the web services requests sent to your Moodle site by the mobile app.
-== Debugging a web service (WS) error ==
-[[{{ns:file}}:moodlemobile_chrome_debug_ws_error.png|thumb|300px]]
-# Connect to your site and browse to the functionality displaying an error
-# In the right panel you will see a list of requests made by the app to your Moodle site (token.php server.php server.php etc..)
-# Click on each one of them (starting with the last one in the list) but skip those that don’t start with token.php or server.php
-# In the new sub-window open select the “Response” tab and check if you see an error
-# Copy the error then go to the [[:en:Moodle Mobile FAQ Moodle Mobile FAQ]] in the user docs to check if there is a known solution for it
-# If you are unable to find a solution, post in the [https://moodle.org/mod/forum/view.php?id=7798 Moodle for mobile forum] on moodle.org
-== Building Moodle Desktop with devtools enabled ==
+Remember to disable debugging again once you have finished debugging your problem.
+== Enabling debugging on the Moodle App ==
+# Go to the More tab.
+# Go to Settings > General.
+# Enable "Display debug messages".
-You may be using some features, such as Single Sign-On, that require a built app to work, rather than a hosted or local ionic build running in a web browser.
-In this case, you can build the Moodle Desktop app with the browser's developer tools enabled.
-# Ensure you have a working [[Setting_up_your_development_environment_for_Moodle_Mobile_2|app development environment]]
+Remember to disable debugging again once you have finished debugging your problem.
-# In your terminal of choice, go to the directory where you have the app's code.
+== First attempts ==
-# Edit desktop/electron.js.  Around line 66 (at the end of the createWindow() function, but inside the function), add the line:<br /><code>mainWindow.webContents.openDevTools();</code><br />It should look something like:<br /><pre>  mainWindow.on('focus', () => {&#10;    mainWindow.webContents.send('coreAppFocused'); // Send an event to the main window.&#10;  });&#10;  mainWindow.webContents.openDevTools();&#10;}</pre>
+At this point, you may not need to go further on this guide.
-# Run <code>npm install -g electron electron-builder</code>
-# '''Windows only''': Run <code>npm install electron-builder-squirrel-windows  app-builder-lib @nodert-win10-au/windows.data.xml.dom</code>
-# Compile the code: <code>ionic build</code>
-# Run <code>npm run desktop.pack</code>
-This should give you a build of the app in desktop/dist.  For example, in windows you can run <code>desktop/dist/win-unpacked/Moodle Desktop.exe</code>. In MacOS you can run <code>desktop/dist/mac/Moodle Desktop.app</code>.
+Log out and log in again into your site and try to reproduce the error. Hopefully, with Moodle and app debugging enabled you will see an explanatory message of what is happening.
-When the app starts, the browser devtools will run inside the app, allowing you to inspect and debug the pages.  If you close the tools, you will have to restart the app to open them again.
+If you are unable to find a solution, contact a [https://moodle.com/partners/ Moodle Partner] or post in the [https://moodle.org/mod/forum/view.php?id=7798 Moodle for mobile forum] on moodle.org for non-guaranteed community support.
+== Setting up the debugging tool ==
+=== Using a Browser ===
+In your [[Using the Moodle App in a browser|Chromium-based browser]], you can access your site using the hosted versions of the app in [https://master.apps.moodledemo.net master.apps.moodledemo.net] (the latest stable version) and [https://integration.apps.moodledemo.net integration.apps.moodledemo.net].
-== See also ==
+Once you're using your site, you can open the [https://developer.chrome.com/docs/devtools/network/ Network panel] of the developer tools and inspect requests. If you're only interested in web service requests, [https://developer.chrome.com/docs/devtools/network/#filter you can filter] writing <code>.php</code> in the filter input.
+=== Using a mobile device or emulator ===
+If you are using a native device, keep in mind that some requests are not executed through the webview and you won't be able to see them in the network inspector of your developer tools. Instead, you'll have to use native tools the debug the requests.
-* [[Moodle Mobile development using Chrome or Chromium]]
+For example, in Android you can use [https://developer.android.com/studio/profile/network-profiler the Network Profiler].
+=== General strategy ===
+Here's how to debug web service errors:
+# Ignore requests that don’t start with <code>token.php</code> or <code>server.php</code>.
+# Once you have selected a request you want to inspect, open the "Response" tab and check if you see an error.
+# If you don't understand how to fix the error, you can search in [[:en:Moodle Mobile FAQ|Moodle Mobile FAQ]] to check if there is a known solution.
+# If you are unable to find a solution, contact a [https://moodle.com/partners/ Moodle Partner] or post in the [https://moodle.org/mod/forum/view.php?id=7798 Moodle for mobile forum] on moodle.org for non-guaranteed community support.
+== Troubleshooting ==
+=== How to log into a site configured to use browser or embedded authentication ===
+You can execute the following in the JavaScript console:
+<syntaxhighlight lang="javascript">
+window.handleOpenURL("moodlemobile://URL?token=WSTOKEN");
+</syntaxhighlight>
+You can also launch a normal authentication process (allowing the authentication popup) and capture the redirect to <code>moodlemobile://...</code> created by the <code>admin/tool/mobile/launch.php</code> script and then execute the following in the console:
+<syntaxhighlight lang="javascript">
+window.handleOpenURL("moodlemobile://token=ABCxNGUxMD........=");
+</syntaxhighlight>

Documentation