npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@mr.python/axios-userscript-adapter

v1.0.0

Published

GM.xmlHttpRequest adapter for Axios HTTP client

Downloads

9

Readme

axios-userscript-adapter

Deprecated

axios 1.0.0 stop exporting utils in its lib directory, it only exporting its axios class now. It will be painfully for me to maintain this adapter for axios>=1.0.0.

Consider to use a fetch api provided by https://github.com/trim21/gm-fetch

Description

An adapter for axios to make ajax calls within UserScript via the GM.xmlHttpRequest function as provided by the Greasemonkey and Tampermonkey WebExtensions for Firefox and Chromium-based browsers.

Synopsis

// ==UserScript==
// @name        new user script
// @namespace   https://trim21.me/
// @description hello
// @version     0.0.1
// @author      Trim21 <[email protected]>
// @match       http*://*/*
// @require     https://cdn.jsdelivr.net/npm/[email protected]/dist/axios.min.js
// @require     https://cdn.jsdelivr.net/npm/[email protected]
// @grant       GM.xmlHttpRequest
// @run-at      document-end
// @connect     httpbin.org
// ==/UserScript==

console.log(axios.defaults.adapter);
axios.defaults.adapter = axiosGmxhrAdapter;

axios.get("https://httpbin.org/headers").then((res) => console.log(res.data));

Description

The axios documentation describes axios adapters as modules that handle dispatching a request and settling a returned Promise once a response is received. The standard axios distribution includes adapters for the browser via xmlHttpRequest, and node.js via http and https.

Custom adapters are typically used for 'mocking' requests for testing purposes, such as axios-mock-adapter.

axios-userscript-adapter is specifically for using axios in the browser.

Chiefly, in userscript where the xmlHttpRequest function for making ajax requests is replaced with GM.xmlHttpRequest. GM.xmlHttpRequest is a privileged function available within the Greasemonkey and Tampermonkey webextensions that allow userscripts to make ajax requests that cross same origin policy boundaries. In other words, using axios, the userscript can make http requests to sites that didn't originate from the currently loaded web page. Read the GM.xmlHttpRequest function wiki page for further details.

After assigning axios-userscript-adapter as the default adapter:

var axios = require("axios");
var adapter = require("axios-userscript-adapter");

axios.defaults.adapter = adapter;

all the usual axios goodness is available within your userscript.

Requirements

axios-userscript-adapter requires axios 0.21.0 or higher

add // @grant GM.xmlHttpRequest to your userscript metadata

If you are using older version, you may grant GM_xmlhttpRequest

Installation:

npm install axios axios-userscript-adapter

Further Examples

As previously shown, you can set axios-userscript-adapter as the default adapter, in which case, all axios requests will be dispatched via GM.xmlHttpRequest. However, you can instead specify the adapter on individual requests via a config object.

console.log(axios.defaults.adapter);
axios.defaults.adapter = axiosGmxhrAdapter;

axios.get("https://httpbin.org/headers");

Example with webpack:

var axios = require("axios");
var adapter = require("axios-userscript-adapter");

// Send a POST request using GM.xmlHttpRequest
axios({
  method: "post",
  url: "https://www.different-server.com/user/12345",
  data: {
    firstName: "Fred",
    lastName: "Flintstone",
  },
  adapter: adapter,
});

or via any requests made by an instance:

var axios = require("axios");
var adapter = require("axios-userscript-adapter");

var instance = axios.create({
  // `url` is the server URL that will be used for the request
  url: "https://www.different-server.com/user",

  // `method` is the request method to be used when making the request
  method: "post",

  // `adapter` allows custom handling of requests which makes testing easier.
  // Return a promise and supply a valid response.
  adapter: adapter,
});

// Send a POST request using GM.xmlHttpRequest
instance.request({
  data: {
    firstName: "Fred",
    lastName: "Flintstone",
  },
});

esm is also supported:

import adapter from "axios-userscript-adapter";

thanks

axios-userscript-adapter is forked from axios-gmxhr-adapter

Licence

MIT