Hardcoded URL in common.js breaks Drupal installs not on site root.

Created on 18 August 2025, about 2 months ago

Common.js has the following code:

        $.ajax({
          url: `/admin/content/file-explorer/${folderId}/${mid}/preview/ajax`,
          type: 'GET',
          success(result) {
            $('#preview .preview-contents').html('');
            $('#preview').addClass('open');
            setTimeout(function () {
              $('#preview .preview-contents').html(
                `${result.render}${details}`,
              );
            }, 300); 

If the drupal site is not on the server root, this 404s, removing the right hand direct file link and file details.
Confirmed that hardcoding the correct url fixed this, but the correct fix would be presumably to get the base name from drupal, or, at the very least, extracting it from the window location in JS...

🐛 Bug report
Status

Active

Version

1.0

Component

Code

Created by

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @Kyber
  • I suppose the corollary to this is that file info does not degrade gracefully and presumably requires JS, although that probably doesn't block the main module from functioning.

  • A crude fix that works somewhat generically (for drupal in a subfolder of server root only - deeper trees would need a smarter regex - but these sites were only in a subfolder), was appending the following to the top of common.js.

    var DRUPAL_BASE=window.location.pathname.replace(/\/([^/]*)\/.*/,'$1');
    

    Then modifying the various url: `/...` to url: `/{DRUPAL_BASE}/..`

  • Ok... It turns out Drupal's solution for this is a lot simpler.
    Drupal.url() automatically converts a relative Drupal path into a proper path considering the base.
    So:

    url: Drupal.url(`file-explorer/${fid}/upload-file/ajax`)
    

    Will do the right thing. I'll add a patch to the current common.js in a moment.

  • Here's a few fixes. Regex for fixing in vim:

    :%s@`/\([^`]*\)`@Drupal.url(`\1`)@g
    

    Fixing it in an Apache config dynamically pending upstream fix (note this requires disabling Drupal JS aggregation or writing a more careful substitution):

            <LocationMatch "^/[^/]+/modules/contrib/media_folder_management/js/common.js">
                AddOutputFilter Sed js
                OutputSed "s|`/\([^`]*\)`|Drupal.url(`\1`)|"
            </LocationMatch> 
    

    Aaaaand a patch of the common.js.

    
    --- common.js   2025-08-19 12:20:41.007619081 -0400
    +++ common.js.fixed     2025-08-19 14:05:16.985540157 -0400
    @@ -105,7 +105,7 @@
             const details = `<div>${dataExtension} ${Drupal.t('file')}</div><div>${dataSize}</div>`;
    
             $.ajax({
    -          url: `/admin/content/file-explorer/${folderId}/${mid}/preview/ajax`,
    +          url: Drupal.url(`admin/content/file-explorer/${folderId}/${mid}/preview/ajax`),
               type: 'GET',
               success(result) {
                 $('#preview .preview-contents').html('');
    @@ -254,7 +254,7 @@
               .then((readerRs) => {
                 if (readerRs) {
                   $.ajax({
    -                url: `/file-explorer/${fid}/upload-file/ajax`,
    +                url: Drupal.url(`file-explorer/${fid}/upload-file/ajax`),
                     type: 'POST',
                     data: { request: readerRs },
                     cache: false,
    @@ -267,7 +267,7 @@
                           });
                         }
                       }
    -                  const url = `/file-explorer/${fid}`;
    +                  const url = Drupal.url(`file-explorer/${fid}`);
                       const state = {
                         type: 'media-file-explorer',
                         url,
    @@ -296,7 +296,7 @@
         ajaxMove(fid, toMove) {
           $('body').addClass('loading');
           $.ajax({
    -        url: `/file-explorer/${fid}/move-into/ajax`,
    +        url: Drupal.url(`file-explorer/${fid}/move-into/ajax`),
             type: 'POST',
             data: { objects: toMove },
             cache: false,
    @@ -310,7 +310,7 @@
                 }
               }
               if (result.messages[0].type === 'status') {
    -            const url = `/file-explorer/${fid}`;
    +            const url = Drupal.url(`file-explorer/${fid}`);
                 const state = {
                   type: 'media-file-explorer',
                   url,
    
Production build 0.71.5 2024