How to insert a params in Fetch GET request?

Question

I created a simple Flask's jsonify that I do not sure if I can call it as API, but I receive a JSON Object.

@app.route('/searchData/<int:id>',methods=["GET"])
def searchData(id):
    return jsonify(searchData(id))

Now using Fetch function, I cant pass the arg <int:id>, I don't if I can add params to Header in Flask to accepted the argument.

  async fetch(id){      
    const res = await fetch(
      "http://localhost:5000/searchData/",
        {
          method:"GET"
        }
    );
    const data = await res.json()
    console.log(data)
  }

sorry, can you explain me? – Shinomoto Asakura Jul 01 '20 at 00:29 — Shinomoto Asakura, Jul 01 '20 at 00:29

score 1 · Accepted Answer · answered Jun 30 '20 at 23:02

1

Change " to back ticks to make it a string literal and add it with interpolation.

async fetch(id){      
    const res = await fetch(
      `http://localhost:5000/searchData/${id}`,
        {
          method:"GET"
        }
    );
    const data = await res.json()
    console.log(data)
  }

Using this style of interpolation makes it so much easier to read when you have a few params

answered Jun 30 '20 at 23:02

Floyd Watson

378
3
11

Thank you for answering, I receive a error in VUE.JS saying `error 'id' is defined but never used` – Shinomoto Asakura Jun 30 '20 at 23:06
Yeah that would of been talking about the `fetch(id)` method you created. With that usage in the URL it should suffice Vue and clear that error – Floyd Watson Jun 30 '20 at 23:29
I did the way you explained, but error indicates `async fetch(id){ ` never used – Shinomoto Asakura Jun 30 '20 at 23:57
This may not work but try changing the `async fetch(id){` name to `fetchDataById(id)` or anything else you like the look of. Just curious if its reading itself wrong because if the same names – Floyd Watson Jul 01 '20 at 02:23
1

I got to fix it "concatenating" url + id like `'http://localhost:5000/searchData/'+id` Thank you for helping me @Floyd – Shinomoto Asakura Jul 01 '20 at 16:34

How to insert a params in Fetch GET request?

1 Answers1