Getting the Url Params

Here is a sample example on how to get the query params in Javascript As we stated before the website will pass the url for the query params into the iframe of the website, accessible to your game

const urlSearchParams: any = new URLSearchParams(window.location.search);

params = Object.fromEntries(urlSearchParams.entries());

console.log(params);

const playerId = params.playerid
const otp = params.otp
const tourneyId = params.tourneyid

if (params.playerid && params.otp && params.tourneyid) {
        isOnline = true;
}

console.log("tournament mode", isOnline);

The first 3 parameters are required to be passed upon client creation:

• playerId

• otp

• tourneyId

Other parameters are also sent by OP Arcade, these are optional and can be used if needed:

• displayname — current name of the logged in user. Name will be urlencoded so will need some additional processing to remove escape characters if any.

• image_url — avatar image url of the logged in user

• wallet_address — wallet address of currently logged in user

Where can I see this URL live on the website?

Check the developer tools and access the iframe component and you will be able to double check the data live.

Exaple of url given by the iframe component

src="https://blazingrace-dev.outplay.games/?playerid=d563a3a2-0b59-4a42-a3a0-e46f627c86cb&tourneyid=65d582e1-5ffa-4502-99b5 bcc06d648d65&otp=eyJwbGF5ZXJJZCI6ImQ1NjNhM2EyLTBiNTktNGE0Mi1hM2EwLWU0NmY2MjdjODZjYiIsImV4cGlyeSI6MTY3MTEzODQ3MzQzNn0%3D.1e5f9d278b4edae53fbccb81258fd49541319b5029af15722e0fba7ceb7885e6949b1024c5434cb3d33f4e62bdd845ed41ce53552f0d59abd2614a0113fc4395&displayname=@smoggy_amaranth_toucan&image_url=/images/avatarplaceholder.png&wallet_address=0xf39fd6e51aad88f6f4ce6ab8827279cfffb92266&"