javascript - 从我的查询字符串中传递 UTM（Urchin 跟踪模块）参数的 Javascript ES6 方法是什么？

Question

我正在尝试将 5 个 utm 参数utm_campaign、utm_term、utm_content、utm_medium和utm_source从我的客户端 React 应用程序传递到我的后端应用程序，该应用程序充当我的 React 应用程序的 API。

我需要一些 Javascript 来简单地从窗口的 URL ( ) 读取 UTM 参数window.location.search并将其附加到我的 React 应用程序内的 fetch('...')

Answer 1

这是使用 ES6 的基本解决方案

简单地使用import ParseUrlUtils from './parse_url_utils'然后添加这个文件：

const ParseUrlUtils = {

  getParam: (name) => {
    if(name=(new RegExp('[?&]'+encodeURIComponent(name)+'=([^&]*)')).exec(window.location.search))
    return decodeURIComponent(name[1]);
  },

  UTMPassThroughString: () => {
    const default_utms = ['utm_campaign', 'utm_term',
      'utm_source', 'utm_medium', 'utm_content']
    var utm_keys = []
    var utm_string

    default_utms.map((utm_key) => {
      utm_keys.push({key: utm_key, value: ParseUrlUtils.getParam(utm_key)})
    })
    utm_keys = utm_keys.filter((obj) => obj.value !== undefined)
    if (utm_keys.length > 0) {
      utm_string = "?" + utm_keys.map((ele) => {
        return ele.key + "=" + ele.value
      }).join("&")
    }
    return utm_string
  }
}
export default ParseUrlUtils