Я загружаю меню с другого поддомена (используя jquery), и мне нужны относительные ссылки для другого поддомена — как мне это сделать?

#jquery #relative-path

Вопрос:

Это вариация на тему. Я просмотрел некоторые другие ответы, и они не совсем соответствуют требованиям.

У меня есть d1.site.org и d2.site.org . d2 использует следующий jquery для получения меню из d1: $('#myNav').load('https://d1.site.org/ header'); но относительные ссылки в меню, введенные из d1, все указывают на d2, и я хочу, чтобы эти ссылки стали d1.site.org/menu1 вместо того, что они делают сейчас d2.site.org/menu1 (и в конечном итоге с ошибками 404).

PS — включите CORS, и параметры меню верхнего уровня отображаются нормально и правильно отображаются на d2, просто ссылки, содержащиеся на уровнях ниже, заканчиваются неправильным поддоменом. Как мне сделать так, чтобы все относительные ссылки указывали на d1, когда они отображаются на d2?

Правка: для уточнения — все ссылки меню menu1 menu2 и т. Д. на d1, Что делает их d1.site.org/menu1 и т. Д. Но когда они находятся на d2, они есть d2.site.org/menu1 , и я хочу, чтобы они были d1.site.org/menu1

Ответ №1:

Это абсолютный путь, в нем не было бы вашего домена. Вы можете проанализировать относительный путь и присвоить ему префикс нужного вам домена.

     thing = 'd2.site.org/menu1';
    relative = thing.substring(thing.indexOf('.org') 4, thing.length);
    newLink = 'd1.site.org' relative
    console.log(newLink);
 

Комментарии:

1.все ссылки меню menu1 menu2 и т. Д. Находятся на d1, Что делает их d1.site.org/menu1 и т. Д., Но когда они находятся на d2 , они есть d2.site.org/menu1 , и я хочу, чтобы они были d1.site.org/menu1

2. Я предполагаю, что вы делаете это с помощью ajax. Вам нужно будет обработать возвращенные данные, чтобы обновить ссылки.

3. Я использую jquery (см. Заголовок: -), но я думал об одном и том же — нужно обновить baseUri, так как ссылки извлекаются с помощью аргумента load (). Я сейчас исследую это

Ответ №2:

Вот что я в конечном итоге сделал на d2.site.org:

 $('#mainNav').load('https://d1.site.org/ header');
$(window).on("load", function () {
    setTimeout(function () {
        $('header nav').each(function() {
            var origUrl = this.href;
            origUrl = origUrl.replace("https://d2.site.org", "");
            var newUrl = 'https://d1.site.org'   origUrl;
            this.href = newUrl;
        });
    }, 1000);
});
 

Загрузите основной заголовок, затем, после загрузки страницы, подождите 1 секунду, затем обновите все ссылки, указывающие на d2, и сделайте так, чтобы они указывали на d1. Причина setTimeout в том, что я не мог понять, как выполнить два события загрузки и чтобы одно происходило за другим. Я, вероятно, мог бы также подождать меньше секунды, но это достаточно быстро для людей, которые могут щелкнуть мышью по этим ссылкам после загрузки страницы. Возможно, есть и другие хитрости, которые могли бы сделать это лучше, но пока этого достаточно.

Наконец, поскольку DOM обеспечивает d2.site.org прежде чем что-либо еще сможет до него добраться, сценарий должен быть запущен впоследствии. Я не знаю способа перехватить атрибут URL при создании страницы.

Комментарии:

1. Вы можете упростить это, используя свой newUrl в качестве строки замены вместо пустой, за которой следует объединение.