Uploading and reading a file from UI

  1. I wanna create folders and upload files. I tried https://docs.nextcloud.com/server/latest/developer_manual/client_apis/WebDAV/basic.html#uploading-files via curl and it works. But in Vue component, I wonder about the security. If I use axios, I need to provide username and password.
  2. I wanna select a file of current user and read its content. First, I use @nextcloud/dialogs to have a file picker. Then, I have no idea to do. I did some researches and got this: Nextcloud filesystem API — Nextcloud latest Developer Manual latest documentation. But getFileContent takes an $id which I dont even know. All I know is the absolute file path.

I also dont know if axios supports MKCOL requests.

I think you are following the wrong approach. I am not sure what your use-case is. Is there a reason why you intend to use the frontend to alter the file system? Yo can do this better in the backend.

I apologize for the misunderstanding of the information. Please let me clarify. Through the documents above, I can see that there are APIs for both creating and reading a file. For calling those APIs, I need to use @nextcloud/axios, am I correct?

I see two options:

  • Usage of WebDAV and @nextcloud/axios. This might work but I have no experience. You have to handle all stuff through WebDAV.
  • Define the corresponding action in your backend and provide controller methods for calling them. Then, you can for sure use @nextcloud/axios and avoid WebDAV and can define your own (problem-tailored) API.

I tried some request like PUT, DELETE by using curl and it works, so this might work with @nextcloud/axios since I used the same way to call API in Controller. But WebDAV does not provide API to read a file.

This link:Nextcloud filesystem API — Nextcloud latest Developer Manual latest documentation guides how to read a file from the backend. But the function getFileContent needs an $id. I don’t know how to get that ID. I just have an absolute path.

Adopting the example, you can do this (untested, might be buggy but to get the idea):

use OCP\Files\IRootFolder;

class FileReadingExample {

    private IRootFolder $storage;
    private string $userId;

    public function __construct(IRootFolder $storage, $userId){
        $this->storage = $storage;
        $this->userId = $userId;

    public function getFileContent() {

        // Gte the user personal root folder (as you see in the files app)
        $userFolder = $this->storage->getUserFolder($this->userId);

        // check if file exists and read from it if possible
        try {
            // Set the filename to look for
            $filename = "path/to/look/for/file.md";
            // Query the NC server for the actual file object
            $file = $userFolder->get($filename);
            if ($file instanceof \OCP\Files\File) {
                return $file->getContent();
            } else {
                throw new StorageException('Can not read from folder');
        } catch(\OCP\Files\NotFoundException $e) {
            throw new StorageException('File does not exist');
1 Like

Through your code, I think getFileContent should not take any params.

Yeah, sorry, as I wrote, this is just plainly wrtten here not tested or stuff…

I’m not sure if the get(...) method is exist. Is there any way to access OCP\Files\IRootFolder to check the code? ;-;

Yes, for sure there is. The server is in fact open source.

Your interface for IRootFolder is defined here and returns \OCP\Files\Folder. A Folder itself has a get method which returns a Node (either folder or file) or throws an exception.

The actual implementation can be found in the private part of the server and here. However this is not of much interest unless you want to understand the internal mechanics or provide PRs against the server.

I hope this helps!

Hi Chris. I’ve just read a file successfully by using PHP. Thanks for your help! :smiling_face:

1 Like