aws-amplify / aws-amplify/docs
Amplify PubSub - Production builds do not open websocket
- Dominant language
- MDX
- Stars
- 506
- Forks
- 1.1k
- Avg merge
- 3h 14m
- Merged PRs (30d)
- 1
Description
### Before opening, please confirm:
- [X] I have [searched for duplicate or closed issues](https://github.com/aws-amplify/amplify-js/issues?q=is%3Aissue+) and [discussions](https://github.com/aws-amplify/amplify-js/discussions).
- [X] I have read the guide for [submitting bug reports](https://github.com/aws-amplify/amplify-js/blob/main/CONTRIBUTING.md#bug-reports).
- [X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.
### JavaScript Framework
Vue
### Amplify APIs
PubSub
### Amplify Categories
Not applicable
### Environment information
```
# Put output below this line
```
### Describe the bug
This may be related to aws-amplify/amplify-js#10829.
It could be related to my implementation of the Amplify initialization in Quasar.
When using the PubSub module, websockets are not opened by the framework with production builds. There is no error message.
Development builds works properly.
### Expected behavior
Websockets should be opened on both development build and production builds.
### Reproduction steps
I have a Vue.js application, built with Vite and Quasar. Versions are:
```json
"dependencies": {
"@aws-amplify/ui-vue": "^3.1.7",
"@quasar/extras": "^1.0.0",
"aws-amplify": "^5.0.14",
"graphql-tag": "^2.12.6",
"pinia": "^2.0.28",
"quasar": "^2.6.0",
"vue": "^3.2.45",
"vue-router": "^4.1.6"
},
"devDependencies": {
"@quasar/app-vite": "^1.0.0",
"autoprefixer": "^10.4.2",
"eslint": "^8.10.0",
"eslint-config-prettier": "^8.1.0",
"eslint-plugin-vue": "^9.0.0",
"postcss": "^8.4.14",
"prettier": "^2.5.1"
},
```
I setup Amplify during the Quasar boot and the Amplify init looks like this:
```javascript
import { boot } from "quasar/wrappers";
import { Amplify } from "aws-amplify";
import { AWSIoTProvider } from "@aws-amplify/pubsub/lib/Providers";
export default boot(() => {
Amplify.configure({
Auth: {
identityPoolId: '',
region: '',
identityPoolRegion: '',
userPoolId: '',
userPoolWebClientId: '',
mandatorySignIn: true,
}
});
Amplify.addPluggable(
new AWSIoTProvider({
aws_pubsub_region: '....',
aws_pubsub_endpoint: '....'
})
);
});
```
And the subscription is performed like this:
```javascript
PubSub.subscribe('my-topic').subscribe({
next: (data) => handleNotification(data),
error: (error) => console.error(error),
close: () => console.debug("Subscription closed"),
complete: () => console.debug("Subscription complete"),
});
```
Also, I have in my index.html and quasar.config.js the magic lines to make Amplify work with production packaging:
index.html
```html
window.global = window;
var exports = {};
```
quasar.config.js:
```javascript
extendViteConf(viteConf, { isClient, isServer }) {
Object.assign(viteConf.resolve.alias, {
"./runtimeConfig": "./runtimeConfig.browser",
});
```
When testing the application with `quasar dev`, the subscription is performed.
With a production build, the websocket request is never opened by the web browser, but no error message is shown.
### Additional information and screenshots
With `Amplify.Logger.LOG_LEVEL = 'DEBUG'` activated, production builds have no reference to MqttOverWSProvider in the logs, when dev builds properly show the MqttOverWSProvider, and it work.
I found a possible workaround, it seems that adding the AWSIoTProvider pluggable directly using the PubSub API instead of using the Amplify API API works:
```javascript
PubSub.addPluggable(
new AWSIoTProvider({
aws_pubsub_region: '....',
aws_pubsub_endpoint: '....'
})
);
```
Contributor guide
Assessment
This issue has not been assessed yet.