EMSCRIPTEN hepling for c++ class with unreal engine 4

Development Platform & Builds
, , , ,
1

hi i use unreal engine 4.19 visual studio 2015 version 14.0.25431.01 update 3

i have create a project and export in html5 in aproximatively in 30minute max

after i have create a basic c++ class with visual studio and add my actor class in scene
my class :

cpp

#include "MyActor.h"
#include "EngineUtils.h"
#include "Engine/StaticMeshActor.h"
#include "ConstructorHelpers.h"
#include "Materials/Material.h"
#include "Components/StaticMeshComponent.h"
#ifdef EMSCRIPTEN
#include <emscripten.h>
#endif


// Sets default values
AMyActor::AMyActor()
{
	// Set this actor to call Tick() every frame.  You can turn this off to improve performance if you don't need it.
	PrimaryActorTick.bCanEverTick = true;
	static ConstructorHelpers::FObjectFinder<UMaterial> Material(TEXT("/Game/mat/BasicShapeMaterial_2"));
	if (Material.Succeeded()) {
		StoredMaterial = Material.Object;
	}
}


#ifdef __EMSCRIPTEN__
extern "C" {
	EMSCRIPTEN_KEEPALIVE
#endif
 void    AMyActor::changeColorCube(){
	TArray<AStaticMeshActor *> actors;
	FindAllActors(GetWorld(), actors);

	for (int i = 0; i < actors.Num(); i++) {
		AStaticMeshActor  * m = actors[i];

		if (m->ActorHasTag("Cubechange")) {
			//static ConstructorHelpers::FObjectFinder<UMaterial> Material(TEXT("Material'/Game/mat/BasicShapeMaterial_2'"));
			
			
				m->GetStaticMeshComponent()->SetMaterial(0, StoredMaterial);



			}
		}
	}

#ifdef __EMSCRIPTEN__
}
#endif
// Called when the game starts or when spawned
void AMyActor::BeginPlay()
{
	Super::BeginPlay();

}

// Called every frame
void AMyActor::Tick(float DeltaTime)
{
	Super::Tick(DeltaTime);

}


template<typename T>
void AMyActor::FindAllActors(UWorld* World, TArray<T*>& Out)
{
	for (TActorIterator<AActor> It(World, T::StaticClass()); It; ++It)
	{
		T* Actor = Cast<T>(*It);
		if (Actor && !Actor->IsPendingKill())
		{
			Out.Add(Actor);
		}
	}
}

.h

// Fill out your copyright notice in the Description page of Project Settings.

#pragma once

#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "MyActor.generated.h"


UCLASS()
class MYPROJECT2_API AMyActor : public AActor
{
	GENERATED_BODY()

public:
	// Sets default values for this actor's properties
	
	AMyActor();


		UFUNCTION(BlueprintCallable, Category = "changeColor")
		void  changeColorCube();
	

	
	template<typename T>
	void FindAllActors(UWorld* World, TArray<T*>& Out);
	
protected:
	// Called when the game starts or when spawned
	virtual void BeginPlay() override;

public:
	// Called every frame
	virtual void Tick(float DeltaTime) override;

	UMaterial* StoredMaterial;
};

im inspired by
https://forums.unrealengine.com/development-discussion/html5-development/91660-js-c-communication?119332-js-c-communication=

no error project generate
and the class is fonctional in editor
but i export in html5
after 5 minute the console displayed this line

UATHelper: Packaging (HTML5):   JS_ENGINES = [NODE_JS] # add this if you have spidermonkey installed too, SPIDERMONKEY_ENGINE]
UATHelper: Packaging (HTML5):   Performing 3 actions (4 in parallel)
UATHelper: Packaging (HTML5):   [1/3] Compile MyActor.cpp
UATHelper: Packaging (HTML5):   [2/3] Compile MyActor.gen.cpp
UATHelper: Packaging (HTML5):   In file included from C:/Users/aznur/Documents/Unreal Projects/MyProject2/Source/MyProject2/MyActor.cpp:3:
UATHelper: Packaging (HTML5):   In file included from C:/Users/aznur/Documents/Unreal Projects/MyProject2/Intermediate/Build/HTML5/UE4/Inc/MyProject2/MyActor.gen.cpp:8:

and after that no thing no error and the processor up to 80%-100% after 2 hours no change same line
nothing else can display

my code is good ?
I do not find a simple but complete example that shows the use of a c ++ class from start to finish
in ue4 with use by javascript EMSCRIPTEN method

thanks for help

2

i find this :

and particulary this

Could you try to delete the I:\Epic Games\4.13\EngineIntermediate\Build\HTML5.emscripten folder from your Engine? (only the bold part) Then go ahead and re-verify your version of the engine and try to package again, upload those logs as well.

Also, let me know whether or not you’re using a Source or Binary version of the engine.

and the display after 5 minute is note the same line
but is it going to work?

3

same problem but the other line apparently …

4

ok i find

path to follow:
create c++ project
create c++class derivated actor

cpp file :

#include "BrowserCommActor.h"
#include "EngineGlobals.h"
#include "Engine.h"

//Gotta have these to make emscripten work
#ifdef __EMSCRIPTEN__ //This basically says “if emscripten is doing stuff, add this, otherwise ignore”.
#include "SDL/SDL.h"
#include "emscripten/emscripten.h"
#include "emscripten/html5.h"
#else
#define EMSCRIPTEN_KEEPALIVE
#endif //This closes the “ifdef __EMSCRIPTEN__” tag.

//Gotta have this to make translation of strings to JavaScript work
#include "string"
#include "iostream"
#include "sstream"

// Sets default values
ABrowserCommActor::ABrowserCommActor()
{
 	// Set this actor to call Tick() every frame.  You can turn this off to improve performance if you don't need it.
	PrimaryActorTick.bCanEverTick = true;

}

// Called when the game starts or when spawned
void ABrowserCommActor::BeginPlay()
{
	Super::BeginPlay();
	
}

// Called every frame
void ABrowserCommActor::Tick(float DeltaTime)
{
	Super::Tick(DeltaTime);

}

void ABrowserCommActor::AppelJS()
{
	//GEngine->AddOnScreenDebugMessage(-1, 15.0f, FColor::Red, TEXT("Comm_RunExtJS() Triggered!”)); //This puts a message onscreen inside UE4, so you know this side executed. If you want to verify the JS side, you’ll need an alert in that function.
	FString returnedDataString("BLABLA");

	std::string OutboundSendString(TCHAR_TO_UTF8(*returnedDataString));

#ifdef __EMSCRIPTEN__ // Shields the JavaScript code from the C++ compiler to prevent errors.
	//This executes JS code and passes arguments (in this case a string).
	EM_ASM_ARGS({
		var theData = Pointer_stringify($0); // Convert the string to a JS string.
											 //alert(“JS Triggered!”);            // Pop an alert for testing.
	sendToUE(theData);             // Call a JS function in the wrapper HTML, passing the string to it.
}, OutboundSendString.c_str());          // Pass the string from UE4 world into the emscripten function.
#endif
/*#ifdef __EMSCRIPTEN__ // Shields the JavaScript code from the C++ compiler to prevent errors.

	
	EM_ASM(
		sendToUE();
		);



#endif*/
}


// at site of use:
extern "C" void EMSCRIPTEN_KEEPALIVE printString(char *str) {
	printf("%s\n", str);
	FString returnedDataString(str); //This converts the string from JavaScript to a UE4 FString
	GEngine->AddOnScreenDebugMessage(-1, 15.0f, FColor::Yellow, returnedDataString);
}

Warning
##############################################################
the function printString not in class but in file

h file :

// Fill out your copyright notice in the Description page of Project Settings.

#pragma once

#include "CoreMinimal.h"
#include "GameFramework/Actor.h"
#include "BrowserCommActor.generated.h"

UCLASS()
class MYPROJECT3_API ABrowserCommActor : public AActor
{
	GENERATED_BODY()
	
public:	
	// Sets default values for this actor's properties
	ABrowserCommActor();
	UFUNCTION(BlueprintCallable, Category = "SunShine")
	void AppelJS();
protected:
	// Called when the game starts or when spawned
	virtual void BeginPlay() override;

public:	
	// Called every frame
	virtual void Tick(float DeltaTime) override;

};

generate project
add your actor in scene

and in the blueprint level :

241594-img.jpg

lunch a packaging project html
modifie the “yourproject”.html

add the html javascript in “yourproject”.html at the end just before

</body>
</html>

the javascript html code :

<script>
document.getElementById("nodeGoto").addEventListener("click", function() {
    sendToUE("Test");
}, false);
function sendToUE(Chaine) {
   var str =  Chaine;
   var lenUTF8 = Module.lengthBytesUTF8(str) + 1;
   var ptr = Module._malloc(lenUTF8);
   Module.stringToUTF8(str, ptr, lenUTF8); 
   Module.ccall('printString', 'null',['string'], [str]);
   Module._free(ptr);
 }
</script>

how it works :
press button call "Bouton clic"in html page
or with your mouse pointer in the game press Q

5

Hi, I use my Encode as Portuguese Brazil… How i change this code to work letters as acents??? UTF8 sending to Unreal and receive and acents change???

In unreal acents receive as “?” character…

6

Hi aznur ,
C++ project is compiled successfully and I get following error when I run html file from my browser. I tried this on both Internet Explorer 9 and Chrome too.

ERROR:
Uncaught TypeError: Cannot read property ‘addEventListener’ of null

7

I got it working by writing code within . As it was shipping build so it was to be written here I guess. But now if I run game it starts successfully but when I press Q i get
’ Uncaught ReferenceError: sendToUE is not defined’. I have attached an Image as I cant upload text file or html file.

272701-codesnippet.png
272701-codesnippet.png1031×718 13.4 KB

8

This looks promising, but the problem is that I get a console error in the browser when trying to call Module.ccall:

'ccall' was not exported. add it to EXTRA_EXPORTED_RUNTIME_METHODS (see the FAQ)

In the Emscripten FAQ it says that most of the exported functions were removed to save some space and that you need to add it to the aforementioned EXTRA_EXPORTED_RUNTIME_METHODS. But I have no idea how to do that in Unreal, because it manages the emscripten build on it’s own. I would expect some options for that one in the HTML5 section of the Platform settings… But so far I see no way of setting it. Any ideas?

9

Facing the same problem,can somebody help?