Requestly： Modify Headers ｜ Redirect,Mock API

Requestly： Modify Headers ｜ Redirect,Mock API插件简介

Requestly： Modify Headers ｜ Redirect,Mock API插件描述

? Free developer tool to debug web applications  Intercept, Modify & Debug netwk requests. Used by over 170,000+ web developers in 5000+ ganizations.

Requestly brings the power of Charles Proxy & Fiddler directly to the browser with a simple interface, collabation features, active suppt & No VPN issues. Here are some top features

? Set up redirects f APIs, Javascript (Switch Environment e.g. Prod to Staging)
? Modify API Responses (Fixed Response  Programmatic Override)
? Modify HTTP Headers
? Share debugging sessions with Video, console logs, netwk logs,  env details with teammates
? Inbuilt Mock Server
? Insert external Javascript & CSS on any website
? Block & Throttle Requests
? https://requestly.io/blog/5waystomakedebuggingeasy/

? Mock API Response  XMLHttpRequest (XHR) & Fetch Requests
    ▪️ Define Custom Response f your APIs requested by XHR/fetch
    ▪️ Start wking on frontend when backend is not ready
    ▪️ Modify API response directly in Staging  Production environment
    ▪️ Wks with graphQL APIs
    ▪️ Simulate fake HTTP Status Code (400s  500s) f APIs
    ▪️ Simulate bad API responses  test different err paths in your frontend code
?  Demo Video – https://www.youtube.com/watch?v=KIPbxUGUYq8&t=1s&ab_channel=Requestly

? Redirect URLs, Change Host, Modify Query Params (Map Remote  Map Local)
    ▪️ Use dev/staging APIs in production sites & test local changes without deployment
    ▪️ Debug remote Javascript by loading locally running JS in production sites
    ▪️ Switch Hosts (e.g. abc.com/* to xyz.com/*)
    ▪️ Debug Ad Tracking Pixels, Debug A/B Test Campaigns, etc
    ▪️ Remote Debugging with Requestly on Production sites 
    ▪️ Swap Adobe Launch (Adobe DTM) scripts in production with staging script
? Demo Video  https://www.youtube.com/watch?v=85GVaOWTnlE (Map Local)

? Modify Headers  Add/Remove/Update request  response Headers
    ▪️ It can be used to hle CORS Issues in your application
    ▪️ Add / Remove / Modify ContentSecurityPolicy, XFrame Options, XFwardedF, Authization, AccessControlAllowOrigin, mimetype, useragent headers, etc
    ▪️ Manage cookies in the response headers
    ▪️ Conditional URL targeting f header modifications
    ▪️ Selenium Integration  https://www.npmjs.com/package/@requestly/selenium 
? Demo Video  https://www.youtube.com/watch?v=CLEHS6NFYZY (Modify Headers Demo)

? Share sessions with teammates including Video, console logs, netwk logs & env details
    ▪️ Get quality bug repts from QAs, Customer Suppt & other nontechnical people
    ▪️ Never deal with asking Steps to Reproduce
    ▪️ Attach the session recding link in Jira Tickets, Emails,  Slack anywhere
    ▪️ Improve debugging experience by 10x
?  Demo Video – https://www.youtube.com/watch?v=g_qXQAzUQgU

? Delay/Throttle Netwk Requests  API Requests, JS, CSS, etc
    ▪️ Suppts delay in both XHR & fetch based API requests 
    ▪️ Delay API requests to test the loading experience of your app 
    ▪️ Test different race conditions in your applications, you can delay a script by some milliseconds
    ▪️ Test your app when one  me APIs responds slow  fails (API Latency has gone up)

? Insert Scripts to any Webpage like TamperMonkey  GreaseMonkey Scripts
    ▪️ UserScripts are simple javascript, CSS code that can change the layout of a page, add  remove new functionality  content,  automate actions.
    ▪️ Use File Hosting service to upload long scripts  Inject them using Script Rule
    ▪️ Inject your JS tags on potential customers sites  test your features
    ▪️ The sales/product team can use this to demo the product directly on the prospect’s website (10x engaging demo)
?  Demo  https://www.youtube.com/watch?v=4dvucRjLwGY (Insert Custom Scripts)

? Block requests  Websites by matching keywds  URL criteria
    ▪️ Block internal & external Scripts/APIs & test the impact on your websites
    ▪️ Build your own custom blocker: Block URLs matching a particular pattern  Could be Ads, Tracking pixels, Images, etc

? Additional Features 
    ▪️ Enable/Disable rules with a single click  
    ▪️ Expt  impt the rules  maintain a backup f your rules
    ▪️ Easy collabation with others. Share Rules with other Users in one click
?  Demo  https://www.youtube.com/watch?v=BM7kTFyvdc

References
? Website        https://requestly.io
? Docs           https://docs.requestly.io  
? Suppt        https://github.com/requestly/requestly/issues
? Desktop App     https://requestly.io/desktop
? Open Roadmap   https://github.com/requestly/requestly/issues

? HashTags  Charles Proxy, modheader, web, debugging APIs, AdTech, Intercept, requestly, adobe launch, fiddler, netwk
                                

Requestly： Modify Headers ｜ Redirect,Mock API插件离线安装方法

1.首先用户点击谷歌浏览器右上角的自定义及控制按钮，在下拉框中选择设置。

2.在打开的谷歌浏览器的扩展管理器最左侧选择扩展程序或直接输入：chrome://extensions/

3.找到自己已经下载好的Chrome离线安装文件xxx.crx，然后将其从资源管理器中拖动到Chrome的扩展管理界面中，这时候用户会发现在扩展管理器的中央部分中会多出一个”拖动以安装“的插件按钮。

4.下载 Requestly： Modify Headers ｜ Redirect,Mock APIChrome插件v23.2.6版本到本地。

5.勾选开发者模式，点击加载已解压的扩展程序，将文件夹选择即可安装插件。

注意：最新版本的chrome浏览器直接拖放安装时会出现“程序包无效CRX-HEADER-INVALID”的报错信息，参照这篇文章即可解决