With XHook, you could easily implement functionality to:
- Cache requests in memory, localStorage, etc.
- Insert authentication headers
- S3 Request Signing, see S3 Hook
- Simulate responses
- Create fake transparent backends for testing purposes
- Sending Error statistics to Google Analytics
- Create a client-side alternative to CORS by offloading requests to an iframe then splicing the response back in, see XDomain
- Devious practical jokes
- Supports RequiresJS and Browserify
- Preflight GZip compression, see XZip (Incomplete)
- Intercept and modify XMLHttpRequest ("AJAX") request and response
- Simulate responses transparently
- Backwards compatible
addEventListener
removeEventListener
- Backwards compatible user controlled progress (download/upload) events
Support Modern Browser.
XMLHttpRequest
before XHook can patch it
Using script
link to load xhook and use it, like so:
<script src="//unpkg.com/xhook@latest/dist/xhook.min.js"></script>
<script>
xhook.after(function (request, response) {
if (request.url.match(/example\.txt$/))
response.text = response.text.replace(/[aeiou]/g, "z");
});
</script>
- Development xhook.js
- Production xhook.min.js
- CDN (Use
latest
or lock to one of the available versions)
We can also install xhook via npm.
npm install xhook
Then use ESM syntax to load xhook.
import xhook from "xhook";
//modify 'responseText' of 'example2.txt'
xhook.after(function (request, response) {
if (request.url.match(/example\.txt$/))
response.text = response.text.replace(/[aeiou]/g, "z");
});
Modifying any property of the request
object will modify the underlying XHR before it is sent.
To make the handler
is asynchronous, just include the optional callback
function, which accepts an optional response
object.
To provide a fake response, return
or callback()
a response
object.
Modifying any property of the response
object will modify the underlying XHR before it is received.
To make the handler
is asynchronous, just include the optional callback
function.
Enables XHook (swaps out the native XMLHttpRequest
class). XHook is enabled be default.
Disables XHook (swaps the native XMLHttpRequest
class back in)
method
(String) (open(method,url)
)url
(String) (open(method,url)
)body
(String) (send(body)
)headers
(Object) (Contains Name-Value pairs set withsetRequestHeader(name,value)
)timeout
(Number) (timeout
)type
(String) (responseType
)withCredentials
(String) (withCredentials
)
status
(Number) Required when for fakeresponse
s (status
)statusText
(String) (statusText
)text
(String) (responseText
)headers
(Object) (Contains Name-Value pairs retrieved withgetAllResponseHeaders()
)xml
(XML) (responseXML
)data
(Varies) (response
)
The dark red before
hook is returning a response
object, which will trigger the after
hooks, then trigger the appropriate events, so it appears as if response
came from
the server.
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest
http://www.w3.org/TR/XMLHttpRequest/
http://www.w3.org/TR/XMLHttpRequest2/
-
XHook does not attempt to resolve any browser compatibility issues. Libraries like jQuery and https://github.com/ilinsky/xmlhttprequest will attempt to do this. XHook simply proxies to and from
XMLHttpRequest
, so you may use any library conjunction with XHook, just make sure to load XHook first. -
You may use synchronous XHR, though this will cause asynchronous hooks to be skipped.
See CONTRIBUTING for instructions on how to build and run XHook locally.
MIT License Copyright © 2022 Jaime Pillora [email protected]