Блог

Главная - Вопросы по программированию - Лучший способ добавить пользовательские теги / комментарии скриптов (загруженные из базы данных) на страницы React / Next js, специально для партнерских компаний?

Лучший способ добавить пользовательские теги / комментарии скриптов (загруженные из базы данных) на страницы React / Next js, специально для партнерских компаний?

#javascript #reactjs #next.js #cross-domain #affiliate

Вопрос:

При работе с крупными партнерскими сетями они часто требуют, чтобы вы загружали пользовательские сценарии (через теги сценариев, поскольку у них на самом деле нет импорта / и т. Д.), Которые используются для подтверждения владения сайтом и/или помощи в отслеживании ссылок.

Примеры этого:

 <script type="text/javascript" src="https://classic.avantlink.com/affiliate_app_confirm.php?mode=jsamp;authResponse=631a7acab11q3h5bq34y1brb23G966fd3208dcc2178c08634984c4a4"></script>
<script type="text/javascript" src="https://s.skimresources.com/js/195290X1q3456hern33yasbf672977.skimlinks.js"></script>

К сожалению, они указывают теги / комментарии сценариев, которые должны быть добавлены в конец тела (вне иерархии DOM react). Я немного боролся с поиском лучшего способа сделать это… в настоящее время я добиваюсь этого следующим:

 // On load
useEffect(()=> {
  // Load external scripts and show comments (for affiliates)
  if (staticProfile.profilePageScripts) {
    try {
      const scripts = JSON.parse(staticProfile.profilePageScripts);
      console.log(scripts);
      scripts.forEach((script: any) => {
        console.log(script);
        const scriptTag = document.createElement("script");
        if (script.src) scriptTag.src = script.src;
        if (script.async) scriptTag.async = script.async;
        if (script.integrity) scriptTag.integrity = script.integrity;
        if (script.crossOrigin) scriptTag.crossOrigin = script.crossOrigin;
        document.body.appendChild(scriptTag);
      });
    } catch (err) {
      console.log(err);
    }
  }
  if (staticProfile.profilePageComments) {
    const comments = document.createComment(staticProfile.profilePageComments);
    document.body.appendChild(comments);
  }

},[]);

Интересно, есть ли лучший способ сделать это?

В идеале я хотел бы сохранить исходный HTML-код в базе данных и просто отобразить его в конце, но я не нашел простого способа сделать это? Я взглянул на порталы react, но они кажутся немного тяжеловатыми только для этого?

У меня также есть проблемы с браузером, который неправильно загружает их сценарии (я получаю предупреждения CORB?) в некоторых ситуациях. Я не уверен, что это что-то не так с моей стороны или с их стороны?

Метки: ,