diff --git a/.gitignore b/.gitignore index 40645b5..dff4968 100644 --- a/.gitignore +++ b/.gitignore @@ -37,6 +37,7 @@ npm-debug.log # Ignore all user-generated content (uploads, QR codes, etc.) /priv/static/user_generated/ +/uploads/ # Ignore customized Docker Compose file. docker-compose.yml diff --git a/Dockerfile b/Dockerfile index 71ad5ff..e5d95db 100644 --- a/Dockerfile +++ b/Dockerfile @@ -88,6 +88,10 @@ ENV LC_ALL en_US.UTF-8 WORKDIR "/app" RUN chown nobody /app +# Create data directory for uploads +RUN mkdir -p /data/uploads/images && \ + chown -R nobody:root /data/uploads + # set runner ENV ENV MIX_ENV="prod" diff --git a/config/dev.exs b/config/dev.exs index edcc6ce..263019c 100644 --- a/config/dev.exs +++ b/config/dev.exs @@ -1,6 +1,6 @@ import Config -# Configure your database +# Configure the database config :components_elixir, ComponentsElixir.Repo, username: "postgres", password: "fCnPB8VQdPkhJAD29hq6sZEY", @@ -10,8 +10,12 @@ config :components_elixir, ComponentsElixir.Repo, show_sensitive_data_on_connection_error: true, pool_size: 10 -# For development, we disable any cache and enable -# debugging and code reloading. +# For development work, log all queries +# config :components_elixir, ComponentsElixir.Repo, log: false + +# For development, use a local uploads directory +config :components_elixir, + uploads_dir: "./uploads" # # The watchers configuration can be used to run external # watchers to your application. For example, we can use it diff --git a/config/runtime.exs b/config/runtime.exs index 840405b..01d08b4 100644 --- a/config/runtime.exs +++ b/config/runtime.exs @@ -1,5 +1,9 @@ import Config +# Runtime configuration for uploads directory +config :components_elixir, + uploads_dir: System.get_env("UPLOADS_DIR", "./uploads") + # config/runtime.exs is executed for all environments, including # during releases. It is executed after compilation and before the # system starts, so it is typically used to load production configuration diff --git a/docker-compose.yml.example b/docker-compose.yml.example index e88888e..6fb44b0 100644 --- a/docker-compose.yml.example +++ b/docker-compose.yml.example @@ -25,9 +25,12 @@ services: PHX_HOST: "localhost" PHX_SERVER: "true" PORT: "4000" + UPLOADS_DIR: "/data/uploads" depends_on: db: condition: service_healthy + volumes: + - uploaded_files:/data/uploads command: [ "/bin/sh", @@ -37,3 +40,4 @@ services: volumes: postgres_data: + uploaded_files: diff --git a/lib/components_elixir_web/controllers/file_controller.ex b/lib/components_elixir_web/controllers/file_controller.ex new file mode 100644 index 0000000..450bfe5 --- /dev/null +++ b/lib/components_elixir_web/controllers/file_controller.ex @@ -0,0 +1,40 @@ +defmodule ComponentsElixirWeb.FileController do + use ComponentsElixirWeb, :controller + + def show(conn, %{"filename" => filename}) do + # Security: only allow alphanumeric, dashes, underscores, and dots + if String.match?(filename, ~r/^[a-zA-Z0-9_\-\.]+$/) do + uploads_dir = Application.get_env(:components_elixir, :uploads_dir) + file_path = Path.join([uploads_dir, "images", filename]) + + if File.exists?(file_path) do + # Get the file's MIME type + mime_type = get_mime_type(filename) + + conn + |> put_resp_content_type(mime_type) + |> put_resp_header("cache-control", "public, max-age=86400") # Cache for 1 day + |> send_file(200, file_path) + else + conn + |> put_status(:not_found) + |> text("File not found") + end + else + conn + |> put_status(:bad_request) + |> text("Invalid filename") + end + end + + defp get_mime_type(filename) do + case Path.extname(filename) |> String.downcase() do + ".jpg" -> "image/jpeg" + ".jpeg" -> "image/jpeg" + ".png" -> "image/png" + ".gif" -> "image/gif" + ".webp" -> "image/webp" + _ -> "application/octet-stream" + end + end +end diff --git a/lib/components_elixir_web/live/components_live.ex b/lib/components_elixir_web/live/components_live.ex index d5d4022..2ce8949 100644 --- a/lib/components_elixir_web/live/components_live.ex +++ b/lib/components_elixir_web/live/components_live.ex @@ -614,7 +614,7 @@ defmodule ComponentsElixirWeb.ComponentsLive do <%= if @editing_component && @editing_component.image_filename do %>

Current image:

- Current component + Current component
<% end %>
@@ -680,8 +680,8 @@ defmodule ComponentsElixirWeb.ComponentsLive do
<%= if component.image_filename do %> - <% else %>
@@ -867,33 +867,61 @@ defmodule ComponentsElixirWeb.ComponentsLive do # Helper functions for image upload handling defp save_uploaded_image(socket, component_params) do + IO.puts("=== DEBUG: Starting save_uploaded_image ===") + IO.inspect(socket.assigns.uploads.image.entries, label: "Upload entries") + uploaded_files = consume_uploaded_entries(socket, :image, fn %{path: path}, entry -> filename = "#{System.unique_integer([:positive])}_#{entry.client_name}" - dest = Path.join(["priv", "static", "user_generated", "uploads", "images", filename]) + uploads_dir = Application.get_env(:components_elixir, :uploads_dir) + upload_dir = Path.join([uploads_dir, "images"]) + dest = Path.join(upload_dir, filename) + + IO.puts("=== DEBUG: Processing upload ===") + IO.puts("Filename: #{filename}") + IO.puts("Upload dir: #{upload_dir}") + IO.puts("Destination: #{dest}") # Ensure the upload directory exists - File.mkdir_p!(Path.dirname(dest)) + File.mkdir_p!(upload_dir) # Copy the file case File.cp(path, dest) do - :ok -> filename - {:error, _reason} -> nil + :ok -> + IO.puts("=== DEBUG: File copy successful ===") + {:ok, filename} + {:error, reason} -> + IO.puts("=== DEBUG: File copy failed: #{inspect(reason)} ===") + {:postpone, {:error, reason}} end end) - case uploaded_files do - [filename] when is_binary(filename) -> Map.put(component_params, "image_filename", filename) - [] -> component_params - _error -> component_params + IO.inspect(uploaded_files, label: "Uploaded files result") + + result = case uploaded_files do + [filename] when is_binary(filename) -> + IO.puts("=== DEBUG: Adding filename to params: #{filename} ===") + Map.put(component_params, "image_filename", filename) + [] -> + IO.puts("=== DEBUG: No files uploaded ===") + component_params + _error -> + IO.puts("=== DEBUG: Upload error ===") + IO.inspect(uploaded_files, label: "Unexpected upload result") + component_params end + + IO.inspect(result, label: "Final component_params") + IO.puts("=== DEBUG: End save_uploaded_image ===") + result end defp delete_image_file(nil), do: :ok defp delete_image_file(""), do: :ok defp delete_image_file(filename) do - path = Path.join(["priv", "static", "user_generated", "uploads", "images", filename]) + uploads_dir = Application.get_env(:components_elixir, :uploads_dir) + path = Path.join([uploads_dir, "images", filename]) File.rm(path) end diff --git a/lib/components_elixir_web/router.ex b/lib/components_elixir_web/router.ex index 638fe6a..ea7b9a0 100644 --- a/lib/components_elixir_web/router.ex +++ b/lib/components_elixir_web/router.ex @@ -24,6 +24,9 @@ defmodule ComponentsElixirWeb.Router do live "/login", LoginLive, :index get "/login/authenticate", AuthController, :authenticate post "/logout", AuthController, :logout + + # File serving endpoint + get "/uploads/images/:filename", FileController, :show end scope "/", ComponentsElixirWeb do