JavaScript-数组类型参数的URL编码

Question

我不知道如何以一种优雅的方式对数组参数进行URL编码，以便将XHR请求从我的Vue.js客户端发送到我的Symfony PHP API。

例如，我有此GET方法端点：

• / question / list？subjects = {idSubject}

它列出了Question实体项目，并且可以选择接受参数以按其过滤结果（在这种情况下为主题）

所需的是：

• / question / list？subjects [] = {idSubject}＆subjects [] = {idSubject}

我正在使用Axios for Vue.js执行XHR请求，并且我创建了一个实现我想要的方法的主类。

由于get（）方法不支持config对象中的'data'属性，因此我以POST调用的相同方式实现了该属性，然后对其进行处理以构建所需的URL。

这是我的Ajax.js文件：

const ajaxRequest = (config) => {
    const token = TokenStorage.get()

    config.baseURL = '/ajax'
    if (token) {
        config.headers = {
            'Authorization': 'Bearer ' + token
        }
    }

    return Axios.request(config)
}

const Ajax = {

    get: (endpoint, params = null, config = {}) => {
        const querystring = require('querystring')
        let url = endpoint
        if (Array.isArray(params) && params.length) {
            url += '?' + params.join('&')
        } else if (typeof params === 'object' && params !== null && Object.keys(params).length) {
            url += '?' + querystring.stringify(params)
        }

        config = {
            ...config,
            ...{
                url: url,
                method: 'get'
            }
        }

        return ajaxRequest(config)
    },

    post: (endpoint, params, config = {}) => {
        config = {
            ...config,
            ...{
                url: endpoint,
                method: 'post',
                data: params
            }
    }

        return ajaxRequest(config)
    }
}

[我知道我可以通过POST传递此数据，但是，为了遵循简洁的设计，我希望保留GET方法，并且可以将可选参数作为GET参数包含在URL中。

Answer 1

[如果是我，我会构建一个JavaScript数组，然后在其上调用JSON.stringify（）...然后URL对结果字符串进行编码并将其附加为唯一参数...由服务器端处理程序进行JSON解析。