Blazor server side problem share javascript code

Question

I'm developing my project with Blazor Server-side. While I develop, I used javascript code to implement things that hard to implement by C#.

However, I'm facing something weird situation. (I guess it is problem for javascript)

Suppose there are 2 users(A, B). When 'A' user do some action that call javascript code, if 'B' user into same page, 'A' users action affects to 'B' user.

I implemented web page that have 3d scene with threejs. As I explained above, when User 'A' move some object with mouse event(mousemove, mousedown..), if User 'B' accesses the same page, 3d objects of B are moved to the location where User 'A' moved. Originally, when user access to web page I developed, 3d objects's position should be 0,0,0.

My Guess

I don't use prototype or class(use variable and functions globally. I'm new to javascript.. )
Javascript runs on server-side(share resources??, If then, how can I solve it)

I'm guessing the javascript would be problem, but if you have any other opinions, would you please share?

Edited

I've solved this problem using DotNetObjectReference.Create(this);

C#

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        //send created instance to javascript
        var dotNetObjRef = DotNetObjectReference.Create(this);
        await JSRuntime.InvokeVoidAsync("SetObjectRef", dotNetObjRef);
    }
    await base.OnAfterRenderAsync(firstRender);
}

[JSInvokable]
public async Task enableSomething(bool bEnable)
{
   var something = bEnable;
}

//== before edit
//[JSInvokable]
//public static async Task enableSomethingStatic(bool bEnable)
//{   
//    var something = bEnable;
//}

Javascript

var objectRef;
function SetObjectRef(ref) {
    objectRef = ref;
}

//call c# function
objectRef.invokeMethodAsync("enableSomething", true);

It was problem of 'static' method as I guessed. If you declare C# method called from javascript as 'static' and this method changes something of UI variable, this method can affect another users.

So I create instance of current page and send it javascript and when I need to call C# methods from javascript, I call methods using created instance.

Is there any problem or issue, please share it. Sorry for my bad English.

Bennyboy1973 · Accepted Answer · 2021-03-18 03:44:53Z

2

JavaScript runs client side only. I don't see how two windows, let alone two users, would share data.

Almost for sure, the problem is that you are injecting a singleton service-- which means the server will use one instance for all users.

If so, you have two choices:

(1) add logic to your singleton service to incorporate users. (For example, a dictionary with UserID/Property name for key, and a column for Value)

(2) go to Startup.cs and change the suspect singleton service to .AddScoped(), which will create a new instance for each user.

For right now, I think the latter solution will solve your problem immediately. However, don't underestimate the value of Singletons-- they'll be very useful for other things.

edited Mar 18, 2021 at 3:44

answered Mar 18, 2021 at 3:34

Bennyboy1973

4,3372 gold badges16 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

takeyourcode Over a year ago

thank you for your kind guidance. I tried to change singleton services to addscoped, however it didn't work. So, I look around my code again and again and I found one questionable part. I guess the problem is that the [JSInvokable] function is declared 'static'. As opposed to IJSRuntime, it is used when calling a C# function from JavaScript. It would be called when user try to move 3D object for send position information to UI. Calling a'static' function from javascript, could this be a problem? Thank you again for you answer.

Bennyboy1973 Over a year ago

Oh, is this a static class with its own variables? Why don't you try removing static, registering it as a service instead and using dependency injection with Scoped? Basically-- do what I thought you were already doing. :D

takeyourcode Over a year ago

Um.. It is not class, method. [JSInvokable] It's not a class, it's a function. This is used to pass variables used in JavaScript from JavaScript to the C# area. And It should be declared with 'static' keyword to call from javascript. For example In js DotNet.invokeMethodAsync("ProjectName", "setCurrentState", true); In C# [JSInvokable] public static async Task setCurrentState(bool bEnable) {... }

Bennyboy1973 Over a year ago

I see. Then I have to say I don't know why this person's having state persistence among users. Any ideas?

takeyourcode Over a year ago

Thank you for your kind answer. I've solved this problem and I wrote it how to solve it Edited in my question.

|

Collectives™ on Stack Overflow

Blazor server side problem share javascript code

1 Answer 1

11 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related