Solution: Run game local (file:///) Construct 2

Question

I've recentelly had to build a mobile app that could download games build with Construct 2 and run locally, the solution I've got is handle the game data and sounds in a different way. And here is my solution:

Answer 1

1- Export your game with the minify option unchecked

---

2- Change the way Construct handle sounds, to do that we need to open the index.html and add right after the code:

<div style="display:none;">
<script>
window.playAudioAux = function(url){
    var output = url.substr(0, url.lastIndexOf('.')) || url;
    var url1 = output+'.ogg';
    var url2 = output+'.mp3';
    var url3 = output+'.m4a';
    document.getElementById('myAudioogg').src = url1;
    document.getElementById('myAudiompeg').src = url2;
    document.getElementById('myAudiomp4').src = url3;
    document.getElementById('myAudio').src = url3;
    document.getElementById('myAudio').load();
    document.getElementById('myAudio').play();
}
</script>
<audio id="myAudio" controls>
  <source id="myAudioogg" src="" type="audio/ogg">
  <source id="myAudiompeg" src="" type="audio/mpeg">
  <source id="myAudiomp4" src="" type="audio/mp4">
    Your browser does not support the audio element.
</audio>
</div>

This will create a new way to run audio. And now we have to change the c2runtime.js where it calls the sounds, so find:

function C2AudioInstance(buffer_, tag_)
{

And add right after that

playAudioAux(buffer_.src); return;

This will stop the normal call of Construct and call the function that we just added on the index.html

---

3- Most(maybe all) browsers see requests from local as a security problem so we have to load that game data.js in a different way, open it so you can copy its content. Also inside c2runtime.js find the following code inside requestProjectData function:

xhr.open("GET", datajs_filename, true);
var supportsJsonResponse = false;

And then add after that this code:

self.loadProject(FULL_CONTENT_INSIDE_YOUR_DATA.JS); return;

This will load your game content and cancel the request to load data.js.

---

4- Inside index.html comment the alert about running the game locally like this:

//alert("Exported games won't work until you upload them. (When running on the file:/// protocol, browsers block many features from working for security reasons.)");

That is it! :D, It runs fine inside firefox, android webview etc. The only one that still doest run it is Chrome for security reasons...

Hope it helps anyone with this kind of problem.

Answer 2

For anyone looking for a solution to importing from Construct 2 to Android Studio:

1. Export the game as "HTML5 Website"

2. Make an assets folder (right-click on "app" > New > Folder > Assets Folder) and copy the exported files into the assets folder (usually "YourApp/app/src/main/assets/").

3. Add the following to enable webView:

In AndroidManifest.xml:

<uses-permission android:name="android.permission.INTERNET"/>

In activity_main.xml:

<WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:ignore="MissingConstraints"
        tools:layout_editor_absoluteX="8dp"
        tools:layout_editor_absoluteY="8dp" />

In class MainActivity in MainActivity.kt:

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
    val myWebView: WebView = findViewById(R.id.webview)
    myWebView.settings.javaScriptEnabled = true
    myWebView.settings.allowUniversalAccessFromFileURLs = true
    myWebView.loadUrl("file:///android_asset/index.html")
}

Make sure "allowUniversalAccessFromFileURLs" is set to true.

This solution worked for me without needing to make any changes to the exported files.