Subscribing to events from iframe

Web
2

Note that I’m developing with React, and so these problems might not affect developers using a different stack.

I figured out the problem. Either the docs or the React component need to be changed. Actually, either way the docs should be updated since there is something that is misleading and a minor error that will stop people from being able to subscribe to the Avatar Creator's events.

The main problem is here:

image
image900×508 67.9 KB

When you click on the Copy button, it gives you the scheme, the subdomain, the secondary domain, but it’s missing the avatar sub-directory. For example, this is what I get if I click on the Copy button:

https://{actual-subdomain}.readyplayer.me?frameApi

However, the event handlers won’t work without the avatar sub-directory at the end of the URL. So what really should be returned is:

https://{actual-subdomain}.readyplayer.me/avatar?frameApi

Additionally, the AvatarCreator React component, which uses the useAvatarCreatorUrl hook under the hood, is doing this:

export const useAvatarCreatorUrl = (subdomain: string, config: AvatarCreatorConfig | undefined): string => {
  return useMemo(() => {
    let url = `https://${subdomain || `demo`}.readyplayer.me`;
    url += `/avatar?frameApi&source=react-avatar-creator`;

So, you only need a small portion of what was copied from the Developer Dashboard.

I don’t know if there is a situation where what you get from copying that value on the Developer Dasjboard is exactly what you need, but it’s quite confusing since it’s possible to end up with something that seems to be working (except for the event subscription), but which causes a lot of wasted time troubleshooting.

1 Like