Skip to content

Latest commit

 

History

History
119 lines (88 loc) · 3.79 KB

read-and-write-data-in-web-app-relying-on-solid-authentication-browser-extension.md

File metadata and controls

119 lines (88 loc) · 3.79 KB

Read and write data in Web app relying on Solid authentication browser extension

The corresponding challenge is #102.

Problem

The goal of this browser extension is that requests are automatically authenticated when needed. Using this we can show that a Web app can be created that reads data from and stores data in a protected resources in a pod without the need for including Solid authentication in the Web app.

Approved solution

We developed a Web app that allows users to edit Markdown files using only GET and PUT requests. It has the following features:

  • Load Markdown files via GET requests.
  • Store Markdown files via PUT requests.
  • Show WebID of user if user has logged in with the Solid Authentication browser extension.
  • WebID and browser extension are not needed when working with public resources.
  • Show urls of most recent files. The urls are stored in the browser storage.

You find a live version of the app here and a screencast of the app here.

We made the following important technological decisions and assumptions:

  • The tool relies on the Solid authentication browser extension for requests that required authentication. No fallback is provided for when the extension is not installed.
  • The user knows where a new resource should be stored on the pod. They manually provide the full URL of the resource in a text-field.

User flow

Actors/actresses

  • Menubar app
  • User of the application

Preconditions

  • The user has Node.js installed.
  • The user has this version of the Solid authentication browser extension installed.
  • The user has a WebID and pod. You can create both for testing via the Pod Playground of SolidLab.
  • The user has logged in with their WebID in the browser extension.

Steps

  1. Clone the repo of the app via

    git clone https://github.com/SolidLabResearch/markdown-editor.git
  2. Install the dependencies via

    npm i
  3. Start the server via

    npm start
  4. Open Firefox and browse to http://localhost:8080/.

  5. In the text field at the top enter the URL for a new Markdown resource on your pod.

  6. Edit the Markdown file.

  7. The app automatically saves your changes.

Postconditions

  • Open the resource in a new tab in your browser. You don't need the app to see its content. Note that the Community Solid Server will not show the Markdown file directly, but a rendered HTML version instead.

Follow-up actions

None.

Future work

None.