Using Saved OAuth1.0 Login Component in Multiple Workflows: Is it Possible?

This topic was automatically generated from Slack. You can find the original thread here.

I made an oauth1.0 login for an API I use and saved the component to my actions. When I duplicate the component in that workflow it has all my encrypted key/secret/token/secret token saved and I can use it again. When I try to use the same saved component in another workflow it asks for all of them again. Is there a way to save them so I can use them on multiple workflows? Do I need to make a whole new set of tokens for every workflow? Will it still allow me to use the old tokens on the original workflow?

I made the token creation on replit using GPT help but since I have no idea what I’m doing I don’t really remember how I did it. I still have it saved so ideally I’d like to create a proper login component that would port the replit work over to pipedream and allow me or anyone else to login.

Any tips?

I’d recommend making an integration request so we can add this to the platform for all users. Then you can just connect your account like any other integrated app. Would that work?

I think so. I’ve had the request open a while but I think its at the back of the queue. Possibly because of the oauth1.0 issue. [APP] Discogs · Issue #5423 · PipedreamHQ/pipedream · GitHub

got it, yes, we do have to do some work to support signing requests in OAuth 1.0

(unique for each app)

Can I send you my work privately and you take a quick look and see if it looks legit or a waste of time?

our implementation would likely be a little different since we handle this on our backend. Really it’s just getting the time for an engineer to actually focus on it. But we’ll try to get to it ASAP

Sure, thanks!

So for now, just run the oath token creation tool in replit for every instance of a workflow I need it for? There’s currently no more efficient way to do it?

yeah if you have it in Repl.it I’d recommend sticking with that. Technically you can call a workflow to do the OAuth 1.0 signing, as well. But you’d need some service to handle that, no way around the signing piece AFAIK

(and the token generation)

Should this work?

  1. Go to your Pipedream home page, and click on the top-right dropdown menu (where your avatar is), then click on “Account Settings”.
  2. In the left sidebar, click on “Environment Variables”, then click on “Add New Variable”.
  3. Enter the name of your variable (e.g., “CONSUMER_KEY”) and its value, then click “Add Variable”. Repeat this process for each of your secrets.
  4. In your components, replace your secrets with the corresponding environment variables. For example, replace 'tkYYjYpAeKDGlYvEwKmT' with process.env.CONSUMER_KEY.

yes, environment variables are a fine way to store static keys if you’re hoping to do some abstraction like you mentioned

Is there anything wrong with this code? Specifically the way I’m trying to use the environmenal variables? It seems the consumer key and consumer secret work but the oauth token and secret token don’t. When I enter the raw values in a prop field it works but trying to use the process.env.Discogs_oauth_token and process.env.Discogs_oauth_token_secret isn’t working for me right now? Do I need to add those as prop fields too or can they be hard coded?

import { axios } from "@pipedream/platform";
import OAuth1 from "oauth-1.0a";
import crypto from "crypto";

export default {
  name: "Discogs Orders",
  key: "discogs_order_import",
  version: "1.0.0",
  type: "action",
  props: {
    listingId: {
      type: "string",
      label: "Listing ID",
      description: "The ID of the listing to fetch",
    },
  },
  async run() {
    const {
      listingId,
    } = this;

    const discogsConsumerKey = process.env.Discogs_consumer_key;
    const discogsConsumerSecret = process.env.Discogs_consumer_secret;
    const discogsAccessToken = process.env.Discogs_oauth_token;
    const discogsAccessTokenSecret = process.env.Discogs_oauth_token_secret;

    const url = `https://api.discogs.com/marketplace/listings/${listingId}`;

    const oauth = new OAuth1({
      consumer: { key: discogsConsumerKey, secret: discogsConsumerSecret },
      signature_method: "HMAC-SHA1",
      hash_function(base_string, key) {
        return crypto
          .createHmac("sha1", key)
          .update(base_string)
          .digest("base64");
      },
    });

    const requestData = { url, method: "GET" };
    const token = { key: discogsAccessToken, secret: discogsAccessTokenSecret };

    const response = await axios(this, {
      method: "GET",
      url,
      headers: oauth.toHeader(oauth.authorize(requestData, token)),
    });

    console.log(response); // Log the response data

    return response;
  },
};

Based on the code you provided, it seems that you’re using environment variables correctly. However, if you’re having issues with the Discogs_oauth_token and Discogs_oauth_token_secret environment variables, you can try the following: 1. Double-check that you’ve set the environment variables correctly in your Pipedream account settings. Make sure there are no typos or extra spaces. 2. If you still face issues, you can try passing the OAuth token and secret token as props instead of using environment variables. This way, you can input the values directly when using the component in a workflow. Here’s an example of how to modify your component to use props: ```
export default { // … props: { listingId: { type: “string”, label: “Listing ID”, description: “The ID of the listing to fetch”, }, discogsAccessToken: { type: “string”, label: “Discogs Access Token”, description: “Your Discogs OAuth access token”, }, discogsAccessTokenSecret: { type: “string”, label: “Discogs Access Token Secret”, description: “Your Discogs OAuth access token secret”, }, }, async run() { const { listingId, discogsAccessToken, discogsAccessTokenSecret, } = this; // … const token = { key: discogsAccessToken, secret: discogsAccessTokenSecret }; // … }, };

If my code includes:

price: {
      type: "number",
      label: "Price",
      description: "The price of the item (in the seller's currency)",
      optional: true,
    },

but returns the result “Code Error
unsupported type for prop price: number”

What do I use instead of number? I thought price was not an integer because it has decimal places?

In Pipedream components, the number type is not supported for props. Instead, you can use the string type and then convert the value to a number within the component. Here’s an example of how to modify your price prop and convert it to a number in the run method: props: { price: { type: "string", label: "Price", description: "The price of the item (in the seller's currency)", optional: true, }, }, async run() { const price = parseFloat(this.price); // Rest of your code }, In this example, the price prop is defined as a string, and then it’s converted to a number using parseFloat() within the run method. This way, you can still work with decimal values.

is there any reason ctrl+a, ctrl+v etc would stop working in pipedream and not elsewhere on my computer (browser etc)

I’m not aware of any specific issues with keyboard shortcuts like Ctrl+A or Ctrl+V in Pipedream’s interface. However, it could be a temporary glitch or browser-specific issue. Here are a few suggestions to troubleshoot the problem: 1. Refresh your browser and try again. 2. Clear your browser cache and cookies, then try again. 3. Try using a different browser to see if the issue persists. 4. Disable any browser extensions that might interfere with keyboard shortcuts or the Pipedream interface. If the issue continues, I recommend reaching out to Pipedream support for further assistance. You can visit https://pipedream.com/support for more support options.