diff --git a/docker-compose.yaml b/docker-compose.yaml
index 1e35da2f9878231cf611f58dbb3686f49b7b4d83..629c548b5492cd2aaa71a286b7158e02824a023b 100644
--- a/docker-compose.yaml
+++ b/docker-compose.yaml
@@ -15,6 +15,8 @@ services:
     restart: always
     ports: 
       - 3308:3307
+    expose:
+      - 3307
     hostname: tubes-php-db
     env_file: .env
     volumes:
diff --git a/src/app/controllers/episode/post_play_episode.php b/src/app/controllers/episode/post_play_episode.php
new file mode 100644
index 0000000000000000000000000000000000000000..f21f6d8510396ceeb4af08ffb60a8be398dab569
--- /dev/null
+++ b/src/app/controllers/episode/post_play_episode.php
@@ -0,0 +1,31 @@
+<?php
+
+class PostPlayEpisodeController
+{
+  public function call()
+  {
+    session_start();
+    if (!isset($_SESSION["user_id"])) {
+      http_response_code(403);
+      header("Content-Type: application/json");
+      echo json_encode(["message" => "unauthorized"]);
+
+      return;
+    }
+
+    // Check for podcast id
+    if (!isset($_POST["idEpisode"])) {
+      http_response_code(400);
+      header("Content-Type: application/json");
+      echo json_encode(["message" => "missing episode id"]);
+
+      return;
+    }
+
+    $_SESSION["eps_id"] = $_POST["idEpisode"];
+
+    http_response_code(200);
+    header("Content-Type: application/json");
+    echo json_encode(["message" => "success"]);
+  }
+}
diff --git a/src/app/core/app.php b/src/app/core/app.php
index 84324758f190492eb357f91e9147ebab99974514..af5ac7be67dadb8bc121d89b74ccc0d380c67dc8 100644
--- a/src/app/core/app.php
+++ b/src/app/core/app.php
@@ -28,6 +28,7 @@ class App
     $router->delete("public/dashboard/podcast", new DeletePodcastController());
 
     $router->get("public/podcast", new GetPodcastPageController());
+    $router->post("public/episode/play", new PostPlayEpisodeController());
 
     $router->post("public/logout", new LogoutController());
 
diff --git a/src/app/init.php b/src/app/init.php
index a984ef3b9c391d1bf4ebff7fd6a1e7c0ae97011d..3ad64894dff473e13461768a6c246c5da5812c0f 100644
--- a/src/app/init.php
+++ b/src/app/init.php
@@ -22,6 +22,7 @@ require_once __DIR__ . "/controllers/dashboard/post_edit_podcast.php";
 require_once __DIR__ . "/controllers/dashboard/delete_podcast.php";
 
 require_once __DIR__ . "/controllers/podcast/get_page.php";
+require_once __DIR__ . "/controllers/episode/post_play_episode.php";
 
 require_once __DIR__ . "/controllers/logout/logout.php";
 
diff --git a/src/public/javascript/podcast/script.js b/src/public/javascript/podcast/script.js
index b1dd6defd8e22f8a8f396a15231d0703892d4203..ba2295050a34df18f21476d295837096890ed67d 100644
--- a/src/public/javascript/podcast/script.js
+++ b/src/public/javascript/podcast/script.js
@@ -2,16 +2,27 @@
 
 // Get DOM elements
 const playButtonsEl = document.querySelectorAll(".play-button");
-const addLibraryButtonEl = document.getElementById("add-library-btn")
-const libraryChoicesEl = document.getElementById("library-choices")
-const overlayEl = document.getElementById("overlay-library")
+const addLibraryButtonEl = document.getElementById("add-library-btn");
+const libraryChoicesEl = document.getElementById("library-choices");
+const overlayEl = document.getElementById("overlay-library");
 
 // Handle play episode
 Array.from(playButtonsEl).forEach((el) => {
   el.addEventListener("click", (e) => {
     e.preventDefault();
 
-    console.log(`play episode id: ${el.dataset.id}`);
+    const formData = new FormData();
+    formData.append("idEpisode", el.dataset.id);
+
+    const xhr = new XMLHttpRequest();
+    xhr.open("POST", "/public/episode/play");
+
+    xhr.onreadystatechange = () => {
+      if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
+      }
+    };
+
+    xhr.send(formData);
   });
 });