# PostMessage for Saving As

**URL:** <https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913>\
**Category:** Installation & Configuration\
**Created:** [July 25, 2025, 11:46am UTC](https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913 "2025-07-25T11:46:04Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![coolio](https://avatars.discourse-cdn.com/v4/letter/c/94ad74/32.png) [@coolio](https://forum.collaboraonline.com/u/coolio)\
**Post date:** [July 25, 2025, 11:46am UTC](https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913/1 "2025-07-25T11:46:04Z")

</div>

Hello everyone!

I’m trying to work on localhost integration of CODE run via docker, but I faced some problem with using PostMessage.

I have my localhost FastApi WOPI server, and it works perfectly with simple CheckFileInfo or PutFile operations (document is retrieved and saved correctly). However, when I click on “Save As” button, nothing happens in UI (I have “UserCanNotWriteRelative” set to false). I figured out that I need to use PostMessages, so I have .html file with iframe that listens on message events.

The problem is that it doesn’t work correctly, the result is similar to the one described in [this topic](https://forum.collaboraonline.com/t/postmessage-api-not-always-working/3884). If “PostMessageOrigin” is set to “[http://localhost:8888](http://localhost:8888)” (the address of the page where html is running and WOPI server) or any other value, including CODE’s address on localhost, the only AppLoading status I get is “Initialized”. Without PostMessageOrigin I can respond with “Host\_PostmessageReady”.  
After that I get “UI\_SaveAs” message, and I try to post to the same target the following message:

```auto
{
  MessageId: "Action_SaveAs",
  SendTime: Date.now(),
  Values: {
    Filename: "newfilename.xlsx"
  }
}

```

But nothing happens after that, there is no request to WOPI server.

Is it that I send message incorrectly, configuration should be set in some special way, or this workflow can not be implemented on localhost?

Thanks in advance!

---

<div class="post-metadata">

**Author:** ![darshan](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.collaboraonline.com/darshan/32/2230_2.png) [@darshan](https://forum.collaboraonline.com/u/darshan)\
**Post date:** [July 28, 2025, 4:49am UTC](https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913/2 "2025-07-28T04:49:52Z")

</div>

hii @coolio

The core issue (no WOPI request after `Action_SaveAs`) is still **PostMessage origin mismatch** , not the `Notify` flag.

1. `PostMessageOrigin` (WOPI server config): Must be the _exact_ URL of your HTML host page (e.g., `http://localhost:8888`).
2. **`targetOrigin` (your `postMessage` to CODE):** Must be the _exact_ URL of the CODE iframe (e.g., `http://localhost:9980`).

**Explanation:** CODE is rejecting your `Action_SaveAs` message because of security/origin issues, preventing it from even attempting the `PutRelativeFile`. While `Notify: true` is good for getting a save confirmation (`Action_Save_Resp`), it won’t fix this initial communication breakdown.

> **[PostMessage API — SDK https://sdk.collaboraonline.com/ documentation](https://sdk.collaboraonline.com/docs/postmessage_api.html?highlight=action_saveas#action-save)**

Read `Action_SaveAs` carefully and checkout the full working of the postmessage api

Thanks  
Darshan

---

<div class="post-metadata">

**Author:** ![coolio](https://avatars.discourse-cdn.com/v4/letter/c/94ad74/32.png) [@coolio](https://forum.collaboraonline.com/u/coolio)\
**Post date:** [July 28, 2025, 7:50am UTC](https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913/3 "2025-07-28T07:50:06Z")

</div>

Hello!

Thank you for advice!

Unfortunately, it didn’t solve the issue. I added `PostMessageOrigin` again, set it to html template url with local network ip (given by `ip addr`) and opened fastapi app with the same address. I also tried it with `localhost`, too, but with no success - now it doesn’t even send `Host_PostmessageReady` because there is no `Document_Loaded` status.  
Here is .html script code where I tried both using event origin and specific targetOrigin:

```auto
    function post(target, msgId, values) {
        document.querySelector("#collaboraFrame").contentWindow.postMessage({MessageId: msgId, SendTime: Date.now(), ...(values && {Values: values})}, target);
        console.log("hello")
    }

    function postReady(target) {
        post(target, 'Host_PostmessageReady');
    }

    function receiveMessage(event) {
        console.log('==== receiveMessage: ' + JSON.stringify(event.data));
        console.log(event)
        let msg = JSON.parse(event.data || '{}');
        if (!msg) {
            return;
        }
        if (msg?.MessageId == 'App_LoadingStatus') {
            if (msg.Values) {
                console.log("IF WORKED")
                if (msg.Values.Status == 'Document_Loaded') {
                    console.log("POSTING")
                    postReady(e.origin)
                }
            }
        } else if (msg?.MessageId === "UI_InsertGraphic") {
            post({
                MessageId: "Action_InsertGraphic",
                Values: {
                    url: current_graphics
                }
            });
        } else if (msg?.MessageId === 'UI_SaveAs') {
            console.log("SAVEAS")
            post('Action_SaveAs', {
                Filename: "hello.xlsx"
            })

        }
        

        console.log(msg?.MessageId);
    }

```

(Here target filename is hard coded for debugging purposes, initially it was assigned in dialog window)

Again, thank you for response!

---

<div class="post-metadata">

**Author:** ![darshan](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.collaboraonline.com/darshan/32/2230_2.png) [@darshan](https://forum.collaboraonline.com/u/darshan)\
**Post date:** [July 28, 2025, 8:03am UTC](https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913/4 "2025-07-28T08:03:34Z")

</div>

Your script has a critical error in how you’re sending messages back to CODE, which explains why nothing happens and Host\_PostmessageReady isn’t sent. **What’s wrong:**

1. **Incorrect targetOrigin for postMessage:** In your post function, the target parameter is meant for the _origin URL_ of the iframe you’re posting to.

- You are mistakenly passing message IDs like ‘Action\_SaveAs’ directly as the target (origin) for postMessage in calls like post(‘Action\_SaveAs’, {Filename: “hello.xlsx”}). This is wrong.
- **Solution:** You need to pass the _actual URL origin_ of the CODE iframe (e.g., [http://localhost:9980](http://localhost:9980)) as the targetOrigin for _all_ messages you send back to CODE. Capture event.origin when CODE sends you messages and use that consistently.

1. **JSON.parse(event.data || ‘{}’):** CODE messages are usually already JavaScript objects. Parsing them as JSON will cause errors. Remove this line.
2. **App\_LoadingStatus for Host\_PostmessageReady:** CODE typically expects Host\_PostmessageReady after App\_LoadingStatus with Status: ‘Initialized’, not Document\_Loaded.

Fixing these script errors, combined with ensuring your FastApi’s PostMessageOrigin precisely matches your HTML host’s URL, will likely solve your problem.

---

<div class="post-metadata">

**Author:** ![coolio](https://avatars.discourse-cdn.com/v4/letter/c/94ad74/32.png) [@coolio](https://forum.collaboraonline.com/u/coolio)\
**Post date:** [July 28, 2025, 8:44am UTC](https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913/5 "2025-07-28T08:44:08Z")

</div>

At least first code message is not JS object completely, `event.data` is a string, so without `JSON.parse` `if msgId === ...` is not even triggered  
 ![image](https://europe1.discourse-cdn.com/flex013/uploads/collaboraonline/original/2X/7/77448f538689b51f86b35ef22361cc9d19ea5223.png)

I’ve also tried responding to “Initialized” before, it didn’t help.

As for target: tried using `http://192.168.250.47:9980` as well as `https://192.168.250.47:9980`(192.168.250.47 is my LAN-ip, and I use SSC for self-hosted https) as targetOrigin in postMessage, and PostMessageOrigin is set to `"http://192.168.250.47:8888"`

---

<div class="post-metadata">

**Author:** ![darshan](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.collaboraonline.com/darshan/32/2230_2.png) [@darshan](https://forum.collaboraonline.com/u/darshan)\
**Post date:** [July 28, 2025, 9:03am UTC](https://forum.collaboraonline.com/t/postmessage-for-saving-as/3913/6 "2025-07-28T09:03:50Z")

</div>

your `post` call and origin handling are mixed up.

1. Fix your message parsing:

```js
const msg = typeof event.data === 'string'
  ? JSON.parse(event.data)
  : event.data;

```

2. Use the exact `event.origin` you see in the console for all replies. Don’t hard-code or swap it for the message ID.
3. Your `post` signature is `post(targetOrigin, msgId, values)`, but you do:

```js
post('Action_SaveAs', {Filename:…})

```

which treats `'Action_SaveAs'` as the origin. Instead do:

```js
post(event.origin, 'Action_SaveAs', {Filename:'hello.xlsx', Notify:true});

```

4. In your `"App_LoadingStatus"` block you wrote `postReady(e.origin)` but your handler argument is `event`, not `e`. Use `postReady(event.origin)` (or capture it once into a `codeOrigin` variable).

Finally, ensure your FastAPI `PostMessageOrigin` matches that exact origin string (including protocol, IP, port).

@coolio i would highly recommand to explore the SDK examples repository. That might help with your case.

It looks like there is some syntax errors which is causing the issues

> **[GitHub - CollaboraOnline/collabora-online-sdk-examples: Various minor pieces of code to be used in...](https://github.com/CollaboraOnline/collabora-online-sdk-examples)**
>
> Various minor pieces of code to be used in Collabora Online and related software

- Check file collabora-online-sdk-examples/webapp/html/javascripts/wopi.js

axplore above examples where diffrent web app integrations are being done.
