Getting "TypeError: undefined is not a constructor (evaluating 'new url_1.URL)"

[rishimohan]

Prerequisites

• [x ] Put an X between the brackets on this line if you have done all of the following:
  • Checked that your issue isn't already filed: [open issues]
  • Checked the [bug report guidelines]

Description

Trying to run the readme example, it is throwing error Unhandled Promise Rejection: TypeError: undefined is not a constructor (evaluating 'new url_1.URL(https://api.twitter.com/2/${endpoint})').

Steps to Reproduce

1. Init Twitter v2 and try to console log data as below

const Twitter = require('twitter-v2');

const client = new Twitter({
  consumer_key: '',
  consumer_secret: '',
  access_token_key: '',
  access_token_secret: '',
});

const { data } = await client.get('tweets', { ids: '1228393702244134912' });
console.log(data);

2. This will throw the error mentioned above and shown in the screenshot

Expected behavior:

It should console the response

Actual behavior:

It throws error as shown in the above screenshot

Reproduces how often:

All the time

1.1.0

[rishimohan]

@HunterLarco I feel like there's something obvious that I'm missing, can you please help, thanks!

[spidgorny]

These parameters should not be empty.

  consumer_key: '',
  consumer_secret: '',
  access_token_key: '',
  access_token_secret: '',

[rishimohan]

@spidgorny I did place the keys in place

[HunterLarco]

url.URL isn't available on your system

@rishimohan Are you running this in a browser instead of within node?

[rishimohan]

Yep, I'm trying to show the data in browser. It's a client app that I'm working on, Nextjs and Netlify.

Would there be any possibility of using this library to show the data on the browser?

[spidgorny]

It would be rather bad to make your twitter secret keys accessible in the browser. I also use next.js - all my Twitter API is done in /pages/api/ routes. Besides, I don't think it was ever supposed to work directly in the browser.

[rishimohan]

@spidgorny I did get it resolved using API routes to fix the CORS issue. I know it's not exactly related to this library but can you also share how are you protecting the middleware API file and organizing it.

Like right now I have file api/homeTimeline.js which basically makes requests to statuses/home_timeline. Now I am facing two issues:

1 - I couldn't figure out any way to have all the requests in one single file, ex:

I want to have api/requests.js file and in this file I want to have multiple request functions like ex. homeTimeline, mentionsTimeline and all other requests I need in the app which can be imported and used. I am not sure if something like this would be possible.

2 - Again, let's say we have api/homeTimeline.js which makes requests to Twitter API and resolves to the returned object. Now the issue is when I open http://localhost:3000/api/homeTimeline page in browser, it's accessible and shows the return object in plain text in the browser. I don't want it to be accessible directly in the browser and only internally while making request.

If you have any suggestions regarding this then I would really appreciate if you can help me with it. Oh yeah, I am using Next.js. Thanks :)

[HunterLarco]

@spidgorny is correct. This library is not intended for use in the browser (and generally it's not a great idea to leak your secrets in the browser). I'd suggest running a thin server between twitter and your client to handle twitter api requests.

Unfortunately I'm not familiar with Next.js so I'll have to leave help with that to the community =)