Angular 7 HTTP GET发送JSON对象作为参数

Question

我试图通过角度将JSON结构发送到REST服务

  let test5var = {
                    "test5var1": {
                        "test5var2": "0317",
                        "test5var3": "9556"
                    },
                    "test5var4": "123",
                    "test5var": "0000046"
                }
let dataPrincipalBlnc = {"test": {"test1": {"test2": "0317","test3": {"IDIOMA_ISO": " en","DIALECTO_ISO": "US"},"channel": "INT"},"input": {"test5": test5var}}};

let headers = new HttpHeaders();
    headers.append('Content-Type', 'application/json');

    let params = new HttpParams().set("requestData", dataPrincipalBlnc.toString()).set("authenticationType", this.authType);


    return this.http.get(this.url, {params: params}); 

请求的结果应如下所示：

https://example.com/test?authenticationType=cookie&requestData=%7B%test%22:%7B%22test1%22:%7B%22test2%22:%220317%22,%22test3%22:%7B%22IDIOMA_ISO% 22：％22 + en％22，％22DIALECTO_ISO％22：％22US％22％7D，％22channel％22：％22INT％22％7D，％22input％22：％7B％22test5％22：％7B％22test5var1％ 22：％7B％22test5var2％22：％220317％22，％22test5var3％22：％229556％22％7D，％22test5var4％22：％22123％22，％22test5var5％22：％220000986％22％7D％7D％ 7D％7D

但当前发送为：

https://example.com/test?requestData=%5Bobject%20Object%5D&authenticationType=cookie

有什么想法可以将json对象发送为第一个请求吗？我需要手动将json转换为有效的uri格式吗？

在angularJS中，仅使用以下代码即可正常工作：

var data = {
      "test1": {
        "test2": {
          "test3": "0317",
          "test4": {
            "IDIOMA_ISO": " en",
            "DIALECTO_ISO": "US"
          },
          "channel": "INT"
        },
        "input": {
          "test5": test5var
        }
      }
};
$http.get(url, {
      params: {
        authenticationType: authType,
        requestData: data
      }
    }).then(success(deferred), error(deferred));

我也尝试使用以下代码，但结果是添加了更多字符，并且后端出现故障，因为它表示JSON格式无效：

encodeURIComponent(JSON.stringify(dataPrincipalBlnc)

？requestData =％257B％2522test％2522％253A％257B％2522test1％2522％253A％257B％2522test2％2522％253A％25220317％2522％252C％2522test3％2522％253A％257B％2522IDIOMA_ISO％2522％253A％2522％ 2520en％2522％252C％2522DIALECTO_ISO％2522％253A％2522US％2522％257D％252C％2522channel％2522％253A％2522INT％2522％257D％252C％2522input％2522％253A％257B％25Btest25％2522％253A％257B％ 2522test5var1％2522％253A％257B％2522test5var2％2522％253A％25220317％2522％252C％2522test5var4％2522％253A％25229556％2522％257D％252C％2522test5var4％2522％253A％2522123％2522％252C％2522test5var5％2522％ 253A％25220003303％2522％257D％257D％257D％257D＆authenticationType = cookie

感谢和问候

Answer 1

传递给服务的任何JSON对象都应通过响应主体发送。您应该仅在url中添加有效的字符串参数。

大多数浏览器还具有URL大小限制，因此较大的对象可能会导致您出现长URL问题。

您正在看到， requestData=%5Bobject%20Object%5D&authenticationType=cookie因为它无法将JSON对象放入url 查询字符串中。

有些字符不能成为URL的一部分（例如，空格），而另一些字符在URL中具有特殊含义：例如，字符＃可用于进一步指定文档的子节（或片段）；字符=用于将名称与值分开。查询字符串可能需要转换以满足这些约束。这可以使用称为URL编码的模式来完成。

使用JSON.stringify时，你有一个JavaScript对象，并希望将其转换为字符串（含JSON文本）。这称为序列化。

与JSON无关：

使用encodeURIComponent时要发送的网址“有问题”的字符，如＆，％等相反的是decodeURIComponent。

我仍然希望在请求正文中发送对象。

因此，在您的情况下使用：

 let params = new HttpParams()
                .set("requestData", encodeURIComponent(JSON.stringify(dataPrincipalBlnc)))
                .set("authenticationType", this.authType);