unityContext.send not sending.

[Squizyton]

Hello, just another quick problem that's probably easy to solve.

My unity loads fine and everything, even though the screen is really really tiny (and I don't know why)

I'm trying to call a function as soon as unity loads. However it doesnt seem to be getting called (is this a timing issue?)

I get the console.log("Send Code") but I never receive the log from unity.

The JS code

import React, { useState, useEffect } from 'react';
import Unity, { UnityContext } from "react-unity-webgl";

import { ProgressIndicator } from 'office-ui-fabric-react/lib/ProgressIndicator';
import './TevolveGame.css';


class TevolveGame extends React.Component {
  constructor(props) {
    super(props)

    // 'https://builds.tevolve.net/' + 
    const unityContext = new UnityContext({
      loaderUrl: this.props.build + '/Build/Tevolve.loader.js',
      dataUrl: this.props.build + '/Build/Tevolve.data',
      frameworkUrl: this.props.build + '/Build/Tevolve.framework.js',
      codeUrl: this.props.build + '/Build/Tevolve.wasm',
      streamingAssetsUrl: + this.props.build + '/StreamingAssets'
    });

function App() {
      return <Unity unityContext={unityContext} />;
    }


    console.log("Props: " + this.props)

    this.state = {
      progression: 0,
      loading: true
    }
    
    this.unity = unityContext;
    console.log("UNITY" + this.unity)
    window.unityContent = this.unity;


    this.unity.on("progress", progression => {
      this.setState({
        progression: progression
      });
    });

    unityContext.on("loaded", function() {
      console.log("Sent Code")
    unityContext.send("Loader","ReceiveGameCode","hi")
    })

  }

And the c# code I'm trying to call

  void ReceiveGameCode(string args)
    {
        
        Debug.Log("Arguements: " +args);


        var test = FindObjectOfType<GameCodeProxy>().code = args;
        Debug.Log("Code Received: "  + test);
        
       // var code = JsonUtility.FromJson<JoinGameArgs>(args);
    }

[thom-ra]

This happened to me as well. Adding a setTimeout of 1 second helped fix the issue. Looks like Unity WebGL isn't ready to call a method the instant it has been loaded.

[michael-iv64]

This example didn't work for me either when transferring data from unity to React. I redid the example from version 7 and everything worked out !

HandleClick.cs (attaches to any object in the scene)

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

using System.Runtime.InteropServices; // for DllImport

public class HandleClick : MonoBehaviour
{
// React functions
[DllImport("__Internal")]
private static extern void DemoUnityToReact (string jsonifyStr); // This function is the one in MyPlugin.jslib

[DllImport("__Internal")]
private static extern void MouseCoordsToReact (string jsonifyStr); // This function is the one in MyPlugin.jslib


// Update is called once per frame
void FixedUpdate()
{
    if (Input.GetMouseButtonDown(0))
    {
        leftClickDown();
        middleClickDown();
    }
    if (Input.GetMouseButtonDown(2))
    {
    }
}

void leftClickDown()
{
    Debug.Log("Left click");

    if (Application.platform == RuntimePlatform.WebGLPlayer) {
        SendMessage bus = new SendMessage();
        bus.message = "Hello from Unity";
        bus.secondField = 123;
        string busStr = JsonUtility.ToJson(bus);
        DemoUnityToReact(busStr);
    }
}

void middleClickDown() {
    Debug.Log("middle Click!");

        if (Application.platform == RuntimePlatform.WebGLPlayer) {
            SendMouseCoords allCoords = new SendMouseCoords();
            allCoords.x = Input.mousePosition.x;
            allCoords.y = Input.mousePosition.y;
            allCoords.z = Input.mousePosition.z;
            string allCoordsStr = JsonUtility.ToJson(allCoords);
            MouseCoordsToReact(allCoordsStr);
        }


}

}

auxiliary scripts
SendMessage.cs
using System.Runtime.Serialization;
using System;
using System.Collections.Generic;

[System.Serializable]
public class SendMessage {
public string message;
public int secondField;
}

SendMouseCoords.sc
using System.Runtime.Serialization;
using System;
using System.Collections.Generic;

[System.Serializable]
public class SendMouseCoords {
public float x;
public float y;
public float z;
}

ConnectToReact.jslib

mergeInto(LibraryManager.library, {

DemoUnityToReact: function(busStr) {
window.dispatchReactUnityEvent(
"DemoUnityToReact",
Pointer_stringify(busStr)
);
},

MouseCoordsToReact: function(allCoordsStr) {
window.dispatchReactUnityEvent(
"MouseCoordsToReact",
Pointer_stringify(allCoordsStr)
);
}
});

[jeffreylanters]

Can you provide some React code?

[michael-iv64]

Yes!) this option works with version 8 of the library [email protected] .
import React, { useEffect } from "react";
import Unity, { UnityContext } from "react-unity-webgl";

const unityContext = new UnityContext({
loaderUrl: "Build2/Build.loader.js",
dataUrl: "Build2/Build.data.unityweb",
frameworkUrl: "Build2/Build.framework.js.unityweb",
codeUrl: "Build2/Build.wasm.unityweb",
});

function App() {

// useEffect(function () {
unityContext.on("DemoUnityToReact", function (params) {
console.log("DemoUnityToReact", params)
});
unityContext.on("MouseCoordsToReact", function (params) {
console.log("MouseCoordsToReact", params)
});

// }, []);
return (

{/* */}
<Unity
unityContext={unityContext}
style={{
height: 700,
width: 1200,
border: "2px solid black",
background: "grey",
}}
/>

);
}
export default App;

[jeffreylanters]

Thanks. Could you try executing the Dispatch event manually using the browser's console and see if it's working that way? Thanks!

[michael-iv64]

Thanks. Could you try executing the Dispatch event manually using the browser's console and see if it's working that way? Thanks!

Hallo! I transferred the call from Uniti to React method Start() everything works fine.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

using System.Runtime.InteropServices; // for DllImport

public class HandleClick : MonoBehaviour
{
// React functions
[DllImport("__Internal")]
private static extern void DemoUnityToReact (string jsonifyStr); // This function is the one in MyPlugin.jslib

[DllImport("__Internal")]
private static extern void MouseCoordsToReact (string jsonifyStr); // This function is the one in MyPlugin.jslib
void Start()
{
leftClickDown();
}

// Update is called once per frame
void FixedUpdate()
{
if (Input.GetMouseButtonDown(0))
{

    middleClickDown();
}
if (Input.GetMouseButtonDown(2))
{
}

}

void leftClickDown()
{
Debug.Log("Left click");

if (Application.platform == RuntimePlatform.WebGLPlayer) {
    SendMessage bus = new SendMessage();
    bus.message = "Hello from Unity";
    bus.secondField = 123;
    string busStr = JsonUtility.ToJson(bus);
    DemoUnityToReact(busStr);
}

}

void middleClickDown() {
Debug.Log("middle Click!");

    if (Application.platform == RuntimePlatform.WebGLPlayer) {
        SendMouseCoords allCoords = new SendMouseCoords();
        allCoords.x = Input.mousePosition.x;
        allCoords.y = Input.mousePosition.y;
        allCoords.z = Input.mousePosition.z;
        string allCoordsStr = JsonUtility.ToJson(allCoords);
        MouseCoordsToReact(allCoordsStr);
    }

}

and code in React
import React, { useEffect, useState } from "react";
import Unity, { UnityContext } from "react-unity-webgl";

const unityContext = new UnityContext({
loaderUrl: "Build3/Build.loader.js",
dataUrl: "Build3/Build.data.unityweb",
frameworkUrl: "Build3/Build.framework.js.unityweb",
codeUrl: "Build3/Build.wasm.unityweb",
});

function App() {
const[message, setMessage] = useState("");
const[number, setNumber] = useState("");

// useEffect(function () {
unityContext.on("DemoUnityToReact", function (params) {
setMessage(JSON.parse(params).message);
setNumber(JSON.parse(params).secondField);
});
unityContext.on("MouseCoordsToReact", function (params) {
console.log("MouseCoordsToReact", params)
});

// }, []);
return (

{/* */}

Message {message}

Number {number}

<Unity
unityContext={unityContext}
style={{
height: 700,
width: 1200,
border: "2px solid black",
background: "grey",
}}
/>

);
}
export default App;

[michael-iv64]

Thank you for your Wonderful library!) Now the event is triggered when the left mouse button is pressed. I will later try to call sending a message from Unity using the Start() function.

[DarlingUUi]

@jeffreylanters
how to build ReactUnityWebGL.jslib?
It's only a library to test your sample project?

[jeffreylanters]

Hi! You can create a JSLib file right within your Unity project. Simply create a file with any name ending in '.jslib' in the 'Assets/Plugins/' directory and you're ready to go!