Rocket chat Iframe auth using token in React

Question

I'm building an app where I want to use Rocket chat for chatting purpose. I've deployed Rocket chat in DigitalOcean droplet from Market. I'm trying to use Rocket chat's login with token feature, but getting login page all the time. My React code:

const ChatComponent: React.FC = (token) => {
    const iframeUrl = 'http://111.111.111.111:3000/channel/general';
    const init = () => {
        const iframe = document.getElementById('rocketchat-iframe') as HTMLIFrameElement;
        iframe.contentWindow?.postMessage({
            externalCommand: 'login-with-token',
            loginToken: token
        }, '*');
    }
    return (
        <>
            <iframe
                title="Rocket.Chat"
                src={iframeUrl}
                id="rocketchat-iframe"
                width="100%"
                height="500"
                style={{ border: 'none', overflow: 'hidden' }}
                onLoad={init}
            />
        </>
    );
};

export default ChatComponent;

After sign-in everything works fine. I want to skip sign-in page and authenticate user with token generated by Rocket chat SDK. PS: I left blank Iframe URL and Api URL blank in Rocket chat settings.

Answer 1

In the Rocket.Chat Documentation I found this:

<script>
window.parent.postMessage({
  event: 'login-with-token',
  loginToken: 'your-token'
}, 'http://your.rocket.chat.url');
</script>

There it is called event instead of your externalCommand