Extention .jsw vs .web.js

Discussion Ask a question
1

I am not able to use memberRole.web.js (new) but deprecated memberRole.jsw is working fine. I am worried as I don’t want to use deprecated feature. What to do? Kindly help.

2

Hey! Sorry you are having some issues. When you say that your web.js file isn’t working can you provide more context? Is there some error?

3

Sure,
This is code (assignRole) working fine (frontend)

import { myAssignRoleFunction } from 'backend/memberRole';
$w.onReady(function () {
    //$w('#userType').focus();
    $w("#NothingFound1").onViewportEnter((event) => {
        let options = { fieldsets: ['FULL'] }
        currentMember.getMember(options)
            .then((member) => {
                let memberId = member._id;
                //$w('#firstName').value = memberId;
                let role = $w('#userType').value;
                if (role === 'Institute') {
                    let roleId = '3ae96f56-be78-4181-8e8d-a1ed44412b9560';
                    myAssignRoleFunction(roleId, memberId);
                } else if (role === 'Teacher') {
                    let roleId = 'c637ca27-71eb-420f-bf20-3a4567402fd9f5';
                    myAssignRoleFunction(roleId, memberId);
                } else if (role === 'Student') {
                    let roleId = '6027bd10-62d7-44df-b1fe-f9cca618492bac';
                    myAssignRoleFunction(roleId, memberId);
                }
                let url = wixLocationFrontend.url;
                wixLocationFrontend.to(url);
            })
            .catch((error) => {
                console.error(error);
            });
    });
});

Now the problem is as I observed - that the below code is only working (backend) when I create file with .jsw (deprecated). memberRole.jsw

import { authorization } from 'wix-members-backend';
// Got inspired by this post : https://www.wix.com/velo/forum/coding-with-velo/assignrole-api-fails-with-error-server-responded-with-message-details-401
export function myAssignRoleFunction(roleId, memberId) {
    console.log("backend Assign Role api called " + roleId + " assigned to member " + memberId);
    //   const roleIdd = "e2580fce-d8de-479e-bbdc-723f3c1ac2c2";
    //   const memberIdd = "18e5da52-af8a-4d4b-85fd-2b4725af57ae";
    const options = {
        suppressAuth: true
    };
    return authorization.assignRole(roleId, memberId, options)
        .then(() => {
            console.log("Role assigned to member");
        })
        .catch((error) => {
            console.error(error);
        });
}

If I try with the new introduced feature memberRole.web.js (new) instead of .jsw, the assignRole function not working.

I want your kind attention to solve this. As I don’t want to use the deprecated function in newly wix studio site.

Thanks and regards,
Chanchal Narania

4

This appears to be due to the fact that your function is not updated to the proper structure for a web.js file. The change is not a file name change only, but a change to the way you write your backend functions.

Here is the article for more information

Your backend functions is missing permissions API and is not in the correct format.

It will look more like this when you are done (test to make sure, i’m making this function untested as an example)


import { Permissions, webMethod } from "wix-web-module";
import { authorization } from 'wix-members-backend';

export const myAssignRoleFunction = webMethod(Permissions.Anyone, async(roleId, memberId) =>{
const options = {
    suppressAuth: true
};

try {
    const result = await authorization.assignRole(roleId, memberId, options);
    return result;
} catch (error) {
    // Handle the error here, you can log it or wahtever meets your requirements
    console.error("An error occurred while assigning role:", error);
    return null; // Return null or some indication of failure
}
})
1 Like
5

Thanks for your reply and code. Its working beautifully. I would like to get in touch with you.
I have another problem related to this. Is it possible you to update this removeRole code also. Thanks in advance. Lots of love. :blush:

export function myRemoveRoleFunction(roleId, memberId) {
    console.log("backend Remove Role api called " + roleId + " removed from member " + memberId);
    //const roleId = "b62310c1-1c81-4ca9-9fe9-42b48f6e164e";
    //const memberId = "72751428-2743-4bda-acf5-4218a4279cd3";
    const options = {
        suppressAuth: true
    };

    return authorization.removeRole(roleId, memberId, options)
        .then(() => {
            console.log("Role removed from member");
        })
        .catch((error) => {
            console.error(error);
        });
}
6

Instead of me updating it - how about you have a try first! I will help you along the way if you find a bug or get stuck, but working through the new learning will help it stick for future functions. See if you can take this and modify to your needs

export const yourFunctionName = webMethod(add the permissions here, async here if it is async func (parameters) =>{
//try catch statement to handle your errors. This is what I use, but there are other methods if you do not like it
try {
    const myResultVariable = await place your wix api method here
    return myResultVariable;
} catch (error) {
    // Handle the error here, you can log it or wahtever meets your requirements
    console.error("An error occurred while assigning role:", error);
    return null; // Return null or some indication of failure
}
})
3 Likes