Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

Multipart Upload on REST API

default discord avatar
jacko49last year
5

Hey,



Haven't been able to find a definitive answer to an issue i'm facing. Trying to create a document with text fields and an image selected via expo-image-picker



formData.append('_payload', JSON.stringify({
          type: data.type,
          submitted_by: {
            name: `${data.firstName} ${data.lastName}`,
            email: data.email,
            phone_number: data.phone,
            organization: data.organization,
          },
          bulletin_post: {
            title: data.title,
            description: await plainTextToLexicalState(data.description),
            event_date: new Date(data.event_date),
            category: 'events',
            resource_items: [
              {
                title: "Link",
                url: data.link,
              }
            ],
            cover_image: data.cover_image.uri,
          },
        }));

const response = await fetch(`${API_URL}/api/community-submissions`, {
          method: 'POST',
          body: formData,
        });


I found the _payload trick on reddit but I guess I am just wondering where I should include my image uri, as the document creates successfully but the cover_image field is empty.



Any help is appreciated!

  • default discord avatar
    aestrrolast year

    So, the only way I've been able to make this work on both web and react native is to first upload the asset into the media collection, grab the returned doc.id and use that id to save to the collection - like

    cover_image = returned.doc.id
  • default discord avatar
    jacko49last year
    @798757536434094091

    Will give this a try! thank you 🙏



    worked like a charm thanks again

    @798757536434094091
  • default discord avatar
    sign0retlast year

    Hello, I am trying to do this but with rest api , the creating of the media works, but in order to add the relation of this, payload on there docs say it should be on the form of the first image, but when I do body: JSON.stringify({


    fotos: {


    relationTo: "media",


    value: idMedia,


    },


    }), It says there is an issue with fotos, but when I try to update title or other fields that are not of type relationship, it do uploads correctly, also the value idMedia is correct, I validated through console.log, What am I doing wrong? Thanks 😉

  • default discord avatar
    aestrrolast year

    So everything in the body gets updated with the exception of the relation data?



    clarifying questions:



    1. Is

    fotos

    a has many relationship to media? or has one?


    2. can you share what your

    fotos

    field looks like?



    If you aren't in a place to answer that now, my suggestion is to review these 2 areas:



    https://payloadcms.com/docs/fields/relationship#has-many

    # in this example you would gather your ids and send in an array of IDs.
    # note: assuming you want this because of the word fotos (plural)
    
    // field relation data
    {
      name: 'fotos', // required
      type: 'relationship', // required
      relationTo: 'media', // required
      hasMany: true,
    }
    // body data
    {
      "owners": [
        "6031ac9e1289176380734024",
        "602c3c327b811235943ee12b"
      ]
    }

    https://payloadcms.com/docs/fields/relationship#has-one-polymorphic

    # in this example (has one - polymorphic) you must configure the field as documented
    {
      ...
      name: 'fotos', // required
      type: 'relationship', // required
      relationTo: ['media', 'something else?'], // required
      ...
    }

    I'm just not sure which you are trying to do?

    @987225362595454976
  • default discord avatar
    sign0retlast year

    Yes this is exactly what I needed, the part A. Thank you very very much 😉

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.