如何在NestJS的Axios GET请求中正确处理特殊字符？

使用NestJS开发后端服务，调用第三方API获取城市数据时遇到异常：

• 当请求参数包含~、^等特殊符号，或带葡语重音的城市名（如São Paulo、Brasília）时，Axios发起的GET请求返回undefined
• 手动构造的URL在Postman中可正常请求，但代码中无法获取数据

请求代码如下：

async callAneel(numOfItems,offset,sigUF,city) {
    const aneelData = [];
    let url = `https://dadosabertos.aneel.gov.br/api/3/action/datastore_search?resource_id=b1bd71e7-d0ad-4214-9053-cbd58e9564a7&limit=${numOfItems}&offset=${offset}&q={"SigUF":"${sigUF}","NomMunicipio":"${city}"}`

    try {
      var aneelAnswer = await lastValueFrom(this.httpService.get(url));
    }
    catch(error)
    {
      return;
    }
    
    for(let i = 0; i<aneelAnswer.data.result.records.length; i++) {
      aneelData.push(aneelAnswer.data.result.records[i]);
    }

    return aneelData;
}

问题根源是URL未正确编码：Postman会自动处理URL编码，但手动拼接字符串时，特殊字符和带重音的Unicode字符未被编码，导致请求格式错误。

1. 推荐方案：使用Axios的params自动编码 #

无需手动拼接URL，通过Axios的params配置项传递参数，它会自动对所有参数值进行标准URL编码：

async callAneel(numOfItems, offset, sigUF, city) {
    try {
        const response = await lastValueFrom(
            this.httpService.get('https://dadosabertos.aneel.gov.br/api/3/action/datastore_search', {
                params: {
                    resource_id: 'b1bd71e7-d0ad-4214-9053-cbd58e9564a7',
                    limit: numOfItems,
                    offset: offset,
                    q: JSON.stringify({ SigUF: sigUF, NomMunicipio: city })
                }
            })
        );
        // 直接返回records数组，简化代码
        return response.data.result.records;
    } catch (error) {
        console.error('ANEEL API调用失败:', error);
        return [];
    }
}

2. 备选方案：手动编码参数值 #

如果必须手动拼接URL，使用encodeURIComponent对每个参数值单独编码，尤其是q参数中的JSON内容：

async callAneel(numOfItems, offset, sigUF, city) {
    // 对每个参数值执行URL编码
    const encodedLimit = encodeURIComponent(numOfItems);
    const encodedOffset = encodeURIComponent(offset);
    const encodedQuery = encodeURIComponent(JSON.stringify({ SigUF: sigUF, NomMunicipio: city }));

    const url = `https://dadosabertos.aneel.gov.br/api/3/action/datastore_search?resource_id=b1bd71e7-d0ad-4214-9053-cbd58e9564a7&limit=${encodedLimit}&offset=${encodedOffset}&q=${encodedQuery}`;

    try {
        const response = await lastValueFrom(this.httpService.get(url));
        return response.data.result.records;
    } catch (error) {
        console.error('ANEEL API调用失败:', error);
        return [];
    }
}

注意事项 #

• encodeURIComponent会对所有非URL安全字符编码，包括重音字符和特殊符号，确保请求符合RFC标准
• 优先使用Axios的params方案，避免手动编码时的遗漏或错误
• 原代码捕获错误后直接返回，建议添加错误日志，便于后续排查问题

内容的提问来源于stack exchange，提问作者hope