Media in a bluesky post blank after successful media upload and post endpoint

[mikey186]

I was trying out Bluesky's API via/ATProtocol as shown on this offical blog post and tried a technique on Make. I had tried the ablity to upload a media using the content type multipart/form-data , that went through successfully, and had sent a POST request to Bluesky to make a post a stated in their blog post, and it did went through successfully.

But when I took a look at the post in the app, there was one problem...the text is there, but the media.....it's missing.

Any idea what I did wrong? looking at the body of the request, there was only one parameter called data assumingly that's the parameter just to upload. I noticed in one post, it did say there's a uploadBlob or createBlob, but I can't find createBlob anywhere on the blog post. Is there a actual chunked upload around here rather than a one time upload?

[DavidBuchanan314]

It would be useful if you could share the precise requests you made, either through code or some kind of request log (make sure to exclude credentials or auth tokens though!) - and ideally, link to the post that has the problem.

You can retrieve the blob back from the PDS, to inspect it, via a GET request to https://bsky.social/xrpc/com.atproto.sync.getBlob?did=<did>&cid=<cid>, where <did> is your user did, and <cid> matches the value of the $link field in the post record that references the blob.

All being well, you should expect that to return your image directly, with an image-shaped content-type. Assuming it doesn't, that might be a clue as to what went wrong.

There is no alternative to uploadBlob, but I think should Just Work work with Transfer-Encoding: chunked since that's a transparent part of HTTP - but not 100% sure on that since I haven't tested.

[mikey186]

Ok, so on make, here's how I put together all this. Keep in mind, if you're not familiar with Make (formally Integromat), this is just a custom app I put together, as there's no official Bluesky or ATProtocol app at this point.

Module 1:
I used the Login info at stated on this blog post. I had correctly input the username (my handle), and my password (which is app password), it had successfully came out as this:

{
    "did": "did:plc:n55enlsbnc3euajfvxevjtr6",
    "handle": "sailormikey.bsky.social",
    "email": "[REDACTED]",
    "emailConfirmed": false,
    "accessJwt": "[REDACTED]",
    "refreshJwt": "[REDACTED]"
}

Module 2:
I grabbed a test image I want to use for upload, as the blog post states that at this time, the limit for any media is 1MB (I do hope it'll increase to 5MB). The file in choice I want to use is this.
http://art-train.elementfx.com/assets/test_image.png

Module 3:
Now, this is the next part of the custom app. As stated in the blog post, I need to upload a image (or a blob as they referred to it), now it didn't state what Content-Type to use for the request, so I would assume it's multipart/form-data. The URL used was https://bsky.social/xrpc/com.atproto.repo.uploadBlob I had Make download the file and upload it to this point, with the request parameters:

HEADER:

{
    "user-agent": "Make/production",
    "content-type": "image/png",
    "authorization": "Bearer [REDACTED]"
}

BODY:

{data: [file upload]}

and the response came out as this:

{
    "blob": {
        "$type": "blob",
        "ref": {
            "$link": "bafkreieeiba5xic4h4yjyjtfzlttv3ugrzpqcvdmpy4emyr6wg3d5n7wsy"
        },
        "mimeType": "image/png",
        "size": 85732
    }
}

Module 4:
Once everything is in place, I had use the JSON to format everything together (including ALT text, and status) for the next module and it had came out as this

{
  "repo": "did:plc:n55enlsbnc3euajfvxevjtr6",
  "record": {
    "text": "Test Media",
    "$type": "app.bsky.feed.post",
    "embed": {
      "$type": "app.bsky.embed.images",
      "images": [
        {
          "alt": "test image",
          "image": {
            "ref": {
              "$link": "bafkreieeiba5xic4h4yjyjtfzlttv3ugrzpqcvdmpy4emyr6wg3d5n7wsy"
            },
            "size": 85732,
            "$type": "blob",
            "mimeType": "image/png"
          }
        }
      ]
    },
    "createdAt": "2023-09-28T08:41:46.190Z"
  },
  "collection": "app.bsky.feed.post"
}

Module 5:
And now finally, I used the HTTP Module for post, and I used the same Bearrer Token, and put all the JSON into the body, it returned a success 200 code with the response

{
"uri": "at://did:plc:n55enlsbnc3euajfvxevjtr6/app.bsky.feed.post/3kagvyxtiqr2a",
"cid": "bafyreidzytj6lojgmyp5adp2kaniu5w75n5ikvketeicpmjs2cgiec4wai"
}

That's all I did so far and when I checked to look at it, the status is there, but the media is missing.

[DavidBuchanan314]

You're probably gonna want to redact those accessJwt refreshJwt and authorization fields!

[DavidBuchanan314]

I think your issue lies in {data: [file upload]} - you want to be uploading the raw file data directly, not wrapped in JSON or anything else.

[mikey186]

How would I do that? Unfortunately the way how Make process things when uploading raw files go something like this.

"data": {
	"value": "{{parameters.file_data}}",            
	"options": {                
		"filename": "{{parameters.file_name}}"            
	}        
}

In a way what's it doing is getting the output HTTP (the image buffer; the raw image), and putting it into the request.

I even tried using Postman one time with the same thing using Content-Type twice in the header. One for multipart/form-data, the other for image/png, that didn't work either.

[mikevdberge]

I had the same issue. When I added the "type": "binary" to the uploadBlob request it started working

	// Upload image to Bluesky
	{
		"url": "/com.atproto.repo.uploadBlob",  // Relative to base URL	
		"method": "POST",
		"headers": {
			"Content-Type": "{{parameters.contenttype}}",
			"content-length": "{{parameters.filesize}}"
    	},
		"body": "{{parameters.image}}",
		"type": "binary",
		// Response handling
		"response": {
			"output": "{{body}}"                // Return JSON response body as an output bundle.
		}
	}

[pixelhustler]

Hi Mike... This was helpful though I am still struggling with this same issue, could you please share your code to make the post with the image?