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

Path is ignored when using baseUrl #78

Open
Rednol opened this issue Aug 14, 2023 · 2 comments
Open

Path is ignored when using baseUrl #78

Rednol opened this issue Aug 14, 2023 · 2 comments
Labels
question Further information is requested

Comments

@Rednol
Copy link

Rednol commented Aug 14, 2023

Hi,

I'm trying to append a base url to relative image paths but it ignores the path of provided URL.


Part of the input that includes the image path;

kleur met een lege waarde:\n\n![image](/uploads/ce5034e9855d2508f52fd51bc4ee8158/image.png)\n\nDe link die

The marked implementation

    <script src="https://cdn.jsdelivr.net/npm/marked/lib/marked.umd.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/marked-base-url/lib/index.umd.js"></script>
marked.use(markedBaseUrl.baseUrl("https://example.com/folder/"));

var input = x.innerHTML;
var output = DOMPurify.sanitize(marked.parse(input));
 x.innerHTML = output;

HTML result;

kleur met een lege waarde:</p>
<p><img alt="image" src="https://example.com/uploads/ce5034e9855d2508f52fd51bc4ee8158/image.png"></p>
<p>De link die

As you can see on the img src, the folder/ path is ignored. Am I missing something or?


When reading the documentation it looks to me like it should accept paths. Following code block is from the documentation;

marked.use(baseUrl("https://example.com/folder/"));

marked.parse("[my url](./relative/path)");
// <p><a href="https://example.com/folder/relative/path">my url</a></p>

Thanks in advance,
Erwin

@UziTech
Copy link
Member

UziTech commented Aug 14, 2023

Paths that start with a slash are relative to the root. If you remove the starting slash it will work as expected.

![image](uploads/ce5034e9855d2508f52fd51bc4ee8158/image.png)

Or you can add a dot before the slash to indicate it is frome the current folder.

![image](./uploads/ce5034e9855d2508f52fd51bc4ee8158/image.png)

@UziTech UziTech added the question Further information is requested label Aug 14, 2023
@Rednol
Copy link
Author

Rednol commented Aug 14, 2023

@UziTech I've tested it and it indeed does work with uploads/ and ./uploads/. Unfortunately I'm not the owner of the source. Is there any way in marked to rewrite these img srcs or should I make my own replace function for the /uploads/ path?


Managed to find something in the documentation which suits my needs https://marked.js.org/using_pro#renderer

            var renderer = {
                image(href, title, text) {
                    return `
                    <img src="https://example.com/folder/${x.dataset.projectpath}${href}"/>
                    `
                }
            }

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

No branches or pull requests

2 participants