How to access another docker volume files with Vue & Laravel?

I am running a Vue & Laravel project on docker.

Project structure and everything about the setup

To start with, I am currently trying to upload images on server.
If I would run this project without docker, it will work as planned (files are being uploaded on server and they are accessible).
However, if I would run this project with docker, it will throw an error (can't find directory).

Important remark: I have a guess that it might be happening because I am working with files on the backend (laravel controller, code is down below). So it can access only backend volume.

It is trying to locate a file at the frontend volume, but it can't access it.
So, here is the question: how to access that volume?

File controller:

    public function uploadFile (Request $request) {
        # Processing to base64
        $exploded = explode(',', $request->image_data);
        $decoded = base64_decode($exploded[1]);

        # Configuring the extension
        $extension = strtok(explode('/', $exploded[0])[1], ';');

        # Defining the path
        $path = '../../'.'frontend'.'/'.'src'.'/'.'assets'.'/'.'img'.'/'.'files'.'/'.$request->file_name;

        # Uploading file to the storage
        file_put_contents($path, $decoded);
    }

Solution

Your path here

$path = '../../'.'frontend'.'/'.'src'.'/'.'assets'.'/'.'img'.'/'.'files'.'/'.$request->file_name;

goes two steps up, then into frontend directory. But there is no such directory in your backend container.

backend:
  volumes:
    - ./backend:/app
    - ./etc/php:/usr/local/etc/php/local.conf.d/

These two last lines mount bakend and etc/php inside the backend container. As you see there is no frontend and so the path you've used on host will not work. Add one more line to fix it:

backend:
  volumes:
    - ./backend:/app
    - ./etc/php:/usr/local/etc/php/local.conf.d/
    - ./frontend:/frontend  # this line

This will make frontend directory appear at /frontend and that should be enough to fix it.