How to use foreign key to add data to my database in React

I'm using React to send data to my PostgreSQL database using NodeJS. I have a foreign key (id) in my songs as well as my image that references to the album id for my title, date, and description. I'm using a uuid for my id in my album table. My question is how does my songs and image file table know that it was that album id on that page that was created with the songs and image?

Here's the page with the album(title, description, date) which gets saved its own table, the list of songs which gets saved in its own table and the image which gets saved in its own table. Both image and songs table have a album_id which references to the album's id:

Album

const addAlbum = (request, response) => {
  const { title, date, description, id } = request.body;
  const uuid = uuidv4();

for (let i = 0; i < request.body.length; i++) {
  db.pool.query('INSERT INTO albums (title, date, description, id) VALUES ($1, $2, $3, $4) ON CONFLICT (id) DO NOTHING RETURNING *' , [request.body[i].title, request.body[i].date, request.body[i].description, uuid], (error, results) => {
    if (error) {
      throw error
    } else {
      console.log('INSERT ' + JSON.stringify(request.body));
    }
  })
}
}

Songs

 const upsertSong = (request, response) => {
    const { id } = request.body;
    const uuid = uuidv4();
    for (var i = 0; i < request.body.length; i++) {
    let insertQuery = {};
    const object = request.body[i];
    let params = [uuid, object.name, object.link, object.index, object.album_id];
    insertQuery.text = 'INSERT INTO songs (id, name, link, index, album_id) VALUES ($1, $2, $3, $4, $5) ON CONFLICT DO NOTHING RETURNING *';
    insertQuery.values = params;

    (async () => {

       await pool.query ('UPDATE songs SET name = $1, link = $2, index = $3, album_id = $4 WHERE id = $5 AND index = $3',
        [request.body[i].name, request.body[i].link, request.body[i].index, request.body[i].album_id, id], (err, result) => {
          try {
            if (err) throw err;
            if (result.rowCount > 0){
               console.log ('UPDATE Rows affected: ', result.rowCount);
               return;
             } else {
               pool.query(insertQuery, (error, res) =>{
               try {
                 if (error) throw error;
                 console.log ('INSERT Rows affected:', res.rowCount);
               }catch(er){
                 console.log("Error")
                 console.log(er);
                }
              });
            }
           } catch (e){
             console.log("Error 2")
             console.log(e);
            }
       });
      })().catch(e => console.log("Error 3" + e));
    }
    }

index.js

app.post('/albums/:id/songs', db.upsertSong)
app.post('/albums/', album.addAlbum)
app.put('/songs/:id', db.upsertSong)
app.post('/albums/:id/upload', image.upsertImage);
app.put('/albums/:id/upload', image.upsertImage);

The album info and songs info get inserted on the same save button in React but how does the song know that the album_id is from that album id on the same page?