Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Get relative path without the domain #1233

Open
nasirkhan opened this issue Apr 21, 2024 · 4 comments
Open

Get relative path without the domain #1233

nasirkhan opened this issue Apr 21, 2024 · 4 comments

Comments

@nasirkhan
Copy link
Contributor

I am using the Standalone button integration on my project. When I select an image it returns the path.

The issue is the file path includes the domain name. My local, staging, and production have different domains, so when I try to use the production database on my local, none of the image paths work.

I believe this is a bug! if this behavior can be changed from the config please let me know. Without a relative path, I will not be able to use this package at all!

Expected Behavior

A relative path will be returned, without the domain name.

Actual Behavior

The package returns a filepath including the domain name.

@streamtw
Copy link
Member

streamtw commented Apr 22, 2024

I believe this can be accomplished by changing stand-alone-button.js or codes in Javascript Integration document.

Take javascript integration document as example, the default integration looks like this (notice items.map):

var lfm = function(id, type, options) {
  let button = document.getElementById(id);

  button.addEventListener('click', function () {
    var route_prefix = (options && options.prefix) ? options.prefix : '/laravel-filemanager';
    var target_input = document.getElementById(button.getAttribute('data-input'));
    var target_preview = document.getElementById(button.getAttribute('data-preview'));

    window.open(route_prefix + '?type=' + options.type || 'file', 'FileManager', 'width=900,height=600');
    window.SetUrl = function (items) {
      var file_path = items.map(function (item) {
        return item.url;
      }).join(',');

      // set the value of the desired input to image url
      target_input.value = file_path;
      target_input.dispatchEvent(new Event('change'));

      // clear previous preview
      target_preview.innerHtml = '';

      // set or change the preview image src
      items.forEach(function (item) {
        let img = document.createElement('img')
        img.setAttribute('style', 'height: 5rem')
        img.setAttribute('src', item.thumb_url)
        target_preview.appendChild(img);
      });

      // trigger change event
      target_preview.dispatchEvent(new Event('change'));
    };
  });
};

By changing how urls are handled, we can remove the domains from image urls:

var file_path = items.map(function (item) {
  var file_url = new URL(item.url);
  return file_url.href.substring(file_url.origin.length);
}).join(',');

The reason why domain part is left in the url, is that I think it is simpler to use javascript to remove domain, rather than to append the domain afterward. If laravel-filemanager is served as a stand alone image server(uses a different domain other than the application server), the domain part is necessary.

Please let me know it this solves your issue.

@nasirkhan
Copy link
Contributor Author

var file_path = items.map(function (item) {
  var file_url = new URL(item.url);
  return file_url.href.substring(file_url.origin.length);
}).join(',');

This works. Thank you. The issue was solved partially.

When i use the file laravel-filemanager with WYSIWYG Editor it includes the domain in the content.

Do you have any plan to control this via config? In my case, I am not using this filemanager for a standalone file server. So this is a big problem for me, as it impacts the development of the application in the local and products.

@streamtw
Copy link
Member

streamtw commented Apr 27, 2024

Understood. Current solution is not valid with WYSIWYG editors.

In that case, the following workaround should do the trick:
Around the line https://github.com/UniSharp/laravel-filemanager/blob/v2.9.0/public/js/script.js#L722 of script.js

Replace:

var url = items[0].url;

With:

var url_to_parse = new URL(items[0].url);
var url = url_to_parse.href.substring(url_to_parse.origin.length);

The previous workaround for stand-alone button should be discarded with this workaround.

Thanks for the notice of these two use cases. New configuration for relative path seems good. Since this package involves both frontend and backend, I will take some time thinking about how to organize the new configuration with older ones.

@nasirkhan
Copy link
Contributor Author

nasirkhan commented Apr 27, 2024 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants