如何创建动态HTTP请求路径

时间:2019-08-06 12:52:12

标签: javascript vue.js google-api httprequest

我在Vue.js中有一个基本应用程序,通过vue-google-api插件link here使用Google Drive / Docs API。

我有一个方法 execute(),如下面的代码片段所示。第一个POST请求正在制作现有文档的副本。第二个POST将替换复制文件中的几个单词。

response.result.id 返回已复制文件的正确documentId。

我想将该ID用作第二个POST请求的PATH的一部分,但我不知道如何实现。

任何帮助都会很棒,谢谢。

execute() {
    this.$gapi
        .request({
          path:
            "https://www.googleapis.com/drive/v3/files/1xTvsBoqCiKE5XfSRklRPBWMbkCtdJSnzGEdT7B76TZM/copy",
          method: "POST"
        })
        .then(response => {
            console.log(response);
            let documentId = response.result.id;
            let imieUcznia = "Alice";
            let requests = [
                {
                    replaceAllText: {
                        containsText: {
                            text: "{{imieUcznia}}",
                            matchCase: true
                        },
                        replaceText: imieUcznia
                    }
              }
          ];
          this.$gapi
              .request({
                  path: "https://docs.googleapis.com/v1/documents/${documentId}:batchUpdate",
                  method: "POST",
                  body: {
                      requests
                  }
              })
              .then(response => {
                  console.log(response);
              });
        });
},

2 个答案:

答案 0 :(得分:2)

您可以使用Javascript Template Literals,即使用`代替“

path: `https://docs.googleapis.com/v1/documents/${documentId}:batchUpdate`,
//    ^ Observe here

答案 1 :(得分:1)

您需要使用`符号来使用模板字符串

execute() {
      this.$gapi
        .request({
          path:
            "https://www.googleapis.com/drive/v3/files/1xTvsBoqCiKE5XfSRklRPBWMbkCtdJSnzGEdT7B76TZM/copy",
          method: "POST"
        })
        .then(response => {
          console.log(response);
          let documentId = response.result.id;

          let imieUcznia = "Alice";
          let requests = [
            {
              replaceAllText: {
                containsText: {
                  text: "{{imieUcznia}}",
                  matchCase: true
                },
                replaceText: imieUcznia
              }
            }
          ];
          this.$gapi
            .request({
              path:
                `https://docs.googleapis.com/v1/documents/${documentId}:batchUpdate`, // <-- here
              method: "POST",
              body: {
                requests
              }
            })
            .then(response => {
              console.log(response);
            });
        });
    },