rsocket-js can not work in browser

[Tsuki]

rsocket-js can not work in borwser

Expected Behavior

Actual Behavior

Steps to Reproduce

import { RSocketClient } from 'rsocket-core';
import RSocketWebsocketClient from 'rsocket-websocket-client';

async function createClient(options) {
  const client = new RSocketClient({
    setup: {
      dataMimeType: 'text/plain',
      keepAlive: 1000000, // avoid sending during test
      lifetime: 100000,
      metadataMimeType: 'text/plain',
    },
    transport: new RSocketWebsocketClient({
      host: options.host,
      port: options.port,
    }),
  });

  return client.connect();
}

async function run() {
  const rsocket = await createClient({
    host: '127.0.0.1',
    port: 9898,
  });
//....
}

await run();

Possible Solution

Your Environment

• RSocket version(s) used:
• Other relevant libraries versions (eg. netty, ...):
• Platform (eg. JVM version (javar -version) or Node version (node --version)):
• OS and version (eg uname -a):

[Kevin Viglucci]

Hi @sudongyuer ,

Can you provide any more details about what build tooling/versions you are working with? For instance, are you using Webpack, Browserify, or something else?

I was able to create a minimal proof of concept using the current version of rsocket-js (0.0.27) + create-react-app (which uses webpack) without issue, so I suspect that this issue may be relative to the build tooling you are using, or the environment you are developing in.

Working example with CRA, for reference: https://github.com/viglucci/rsocket-js-examples/tree/main/examples/create-react-app

[Tsuki]

i use vite 2.6.4 , vue3.2.16

[Tsuki]

Thanks for your reply, i think you should remove hasBufferModule code, because i saw so many issue about this problem,and i remove hasBufferModule code, it works(so many project use vite), user don't need to care about this problem, makes it works is very improtant

[Kevin Viglucci]

Thanks for the additional information. I don't use Vue much and haven't used Vite at all, so I'll need to look a bit more into this, and experiment with RSocket-JS + Vite to see what the best solution could be for this.

[Tsuki]

OK peace and love🥶

[Kevin Viglucci]

@sudongyuer I was able to get this working in Vite by providing configuration for a polyfill for Buffer using feross/buffer.

Can you please give this a try in your project and let us know how it works for you?

npm i buffer

// vite.config.js

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    fallback: {
      'buffer': require.resolve('buffer/')
      // ^--- provide buffer polyfill
    }
  },
  plugins: [
    vue()
  ]
})

{
  "name": "my-vue-app",
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "serve": "vite preview"
  },
  "dependencies": {
    "buffer": "^6.0.3",
    "rsocket-core": "0.0.27",
    "rsocket-websocket-client": "0.0.27",
    "vue": "^3.2.16"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^1.9.3",
    "vite": "^2.6.4"
  }
}

[Kevin Viglucci]

A full working example can be found here: https://github.com/viglucci/rsocket-js-examples/tree/main/examples/vite-vue

[Tsuki]

Thanks very much～It works ,but i think it's not the best way to resolve it,should resolve it in this libary,what do you think about

[Kevin Viglucci]

Thanks for confirming the workaround.

For a long-term fix: we are working on a pretty substantial rewrite in #158, where we are also looking to improve compatibility in browser environments. Because of that, and the available workaround, I don't think there will be much need or appetite to address this in the current version.

I would recommend closing #196 in favor of our planned improvements in #158, and leveraging the workaround in the meantime if possible.