Support for non-serializable component parameters

CHANGELOG.md

@@ -22,7 +22,9 @@ Using the following categories, list your changes in this order:
 
 ## [Unreleased]
 
--   Nothing (yet)
+### Security
+
+-   Fixed a potential method of component argument spoofing
 
 ## [2.2.1] - 2022-01-09
 

pyproject.toml

@@ -12,6 +12,9 @@ line_length = 88
 lines_after_imports = 2
 
 [tool.mypy]
+exclude = [
+    'migrations/.*',
+]
 ignore_missing_imports = true
 warn_unused_configs = true
 warn_redundant_casts = true

requirements/pkg-deps.txt

@@ -1,4 +1,5 @@
 channels >=4.0.0
-idom >=0.40.2, <0.41.0
+idom >=0.43.0, <0.44.0
 aiofile >=3.0
+dill >=0.3.5
 typing_extensions

src/django_idom/config.py

@@ -17,10 +17,10 @@
     "IDOM_WEBSOCKET_URL",
     "idom/",
 )
-IDOM_WS_MAX_RECONNECT_TIMEOUT = getattr(
+IDOM_MAX_RECONNECT_TIMEOUT = getattr(
     settings,
-    "IDOM_WS_MAX_RECONNECT_TIMEOUT",
-    604800,
+    "IDOM_MAX_RECONNECT_TIMEOUT",
+    259200,  # Default to 3 days
 )
 IDOM_CACHE: BaseCache = (
     caches["idom"]

src/django_idom/hooks.py

@@ -45,7 +45,9 @@ def use_location() -> Location:
     # TODO: Use the browser's current page, rather than the WS route
     scope = use_scope()
     search = scope["query_string"].decode()
-    return Location(scope["path"], f"?{search}" if search else "")
+    return Location(
+        scope["path"], f"?{search}" if (search and (search != "undefined")) else ""
+    )
 
 
 def use_origin() -> str | None:

src/django_idom/migrations/0001_initial.py

@@ -0,0 +1,26 @@
+# Generated by Django 4.1.3 on 2023-01-10 00:54
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = []
+
+    operations = [
+        migrations.CreateModel(
+            name="ComponentParams",
+            fields=[
+                (
+                    "uuid",
+                    models.UUIDField(
+                        editable=False, primary_key=True, serialize=False, unique=True
+                    ),
+                ),
+                ("data", models.BinaryField()),
+                ("created_at", models.DateTimeField(auto_now_add=True)),
+            ],
+        ),
+    ]

src/django_idom/models.py

@@ -0,0 +1,7 @@
+from django.db import models
+
+
+class ComponentParams(models.Model):
+    uuid = models.UUIDField(primary_key=True, editable=False, unique=True)  # type: ignore
+    data = models.BinaryField(editable=False)  # type: ignore
+    created_at = models.DateTimeField(auto_now_add=True, editable=False)  # type: ignore

src/django_idom/templates/idom/component.html

@@ -2,13 +2,12 @@
 <div id="{{ idom_mount_uuid }}" class="{{ class }}"></div>
 <script type="module" crossorigin="anonymous">
   import { mountViewToElement } from "{% static 'django_idom/client.js' %}";
-  const mountPoint = document.getElementById("{{ idom_mount_uuid }}");
+  const mountElement = document.getElementById("{{ idom_mount_uuid }}");
   mountViewToElement(
-    mountPoint,
+    mountElement,
     "{{ idom_websocket_url }}",
     "{{ idom_web_modules_url }}",
     "{{ idom_ws_max_reconnect_timeout }}",
-    "{{ idom_component_id }}",
-    "{{ idom_component_params }}"
+    "{{ idom_component_path }}",
   );
 </script>

src/django_idom/templatetags/idom.py

@@ -1,28 +1,29 @@
-import json
-from typing import Any
-from urllib.parse import urlencode
 from uuid import uuid4
 
+import dill as pickle
 from django import template
 from django.urls import reverse
 
-from django_idom.config import IDOM_WEBSOCKET_URL, IDOM_WS_MAX_RECONNECT_TIMEOUT
-from django_idom.utils import _register_component
+from django_idom import models
+from django_idom.config import IDOM_MAX_RECONNECT_TIMEOUT, IDOM_WEBSOCKET_URL
+from django_idom.types import ComponentParamData
+from django_idom.utils import _register_component, func_has_params
 
 
 IDOM_WEB_MODULES_URL = reverse("idom:web_modules", args=["x"])[:-1][1:]
 register = template.Library()
 
 
 @register.inclusion_tag("idom/component.html")
-def component(dotted_path: str, **kwargs: Any):
+def component(dotted_path: str, *args, **kwargs):
     """This tag is used to embed an existing IDOM component into your HTML template.
 
     Args:
         dotted_path: The dotted path to the component to render.
+        *args: The positional arguments to provide to the component.
 
     Keyword Args:
-        **kwargs: The keyword arguments to pass to the component.
+        **kwargs: The keyword arguments to provide to the component.
 
     Example ::
 
@@ -34,17 +35,23 @@ def component(dotted_path: str, **kwargs: Any):
         </body>
         </html>
     """
-    _register_component(dotted_path)
-
+    component = _register_component(dotted_path)
+    uuid = uuid4().hex
     class_ = kwargs.pop("class", "")
-    json_kwargs = json.dumps(kwargs, separators=(",", ":"))
+
+    # Store the component's args/kwargs in the database if needed
+    # This will be fetched by the websocket consumer later
+    if func_has_params(component):
+        params = ComponentParamData(args, kwargs)
+        model = models.ComponentParams(uuid=uuid, data=pickle.dumps(params))
+        model.full_clean()
+        model.save()
 
     return {
         "class": class_,
         "idom_websocket_url": IDOM_WEBSOCKET_URL,
         "idom_web_modules_url": IDOM_WEB_MODULES_URL,
-        "idom_ws_max_reconnect_timeout": IDOM_WS_MAX_RECONNECT_TIMEOUT,
-        "idom_mount_uuid": uuid4().hex,
-        "idom_component_id": dotted_path,
-        "idom_component_params": urlencode({"kwargs": json_kwargs}),
+        "idom_ws_max_reconnect_timeout": IDOM_MAX_RECONNECT_TIMEOUT,
+        "idom_mount_uuid": uuid,
+        "idom_component_path": f"{dotted_path}/{uuid}",
     }

src/django_idom/types.py

@@ -35,7 +35,7 @@ class IdomWebsocket:
     scope: dict
     close: Callable[[Optional[int]], Awaitable[None]]
     disconnect: Callable[[int], Awaitable[None]]
-    view_id: str
+    dotted_path: str
 
 
 @dataclass
@@ -89,3 +89,12 @@ class QueryOptions:
 
     postprocessor_kwargs: dict[str, Any] = field(default_factory=lambda: {})
     """Keyworded arguments directly passed into the `postprocessor` for configuration."""
+
+
+@dataclass
+class ComponentParamData:
+    """Container used for serializing component parameters.
+    This dataclass is pickled & stored in the database, then unpickled when needed."""
+
+    args: tuple
+    kwargs: dict

src/django_idom/utils.py

@@ -1,6 +1,7 @@
 from __future__ import annotations
 
 import contextlib
+import inspect
 import logging
 import os
 import re
@@ -74,14 +75,15 @@ async def render_view(
     return response
 
 
-def _register_component(dotted_path: str) -> None:
+def _register_component(dotted_path: str) -> Callable:
     from django_idom.config import IDOM_REGISTERED_COMPONENTS
 
     if dotted_path in IDOM_REGISTERED_COMPONENTS:
-        return
+        return IDOM_REGISTERED_COMPONENTS[dotted_path]
 
     IDOM_REGISTERED_COMPONENTS[dotted_path] = _import_dotted_path(dotted_path)
     _logger.debug("IDOM has registered component %s", dotted_path)
+    return IDOM_REGISTERED_COMPONENTS[dotted_path]
 
 
 def _import_dotted_path(dotted_path: str) -> Callable:
@@ -257,3 +259,8 @@ def django_query_postprocessor(
         )
 
     return data
+
+
+def func_has_params(func: Callable) -> bool:
+    """Checks if a function has any args or kwarg parameters."""
+    return str(inspect.signature(func)) != "()"

src/django_idom/websocket/consumer.py

@@ -1,10 +1,9 @@
 """Anything used to construct a websocket endpoint"""
 import asyncio
-import json
 import logging
 from typing import Any
-from urllib.parse import parse_qsl
 
+import dill as pickle
 from channels.auth import login
 from channels.db import database_sync_to_async as convert_to_async
 from channels.generic.websocket import AsyncJsonWebsocketConsumer
@@ -13,7 +12,8 @@
 
 from django_idom.config import IDOM_REGISTERED_COMPONENTS
 from django_idom.hooks import WebsocketContext
-from django_idom.types import IdomWebsocket
+from django_idom.types import ComponentParamData, IdomWebsocket
+from django_idom.utils import func_has_params
 
 
 _logger = logging.getLogger(__name__)
@@ -48,22 +48,36 @@ async def receive_json(self, content: Any, **kwargs: Any) -> None:
         await self._idom_recv_queue.put(LayoutEvent(**content))
 
     async def _run_dispatch_loop(self):
-        view_id = self.scope["url_route"]["kwargs"]["view_id"]
+        from django_idom import models
+
+        dotted_path = self.scope["url_route"]["kwargs"]["dotted_path"]
+        uuid = self.scope["url_route"]["kwargs"]["uuid"]
 
         try:
-            component_constructor = IDOM_REGISTERED_COMPONENTS[view_id]
+            component_constructor = IDOM_REGISTERED_COMPONENTS[dotted_path]
         except KeyError:
-            _logger.warning(f"Unknown IDOM view ID {view_id!r}")
+            _logger.warning(
+                f"Attempt to access invalid IDOM component: {dotted_path!r}"
+            )
             return
 
-        query_dict = dict(parse_qsl(self.scope["query_string"].decode()))
-        component_kwargs = json.loads(query_dict.get("kwargs", "{}"))
-
         # Provide developer access to parts of this websocket
-        socket = IdomWebsocket(self.scope, self.close, self.disconnect, view_id)
+        socket = IdomWebsocket(self.scope, self.close, self.disconnect, dotted_path)
 
         try:
-            component_instance = component_constructor(**component_kwargs)
+            # Fetch the component's args/kwargs from the database, if needed
+            component_args: tuple[Any, ...] = tuple()
+            component_kwargs: dict = {}
+            if func_has_params(component_constructor):
+                params_query = await models.ComponentParams.objects.aget(uuid=uuid)
+                component_params: ComponentParamData = pickle.loads(params_query.data)
+                component_args = component_params.args
+                component_kwargs = component_params.kwargs
+
+            # Generate the initial component instance
+            component_instance = component_constructor(
+                *component_args, **component_kwargs
+            )
         except Exception:
             _logger.exception(
                 f"Failed to construct component {component_constructor} "

src/django_idom/websocket/paths.py

@@ -6,7 +6,7 @@
 
 
 IDOM_WEBSOCKET_PATH = path(
-    f"{IDOM_WEBSOCKET_URL}<view_id>/", IdomAsyncWebsocketConsumer.as_asgi()
+    f"{IDOM_WEBSOCKET_URL}<dotted_path>/<uuid>/", IdomAsyncWebsocketConsumer.as_asgi()
 )
 
 """A URL path for :class:`IdomAsyncWebsocketConsumer`.