Replace one parameter in request body with a condition

[Oykun_Satis]

Hello,
I would like to replace a value of a parameter in request body when another parameter equals to a value. I tried some examples but unable to achieve.

As an example,
While page is loading, it’s requesting with some parameters;
Action=Go
Key=1
Count=5

etc.

I would like to replace another value of parameter(let’s say Count in above example) but only when Action=Go, otherthan that value i don’t want to change and leave as alone without touching.

Regards,
Oykun

[Sachin]

Hey @Oykun_Satis, You can use Modify API Request Body rule type to change the request body before it is sent to the server.

There are two ways to modify the request body

1. Override the complete body (Static body option)
2. Change the existing request body using Script (Programmatic option)

You should choose the programmatic option and define the script like this

function modifyRequestBody(args) {
  const { method, url, body } = args;
  // Change request body below depending upon request attributes received in args
  if (body.Action === "Go") {
    body.Count = 1 // Change the value of Count
  }

  return body
}

There was a bug in this feature that we have recently fixed and pushed to Chrome Web Store. Make sure you are on the latest version v23.1.4

You can confirm the extension version by going to chrome://extensions and checking the version inside Requestly card. If you are not on latest version, Refer this - How to update Chrome and Firefox extensions manually ? | by Requestly | Requestly | Medium to manually update your extension to the latest version.

[Oykun_Satis]

Hi Sachin,
First of all thanks a lot for your reply.
I updated my version and after i tried with the code above seems working, at least the page is not broken like yesterday and when i check both chrome dev and requestly logs seems intercepting however it doesn’t actually. Seems like it intercept correctly without actually applying the rule. I tried also static way if somehow it’s applying and seems Static part working. So seems something wrong with JavaScript option.

Regards,
Oykun

[Vaibhav_Nigam]

Hi @Oykun_Satis. Can you please share the rule with us to investigate further?
In rule page, click “Share” button, select specific people, enter “vaibhav@requestly.io" and copy the link.
Also, if possible please share the website URL where you are testing it, so we can have a closer look.

Please note that with any change in “Modify Request body” rule, you have to reload your page.

[Oykun_Satis]

Hello,
I shared with you;
https://app.requestly.io/rules/#sharedList/1672912867895-Oykun-shared-list-1-5-2023

However for website i don’t think it will make sense since website i’m working have some authentications ,referer requirements and token exchanges which you cannot simulate.

[Vaibhav_Nigam]

Thanks @Oykun_Satis for sharing the rule. The rule seems fine. The rule source filter you added on page URL (using funnel button) was not needed though.

I hope the original request body is a JSON. You may confirm the same in browser inspect > Network > Payload tab.

Let’s try adding a few console logs in the Javascript code snippet you had in the rule definition, like this:

function modifyRequestBody(args) {
  const { method, url, body } = args;
  console.log('Requestly: Original request body', body);
  if (body.action === "go") {
    body.count = 10;
  }
  console.log('Requestly: Modified request body', body);
  return body;
}

and look for these logs starting from “Requestly:” in Console tab in browser inspect.

I created a Requestly mock API https://user36644.requestly.dev/c94050123/api and tested with this rule: https://app.requestly.io/rules/#sharedList/1672915448164-Vaibhav-shared-list-1-5-2023 by invoking API request using fetch in browser console.

fetch("https://user36644.requestly.dev/c94050123/api", {
    method: "POST",
    body: JSON.stringify({
        "action": "go",
        "key": 1,
        "count": 5
    })
})
.then(r => r.json())
.then(console.log)

I could see the rule working as seen in screenshots above.

Please share your observations, so I can assist you further.

[Oykun_Satis]

Hi Vaibham,
Thanks for detailed explaination. I tried to add console.log however as you can see screen, even console.log is not generating.

What i suspect maybe it’s not JSON, so here you can see original request body below.

Do you have any comments ?

[Vaibhav_Nigam]

@Oykun_Satis Looks like this is a form submission case and the request payload is a Form data and not a JSON.
Unfortunately, Requestly extension does not yet support the form submission use-case and can modify request body or response only when the API is triggered using JavaScript XHR or fetch methods.

I can help only if the API request is using XHR or fetch. You may confirm it from the value of Type column for the request in Network panel.

Otherwise, we might solve it using our Desktop application which can intercept all types of requests.

[Oykun_Satis]

Hi Vaibhav,
Actually it’s a XHR as you can see screenbelow.
Also if i use Static type in the Requestly rather than using JavaScript it’s working but as i mentioned above it’s not covering my use case(conditional post request).
I’ll try it on desktop app as well and let you know.

[Oykun_Satis]

Hi Again
I tried in the desktop app but even i can see the traffic passing through desktop app it’s not applying rule and nothing on Rules Applied column.

[Vaibhav_Nigam]

Hi @Oykun_Satis,
Since it’s an XHR, it might work. Let me share the updated code snippet in some time.
Otherwise, I will guide you on how to set up on Desktop app.

Meanwhile, can you share the value (or format) you entered in static mode? If it was a JSON, it means that your API supports both Form data and JSON request body.

[Vaibhav_Nigam]

Hello again @Oykun_Satis.
Looking at the format of request payload in your screenshot, JS code like this should work in browser extension:

function modifyRequestBody(args) {
  const { method, url, body } = args;

  console.log("Requestly: Original request body", body);

  const formData = new URLSearchParams(body);
  if (formData.get("action") === "go") {
    formData.set("count", 10);
  }
  const modifiedBody = formData.toString();

  console.log("Requestly: Modified request body", modifiedBody);

  return modifiedBody;
}

The code is as per example shared before but you may modify it as per your use-case.

Since the body argument is the form-data query string, I converted it to a URLSearchParams object to do the manipulations.

I hope this works. Otherwise, we may connect over a quick call. Please feel free to block a time slot on my calendar (Calendly - Vaibhav, Requestly).

[Oykun_Satis]

Hi Vaibhav,
I guess issue was somehow about JSON. With the URLSearchParam. Seems succesfully intercept traffic and modify it.

Appreciated for your efforts.

Regards,
Oykun

[Vaibhav_Nigam]

Hi Oykun,
Glad to know that you are unblocked.
Thanks for being so patient.