Projects

Chat Bot

Web design / development

Tech: HTML, CSS, JS, PHP, MySQL

Under mit studie på Erhvervsakademiet Aarhus, fik jeg muligheden at udvikle en Chat Bot som et lille projekt. Jeg udviklede den i HTML & CSS og vanilla JS.

Chat Bot

Jeg stod i den situation at jeg som skole projekt skulle komibnere 3 forskellige chat design, sammen med 2 andre i gruppen. Vi startede med at lave en plan for hvordan vi ville gribe det an, og hvordan vi ville fordele arbejdet. Til vores projektstyring benyttede vi Git og Github Projects, for at kunne se hvilken opgaver der ligger i backloggen.

Min rolle i projektet

Jeg stod for at skrive og kode API endpoints til chatten. Jeg har benyttet mig af PHP, til at skrive en REST API som skal sikre at skabe noget funktionalitet, i frontend delen ved hjælp af JS fetch funktionen.

API endpoints

Dissen endpoints til chat funktionalitet fik jeg implementeret:

  • getChat
  • chat
  • getChatHistory

Med disse enpoints skaber jeg til frontend delen en adgang, for at kunne tilgår dataen i Databasen.

Alle endpoints i dette projekt har fået 4 headers som de skal sende med, til clientent.

  1. Content-Type: application/json charset=UTF-8
  2. Access-Control-Allow-Credentials: true
  3. Access-Control-Allow-Methods: GET, POST
  4. Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With, *

Med den første fortæller vi clienten i hviket format den kan regne med. Nummer 2 fortæller at den gerne må med sende cookies og andre nødvendig credentials men primært cookies. Nummer 3 fortæller om hvilken request method API endpoints har adgang til. Den sidste fortæller lige det sammen, så den kan være lidt liggylidgt hvis den nu ikke også vil indeholde Access-Allow-Origin: * som her vigitg for sikkerheden.

Den fortæller nemlig om hvilken andre domains må for adgang til API endpoints. Hvis * er sat så betyder det at vi har sat en wild card som betyder at alle kan tilgår APIén. I en god API vil man sætte hvis muligt en domain som for adgang, eller men sætter en Authorize header med en JWT til verificering og tidsbegænsning.

getChat endpoint

Med denne endpoint kan frontend hente alle svar og spørgesmål fra en specific chat historik.

Frontend deler laver til denne endpoint en POST request som backend og APIen opfanger med hjælp af PHP indbygget funktion file_get_contents.

Den funktion modtager en argument som skal entent være et link eller destination til en fil, eller som i mit eksempel, modtager den som argument "php://input".

Med php://input for jeg direkte adgang til request body i et HTTP POST request, som backenden så kan håndter. I projektet er formatet som frontend sender med POST requesten et JSON objekt som er bestående ud af en chatId.

Med denne chatId kan backenden så finde frem til den rigtige chat historik i databasen, og returnere den som JSON til frontend.