ApolloServer: "Could not connect to websocket endpoint ws://localhost:4000/subscriptions. Please check if the endpoint url is correct." - docker

I can't implement any subscriptions because it suddenly disconnects from it when I try to listen to some endpoint with GraphQL Playground:
{"error": "Could not connect to websocket endpoint wss://localhost:4000/graphql. Please check if the endpoint url is correct."}
I'm using ApolloServer alone, no express or anything else. It is containerized with Docker using node14 image, the port is properly fowarded, queries and mutations works properly.
This is the configuration snippet:
const server = new ApolloServer({
typeDefs: mergedTypeDefs,
resolvers: mergedResolvers,
playground: {
subscriptionEndpoint: 'ws://localhost:4000/graphql'
},
subscriptions: {
keepAlive: 9000,
onConnect: (connParams, webSocket, context) => {
console.log('CLIENT CONNECTED');
},
onDisconnect: (webSocket, context) => {
console.log('CLIENT DISCONNECTED')
}
},
context: {
models
}
});
I tried everything, from using 'wss' instead of 'ws' to change the path. I checked for typos and didn't find one. What bothers me is that the paths are the same so It should at least try to notify me by the onConnect or onDisconnect but it doesn't.
This is the message through Chrome's dev tools:
WebSocket connection to 'wss://localhost:4000/graphql' failed: WebSocket is closed before the connection is established.
I tested subscriptions with a 'tutorial' project outside the container and it works fine.
Sometimes, the only function of subscriptions that works is onDisconnect but after 2-5 seconds after receiving the error message on PlayGround, and Still it doesn't gives me any insight on the problem.
Any help or suggestion is appreciated.

wss will definitely not work locally without certificate, so use ws as a protocol.
If it works without Docker, then everything should be fine code-wise.
You should also make sure that you've mapped ports correctly, i.e. exposed port 4000 https://docs.docker.com/engine/reference/commandline/run/#publish-or-expose-port--p---expose

Related

Protocol error when calling puppeteer.connect()

I am using the basic approach as set out in this post to connect from a client docker container to any one of a number of chrome docker containers (in a docker swarm/service, potentially across several servers behind nginx, deployed using CapRover).
In each chrome container I maintain a pool (just a simple array) of browser objects, and direct incoming requests to an appropriate browser as follows (very similar to the linked post):
import http from 'node:http'; // https://nodejs.org/api/http.html
import httpProxy from 'http-proxy'; // https://www.npmjs.com/package/http-proxy
const proxy = new httpProxy.createProxyServer({ ws: true });
// an array (pool) of pre-launched and managed browser objects...
const browsers = [ ... ];
http
.createServer()
.on('upgrade', (req, socket, head) => {
const browser = browsers[Math.floor(Math.random() * browsers.length)]; // in reality I don't just pick a browser at random
const target = browser.wsEndpoint();
proxy.ws(req, socket, head, { target });
})
.listen(3222);
The above is listening at ws://srv-captain--chrome:3222 (communication is "internal" over the docker network between containers).
Then, in my client container, I connect to the common endpoint ws://srv-captain--chrome:3222 as follows:
import puppeteer from 'puppeteer'; // https://www.npmjs.com/package/puppeteer (using version 17.1.3 at time of posting this)
try {
const browser = await puppeteer.connect({ browserWSEndpoint: 'ws://srv-captain--chrome:3222' });
} catch (err) {
console.error('error connecting to browser', err);
}
This works really well, except that I am getting occasional/inconsistent errors like these when calling puppeteer.connect() in the client container above:
Protocol error (Emulation.setDeviceMetricsOverride): Session closed. Most likely the page has been closed.
Protocol error (Performance.enable): Target closed.
Almost always, if I simply try to connect again, the connection is made without further error, and at the first attempt.
I have no idea why the error is complaining that the page has been closed or Target closed since, at this point in the process, I'm not attempting to interact with any page, and I know from listening for browser.on('disconnected'...), and also monitoring the chromium processes themselves, that each browser in the array is still working fine... none has crashed.
Any idea what's going on here?
UPDATE after further testing
Of course, in the client container we don't connect to a browser just for the sake of it, like in the above snippet, but to open a page and do some stuff with the page. In practice, in the client container it's more like the following test snippet:
const doIteration = function (i) {
return new Promise(async (resolve, reject) => {
// mimic incoming requests coming in at random times over a short period by introducing a random initial delay...
await new Promise(resolve => setTimeout(resolve, Math.random() * 5000));
// now actually connect...
let browser;
try {
browser = await puppeteer.connect({ browserWSEndpoint: `ws://srv-captain--chrome:3222?queryParam=loop_${i}` });
} catch (err) {
reject(err);
return;
}
// now that we have a browser, open a new page...
const page = await browser.newPage();
// do something useful with the page (not shown here) and then close it..
await page.close();
// now disconnect (but don't close) the browser...
browser.disconnect();
resolve();
});
};
const promises = [];
for (let i = 0; i < 15; i++) {
promises.push( doIteration(i) );
}
try {
await Promise.all(promises);
} catch (err) {
console.error(`error doing stuff`, err);
}
Each iteration above is being performed multiple times concurrently... I am using Promise.all() on an array of iteration promises to mimic multiple concurrent incoming requests in my production code. The above is enough to reproduce the problem... the error doesn't happen on calling puppeteer.connect() with every iteration, just some.
So there seems to be some sort of interplay between opening/closing a page in one iteration, and calling puppeteer.connect() in another, despite closing the page and disconnecting the browser properly in each iteration? This probably also explains the Most likely the page has been closed error message when calling puppeteer.connect() if there is some hangover relating to a page closed in another iteration... though for some reason this error occurs when calling puppeteer.connect()?
With the use of a pool of browser objects in the browsers array, and a docker swarm having multiple containers on multiple servers, each upgrade message could be received at a different container (which could even be on a different server) and could be routed to a different browser in the browsers array. But I now think that this is a red herring, because in the further testing I narrowed the problem down by routing all requests to browsers[0] and also scaling the service down to just one container... so that the upgrade messages are always handled by the same container on the same server and routed to the same browser... and the problem still occurs.
Full stacktrace for the above-mentioned error:
Error: Protocol error (Emulation.setDeviceMetricsOverride): Session closed. Most likely the page has been closed.
at CDPSession.send (file:///root/workspace/myclientapp/node_modules/puppeteer/lib/esm/puppeteer/common/Connection.js:281:35)
at EmulationManager.emulateViewport (file:///root/workspace/myclientapp/node_modules/puppeteer/lib/esm/puppeteer/common/EmulationManager.js:33:73)
at Page.setViewport (file:///root/workspace/myclientapp/node_modules/puppeteer/lib/esm/puppeteer/common/Page.js:1776:93)
at Function._create (file:///root/workspace/myclientapp/node_modules/puppeteer/lib/esm/puppeteer/common/Page.js:242:24)
at runMicrotasks (<anonymous>)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Target.page (file:///root/workspace/myclientapp/node_modules/puppeteer/lib/esm/puppeteer/common/Target.js:123:23)
at async Promise.all (index 0)
at async BrowserContext.pages (file:///root/workspace/myclientapp/node_modules/puppeteer/lib/esm/puppeteer/common/Browser.js:577:23)
at async Promise.all (index 0)
As I dug deeper and deeper into this problem, it become more and more apparent that I might not actually be doing anything fundamentally wrong, and that this might just be a bug in puppeteer itself. So I reported those as an issue over on puppeteer... and indeed, it is acknowledged as a bug for any version later than 15.5.0, and is being fixed. In the meantime, the workaround is to revert to puppeteer version 15.5.0 and to be careful when calling browser.pages() when concurrent connections are being used, because that might itself throw an error... but I understand that this too might be something that they can/will fix so that browser.pages() is more resilient to the presence of concurrent connections.

Unable to connect to Firebase Emulator with iOS device

I am trying to connect with an iOS device to the Firebase Auth and RealTime Database Emulator.
The thing is, I can connect and use emulator through Firebase Admin using NodeJS on local machine (trough http://localhost:9000?ns=my-project).
Also I am able to connect with an iOS device to the remote Firebase server... But locally it doesn't work. It throws bunch of random errors, like this (when I try to complete registration/authentication):
Error Domain=NSURLErrorDomain Code=-1004 "Could not connect to the
server." NSLocalizedDescription=Could not connect to the server.,
NSErrorFailingURLStringKey=http://192.168.1.3:9099/www.googleapis.com/identitytoolkit/v3/relyingparty/signupNewUser?key=myKeyGoesHere
and
Optional(Error Domain=com.firebase.core Code=1 "Unable to get latest
value for query FQuerySpec (path: /news, params: { }), client offline
with no active listeners and no matching disk cache entries"
Here is firebase.json:
{
"database": {
"rules": "database.rules.json"
},
"emulators": {
"auth": {
"port": 9099
},
"database": {
"port": 9000
},
"ui": {
"enabled": true
}
}
}
I changed rules just in case:
{
"rules": {
".read": true,
".write": true
}
}
but its not that.
and here is how I try to connect to database in my iOS application(my FirebaseManager class):
init(){
Auth.auth().useEmulator(withHost:"192.168.1.3", port:9099)
}
private lazy var newsNodeRef:DatabaseReference? = {
guard let urlString = getBaseURL() else {return nil}
let node = LocalConstants.kNewsRef // this has value of 'news'
return Database.database(url: urlString).reference(withPath: node)
}()
private func getBaseURL()->String?{
let environment = Environment()
guard let connectionProtocol = environment.configuration(PlistKey.firebaseConnectionProtocol), let baseURL = environment.configuration(PlistKey.firebaseDatabaseURL) else {return nil}
let urlString = "\(connectionProtocol)://\(baseURL)"
return urlString // this produces something like 'http://192.168.1.3:9000?ns=my-project' (its fetched from Configuration Settings file based on selected environment)
}
the thing is, the exact same setup works on remote server, if I just change the environment(which automatically changes base url).
I have also allowed insecure http loads in info.plist, just to be sure if it is not that, but still doesn't work.
This is what I get in console when I run emulators:
What is the problem here?
I replied a little late 😊.
I saw the solution you found. It didn't work for me but I'm sure it has worked for a lot of people.
I found a solution too.
Actually, I couldn't see a problem for iOS 15. My problem was that it didn't work on iOS 14 and earlier.
Solution;
First, you need the MacBook's IP address.
To find the IP address;
You can access it right under System preferences -> Network -> Status.
Then we need to make some changes in the firebase.json file.
Adding “host” : “IP” for each part.
Overwrite the “host” part with the “port” part.
"emulators": {
"auth": {
"host": "192.168.1.11”,
"port": 9100
},
"functions": {
"host": "192.168.1.11”,
"port": 5002
},
"firestore": {
"host": "192.168.1.11”,
"port": 8081
},
"database": {
"host": "192.168.1.11",
"port": 9001
},
"storage": {
"host": "192.168.1.11",
"port": 9200
},
"ui": {
"enabled": true
}
Then we need to add in swift codes.
We need to write the IP address in the host part.
More precisely, we will replace the parts that say localhost with the IP address.
let settings = Firestore.firestore().settings
settings.host = "192.168.1.11:8081"
settings.isPersistenceEnabled = false
settings.isSSLEnabled = false
Firestore.firestore().settings = settings
Storage.storage().useEmulator(withHost:"192.168.1.11", port:9200)
Auth.auth().useEmulator(withHost:"192.168.1.11", port:9100)
let db = Database.database(url:"http://192.168.1.11:9001?ns=firebaseappname")
Functions.functions().useFunctionsEmulator(origin: "http://192.168.1.11:5002")
I think this solution will work in JS, android and other languages.
I would appreciate it if you tried this solution and let me know if it works.
It worked for me.
I actually solved it. The solution/problem, I don't even know how to declare it, was with Local Network Access prompt & permissions and its buggy behaviour (as well how I was trying to access my Mac by ip).
At first I didn't even see a prompt shows every time, but I guess it was related to a wrong setup of a port, host etc.
But when I correctly set local computer's ip and reverted firebase.json to it's default settings (which is what worked for me), the prompt started to jump out every time.
The thing is, prompt's behaviour seems broken, because instead of jumping before you try to access devices in a local network, it pops out after that action is made. Quite fast, but still after Auth system responded, which doesn't make sense.
Here, it can be confusing, cause error that is returned from a Firebase Auth system in the case when you didn't allow Local Network Access usage, doesn't really tell you much about real cause. See my ( original question) above to see the errors.
After that terrible flow, I allowed access trough the prompt. Once I did that, on every next 'api' call towards Emulator was successful. Worked like a charm.
The real problem here is Local Network Access prompt. Cause we don't have at all control over it, so we can't that easily trigger it, or easily get info what user have selected/chosen at the moment / or before. It's triggered by the system in certain conditions.
Luckily this is just for development :) but I hope it will be fixed/improved soon, cause it should.
I found a lot about this topic and its considered as a bug Local Network Access Prompt problems on Dev portal:
I was also faced the same problem while using the firebase auth in iOS simulator
then i change my code little bit
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
if (Platform.isAndroid) {
await FirebaseAuth.instance.useAuthEmulator('localhost', 9099);
}
runApp(const MyApp());
}
I have made a check for only android and it works for me
Inside this method you can see it only works for android.

what is MQTT url to my thingsboard instance

I have a thingsboard UI available at "thingsboard.MYDOMAIN.io:8080". I'm using NodeJS and MQTT.js. I can connect using the sample code on that page. But I don't know what URL i would use in that connect string. I've tried using that URL and putting MQTT:// on the front of it to no avail.
It's just one device coming into a thingsboard. I wouldn't think i would need to add anything other than the default thingsboard.
If someone could tell what the expect default URL would be?
The default MQTT port number is 1883 so something like
mqtt://thingsboard.mydomain.io:1883
would be a good starting point. You should even be able to leave the port number off e.g.
mqtt://thingsboard.mydomain.io
Connection code should be something like this:
var mqtt = require('mqtt');
const thingsboardHost = "127.0.0.1";
const ACCESS_TOKEN = "**********";
// Initialization of mqtt client using Thingsboard host and device access token
console.log('Connecting to: %s using access token: %s', thingsboardHost, ACCESS_TOKEN);
var client = mqtt.connect('mqtt://'+ thingsboardHost, { username: ACCESS_TOKEN });
The default MQTT port number is 1883, but you don't have to manually set that value. Take a look at the source code.
https://github.com/mqttjs/MQTT.js

Unable to connect to MQTT broker via ngx-mqtt in angular8

No matter what i do i can't connect to a mqtt broker via websocket in my angular application (trying in chrome and firefox).
For simplicity i'm using HiveMQ broker, i've published on the topic /gat/38/openReservationRequests some data
I've followed this medium article on how to connect to mqtt in angular using ngx-mqtt but for me it is not working.
In my app:
I've installed the module
npm install ngx-mqtt --save
i've added the configuration and set the module forRoot in my app.module.ts
...
export const MQTT_SERVICE_OPTIONS: IMqttServiceOptions = {
connectOnCreate: true,
hostname: 'broker.hivemq.com',
port: 8000,
path: '/gat/38/openReservationRequests',
protocol: 'ws',
};
...
imports: [
...
MqttModule.forRoot(MQTT_SERVICE_OPTIONS),
...
],
...
i'm executing this function inside the ngOnInit of app.component.ts
...
import { IMqttMessage, MqttConnectionState, MqttService } from 'ngx-mqtt';
...
constructor(private mqttService: MqttService) {
this.mqttService.state.subscribe((s: MqttConnectionState) => {
const status = s === MqttConnectionState.CONNECTED ? 'CONNECTED' : 'DISCONNECTED';
this.status.push(`Mqtt client connection status: ${status}`);
});
}
ngOnInit() {
this.subscription = this.mqttService
.observe('/gat/38/openReservationRequests')
.subscribe((message: IMqttMessage) => {
this.msg = message;
console.log('msg: ', message);
console.log('Message: ' + message.payload.toString() + 'for topic: ' + message.topic);
console.log('subscribed to topic: ' + /gat/38/openReservationRequests);
});
}
but i am always getting this error:
core.js:6014 ERROR TypeError: Cannot read property 'resubscribe' of undefined
at MqttClient.subscribe (mqtt.min.js:1)
at mqtt.service.js:211
at Observable._subscribe (using.js:8)
at Observable._trySubscribe (Observable.js:42)
at Observable.subscribe (Observable.js:28)
at FilterOperator.call (filter.js:13)
at Observable.subscribe (Observable.js:23)
at Observable.connect (ConnectableObservable.js:30)
at RefCountOperator.call (refCount.js:17)
at Observable.subscribe (Observable.js:23)
mqtt.min.js:1 WebSocket connection to 'ws://broker.hivemq.com:8000/gat/38/openReservationRequests' failed: Connection closed before receiving a handshake response
if i specify the clientId inside the MQTT_SERVICE_OPTIONS i still get the same error.
if i change the protocol to wss i get a different error:
core.js:6014 ERROR TypeError: Cannot read property 'resubscribe' of undefined
at MqttClient.subscribe (mqtt.min.js:1)
at mqtt.service.js:211
at Observable._subscribe (using.js:8)
at Observable._trySubscribe (Observable.js:42)
at Observable.subscribe (Observable.js:28)
at FilterOperator.call (filter.js:13)
at Observable.subscribe (Observable.js:23)
at Observable.connect (ConnectableObservable.js:30)
at RefCountOperator.call (refCount.js:17)
at Observable.subscribe (Observable.js:23)
mqtt.min.js:1 WebSocket connection to 'wss://broker.hivemq.com:8000/gat/38/openReservationRequests' failed: Error in connection establishment: net::ERR_CONNECTION_CLOSED
If i try to connect manually inside my app.component.ts ngOnInit before observing the topic:
this.mqttService.connect({
hostname: 'broker.hivemq.com',
port: 8000,
path: '/gat/38/openReservationRequests',
clientId: '34er23qwrfq42w3' //those are just random digits
});
i still get the error above.
For me it would be ideal to connect in some inner component (accessible after the user is authenticated) because i will have my private mqtt broker and the topic will depend on the logged user information.
I've tried any combination of protocol with/without cliendId etc but at this point i don't know what is wrong. I've already fully recompiled my app lots of times, i've tried publishing it on my test-server which has a ssl certificate but nothing changed.
Resolved thanks to #Anant Lalchandani i set the correct path.
The other problem was that '/mytopic' and 'mytopic' are indeed two different topic and i was using it wrong too.
This is my code, updated:
app.module.ts
export const MQTT_SERVICE_OPTIONS: IMqttServiceOptions = {
connectOnCreate: false,
hostname: 'broker.hivemq.com',
port: 8000,
path: '/mqtt'
};
appcomponent.ts (inside ngOnInit for now)
this.mqttService.connect({
hostname: 'broker.hivemq.com',
port: 8000,
path: '/mqtt',
clientId: '1234e3qer23rf'
});
this.mqttService.onConnect
.subscribe(
connack=> {
console.log('CONNECTED');
console.log(connack);
}
);
this.mqttService.observe('gat/38/openReservationRequests')
.subscribe((message: IMqttMessage) => {
this.msg = message;
console.log(new TextDecoder('utf-8').decode(message.payload));
});
I have checked the code snippets you shared in question.
In your app.module.ts, the path value should be '/mqtt'. You have set the topic as the value of path here. The topic can only be subscribed/published. As you are using a topic as a path value at the time of connecting to a websocket, your application will not be able to connect to websocket at the first place.
The reason why we need to use /mqtt as a path is it specifies you are sending MQTT messages over the WebSocket protocol.
The documentation of HiveMQ itself stated to use the path as '/mqtt' in its example. You can check the documentation here.

Unable to replicate database in pouchDB

I'm trying a react native application using couchDB 2.1.1. PouchDB entry in package json looks like this:
"pouchdb": "^6.3.4",
"pouchdb-react-native": "^6.3.4",
Replication is as shown below:
const localDB = new PouchDB('employee');
const remoteDB = new PouchDB('http://username:password#localhost:5984/employee');
localDB.replicate.from(
remoteDB,
(err, response) => {
if (err) {
return console.log(err);
}
},
);
I get following error:
{"code":"ETIMEDOUT","status":0,"result":{"ok":false,"start_time":"...","docs_read":0,"docs_written":0,"doc_write_failures":0,"errors":[],"status":"aborting","end_time":"...","last_seq":0}}
Almost all the times this works fine when I run the app in debug mode. Tried ajax timeout as shown here PouchDB ETIMEDOUT error. This didn't work. Is there something that I'm supposed to look in my code? Please help.
Had the same issue, the following fixed it for me:
Use your PC ip address instead of localhost
Configure your firewall
to allow connections on port 5984 OR just disable it (Not
recommended)

Resources