Socket.io-client: 認識されないWebSocket接続オプション `agent`、` perMessageDeflate`、 `pfx`、` key`、 `passphrase`、` cert`、 `ca`、` ciphers`、 `rejectUnauthorized`。 これらを「ヘッダー」の下に置くつもりでしたか？

同じ問題:(

+1

+1

+1

少なくとも12月18日までさかのぼって問題に

+1

+1

+1

+1

React-Nativeでsocket.io（2.2.0）を使用していると、まだこの警告が表示されます。 デバイス画面の黄色いボックスを次のように消音できます。

import { YellowBox } from 'react-native'

YellowBox.ignoreWarnings([
  'Unrecognized WebSocket connection option(s) `agent`, `perMessageDeflate`, `pfx`, `key`, `passphrase`, `cert`, `ca`, `ciphers`, `rejectUnauthorized`. Did you mean to put these under `headers`?'
])

しかし、私はまだコンソールでこの迷惑な警告を受け取ります...

「socket.io-client」にダウングレード：「2.1.0」ですべてOK

私にとっては、2.1.1にダウングレードしたときに機能しました。
yarn add [email protected]

パッケージの他のマイナーバージョンを受け入れると思われるバージョンsocket.io-client@^2.1.1前に^記号を追加していたため、最初は機能しませんでした。

まだ問題@ 2.2.0

socket.io-clientを1.7.2にダウングレードしてみてください。うまくいきます。

まだ問題@ ^ 2.3.0

それでもreact-nativeの問題v2.3.0

@ 2.1.1はOKです。 しかし、2.3.0はRN0.61.1で警告メッセージをスローします

これまでの解決策

まだreact-nativeの問題v2.3.0

やあみんな！ v2.1.1にダウングレードすることで、この問題を修正し

古いバージョンを完全に削除し、キャッシュをクリアしてください。

1. package.jsonからsocket.io-clientを削除し、package-lock /yarn.lockファイルを削除することをお勧めします。
2. node_modulesフォルダー全体を削除します（最初から
3. npmインストールソケット。

完了！ これはreact-nativeとreact-native-webで機能するはずです！

react-native: 0.61.4同じ問題が発生しますが、どういうわけかアプリがクラッシュしています。警告が原因で発生しているのか、別のソケット関連のものであるのかわかりませんが、ソケットに接続しようとすると、アプリが閉じます。

これは私のconfです：
{ autoConnect: false, reconnectionDelay: 1000, reconnection: true, transports: ['websocket'], agent: false, // [2] Please don't set this to true upgrade: false, rejectUnauthorized: false }

ソケットがすでに接続されている場合、 socket.openクラッシュしますか？

この警告はここでReactNative/WebSocket.js:117によって発生します。これは、EngineIO（内部でSocketIOによって使用される）がEngineIO/websocket.js:121を介して公開されたReactNative WebSocket実装を参照し、 optsが渡されるためです。警告メッセージに記載されています。 不思議なことに、EngineIOメンテナがコメントを介して記述したこれらの追加プロパティは、「Node.jsクライアントのSSLオプション」です。

以下のコードのようなものをEngineIO/websocket.js:114に挿入して、WebSocketコンストラクターに与えられたopts EngineIO/websocket.js:114を操作することにより、 opts内のすべての無関係なキーを削除して、警告がに表示されないようにします。そもそも（ omitはLodashからインポートされ、やり直すことができます）。

// lib/transports/websocket.js
...
if (this.isReactNative) {
  // prettier-ignore
  opts = omit(opts, ['agent', 'perMessageDeflate', 'pfx', 'key', 'passphrase', 'cert', 'ca', 'ciphers', 'rejectUnauthorized']);
}
...

あなたは、単に経由で警告をミュート含まない解決策を探しているならYellowBox.ignoreWarnings 、あなたは完全にオーバーライドすることができますdoOpenで定義したEngineIO/websocket.js:87以下のようなものを追加することにより、 、ReactNativeプロジェクトのエントリポイント（通常はindex.js 。

// index.js
...
+ import 'patches/EngineIOHeaderWarning';
...

// patches/EngineIOHeaderWarning.js
const WS = require('engine.io-client/lib/transports/websocket');

var WebSocketImpl = WebSocket; // eslint-disable-line no-undef

WS.prototype.doOpen = function() {
  if (!this.check()) {
    // let probe timeout
    return;
  }

  var uri = this.uri();
  var protocols = this.protocols;
  var opts = {};

  if (this.extraHeaders) {
    opts.headers = this.extraHeaders;
  }
  if (this.localAddress) {
    opts.localAddress = this.localAddress;
  }

  try {
    this.ws = new WebSocketImpl(uri, protocols, opts);
  } catch (err) {
    return this.emit('error', err);
  }
};

全体として、EngineIOのプルリクエストを作成して、 this.isReactNativeを介してReactNativeで使用するときに不要なこれらの余分なoptsを除外すると、SocketIOクライアントを使用しているすべてのユーザーに対してこの警告を抑制することができます。 ReactNativeプロジェクト。

あなたはしたい：

• [x] _bug_を報告する
• [] _feature_をリクエストする

現在の動作

空白のReactNative Expoプロジェクトにsocket.io-clientをインストールすると、次のような黄色のメッセージが表示されます。

Unrecognized WebSocket connection option(s) `agent`, `perMessageDeflate`, `pfx`, `key`, `passphrase`, `cert`, `ca`, `ciphers`, `rejectUnauthorized`. Did you mean to put these under `headers`?

再現手順（現在の動作がバグの場合）

yarn add socket.io-client

React NativeプロジェクトのApp.js：

import React from 'react';
import { YellowBox } from 'react-native';
import io from 'socket.io-client';

YellowBox.ignoreWarnings(['Remote debugger']);

import AppContainer from './config/routing';

export default class App extends React.Component {
    constructor(props) {
        super(props);
    }

    componentWillMount() {
        const socket = io('http://10.0.60.26:3000', {
            forceNew: true
        });
        socket.on('connect', () => console.log('Connection'));
    }

    render() {
        return <AppContainer />;
    }
}

私の解決策：

ソケットを次のようにuseStateに保存するだけです。

'socket.io-client'からioをインポートします。
//..。

const [socket] = useState(() => io('SERVER_URL'));

問題が解決しました。

私の場合、ローカルのsocket.ioサーバーに接続するとv2.3で問題ありません。
しかし、リモートのsocket.ioサーバーに接続するとエラーが発生します。
サーバーソースは同じです。
そこで、socket.ioクライアントのバージョンを2.1.1にダウングレードすると、正常に動作します。

この警告はここでReactNative/WebSocket.js:117によって発生します。これは、EngineIO（内部でSocketIOによって使用される）がEngineIO/websocket.js:121を介して公開されたReactNative WebSocket実装を参照し、 optsが渡されるためです。警告メッセージに記載されています。 不思議なことに、EngineIOメンテナがコメントを介して記述したこれらの追加プロパティは、「Node.jsクライアントのSSLオプション」です。

以下のコードのようなものをEngineIO/websocket.js:114に挿入して、WebSocketコンストラクターに与えられたopts EngineIO/websocket.js:114を操作することにより、 opts内のすべての無関係なキーを削除して、警告がに表示されないようにします。そもそも（ omitはLodashからインポートされ、やり直すことができます）。

// lib/transports/websocket.js
...
if (this.isReactNative) {
  // prettier-ignore
  opts = omit(opts, ['agent', 'perMessageDeflate', 'pfx', 'key', 'passphrase', 'cert', 'ca', 'ciphers', 'rejectUnauthorized']);
}
...

あなたは、単に経由で警告をミュート含まない解決策を探しているならYellowBox.ignoreWarnings 、あなたは完全にオーバーライドすることができますdoOpenで定義したEngineIO/websocket.js:87以下のようなものを追加することにより、 、ReactNativeプロジェクトのエントリポイント（通常はindex.js 。

// index.js
...
+ import 'patches/EngineIOHeaderWarning';
...

// patches/EngineIOHeaderWarning.js
const WS = require('engine.io-client/lib/transports/websocket');

var WebSocketImpl = WebSocket; // eslint-disable-line no-undef

WS.prototype.doOpen = function() {
  if (!this.check()) {
    // let probe timeout
    return;
  }

  var uri = this.uri();
  var protocols = this.protocols;
  var opts = {};

  if (this.extraHeaders) {
    opts.headers = this.extraHeaders;
  }
  if (this.localAddress) {
    opts.localAddress = this.localAddress;
  }

  try {
    this.ws = new WebSocketImpl(uri, protocols, opts);
  } catch (err) {
    return this.emit('error', err);
  }
};

全体として、EngineIOのプルリクエストを作成して、 this.isReactNativeを介してReactNativeで使用するときに不要なこれらの余分なoptsを除外すると、SocketIOクライアントを使用しているすべてのユーザーに対してこの警告を抑制することができます。 ReactNativeプロジェクト。

あなたのコードは私がサーバーに接続することを許可せず、EngineIOの意図された振る舞いを変更したので、私はそれらのオプションをifステートメントでラップしましたが、あなたが提案したのと同じパッチメカニズムを使用しました

// patches/EngineIOHeaderWarning.js
const WS = require('engine.io-client/lib/transports/websocket');

var WebSocketImpl = WebSocket; // eslint-disable-line no-undef

WS.prototype.doOpen = function() {
    if (!this.check()) {
        // let probe timeout
        return;
    }

    var uri = this.uri();
    var protocols = this.protocols;
    var opts = {};

    if(!this.isReactNative){
        opts.agent = this.agent;
        opts.perMessageDeflate = this.perMessageDeflate;

        // SSL options for Node.js client
        opts.pfx = this.pfx;
        opts.key = this.key;
        opts.passphrase = this.passphrase;
        opts.cert = this.cert;
        opts.ca = this.ca;
        opts.ciphers = this.ciphers;
        opts.rejectUnauthorized = this.rejectUnauthorized;
    }


    if (this.extraHeaders) {
        opts.headers = this.extraHeaders;
    }
    if (this.localAddress) {
        opts.localAddress = this.localAddress;
    }

    try {
        this.ws =
            this.usingBrowserWebSocket && !this.isReactNative
                ? protocols
                ? new WebSocketImpl(uri, protocols)
                : new WebSocketImpl(uri)
                : new WebSocketImpl(uri, protocols, opts);
    } catch (err) {
        return this.emit('error', err);
    }

    if (this.ws.binaryType === undefined) {
        this.supportsBinary = false;
    }

    if (this.ws.supports && this.ws.supports.binary) {
        this.supportsBinary = true;
        this.ws.binaryType = 'nodebuffer';
    } else {
        this.ws.binaryType = 'arraybuffer';
    }

    this.addEventListeners();
};

「socket.io-client」にダウングレード：「2.1.0」ですべてOK

これは私のために働いた。

私がこの問題をよく理解している場合、これはhttps://github.com/socketio/socket.io-client/commit/06e9a4ca2621176c30c352b2ba8b34fa42b8d0baで紹介されている関連する依存関係の問題

2.1.1へのダウングレードは確かに機能しますが、2年前のリリースで立ち往生しています。

@ptboyerをプロジェクトに適用してリリースできますか？

この警告はパッケージの機能に影響しますか？ 設定するだけで、これに邪魔されたくありません。 他に影響がない場合は無視してください

編集：同じことを疑問に思っている人のために。 私が知る限り、この警告は重要ではありません。

@schumanndこの問題は、純粋にエラー/警告メッセージのミュートに関するものです。 機能的には、この警告は重要ではありません。 :)

+1

修正や今後のアップデートに関する公式の返信がないため、socket.ioライブラリがまだ維持されているかどうかについて非常に心配しています。

+1

+1

const _io = ioClient.connect(socketurl, { forceNode: true });
それは仕事です

@isthaisonそれは私のために動作しません

@isthaisonは機能します...しかし、他のすべてのhttpリクエストは非常に遅くなります...回避策とどのように関連しているかわかりません...しかし、それは...

{forceNode：true}

ありがとうございました。 この仕事は私にとって。

これは私のために働いた唯一の解決策です。

この警告はここでReactNative/WebSocket.js:117によって発生します。これは、EngineIO（内部でSocketIOによって使用される）がEngineIO/websocket.js:121を介して公開されたReactNative WebSocket実装を参照し、 optsが渡されるためです。警告メッセージに記載されています。 不思議なことに、EngineIOメンテナがコメントを介して記述したこれらの追加プロパティは、「Node.jsクライアントのSSLオプション」です。
以下のコードのようなものをEngineIO/websocket.js:114に挿入して、WebSocketコンストラクターに与えられたopts EngineIO/websocket.js:114を操作することにより、 opts内のすべての無関係なキーを削除して、警告がに表示されないようにします。そもそも（ omitはLodashからインポートされ、やり直すことができます）。

// lib/transports/websocket.js
...
if (this.isReactNative) {
  // prettier-ignore
  opts = omit(opts, ['agent', 'perMessageDeflate', 'pfx', 'key', 'passphrase', 'cert', 'ca', 'ciphers', 'rejectUnauthorized']);
}
...

あなたは、単に経由で警告をミュート含まない解決策を探しているならYellowBox.ignoreWarnings 、あなたは完全にオーバーライドすることができますdoOpenで定義したEngineIO/websocket.js:87以下のようなものを追加することにより、 、ReactNativeプロジェクトのエントリポイント（通常はindex.js 。

// index.js
...
+ import 'patches/EngineIOHeaderWarning';
...

// patches/EngineIOHeaderWarning.js
const WS = require('engine.io-client/lib/transports/websocket');

var WebSocketImpl = WebSocket; // eslint-disable-line no-undef

WS.prototype.doOpen = function() {
  if (!this.check()) {
    // let probe timeout
    return;
  }

  var uri = this.uri();
  var protocols = this.protocols;
  var opts = {};

  if (this.extraHeaders) {
    opts.headers = this.extraHeaders;
  }
  if (this.localAddress) {
    opts.localAddress = this.localAddress;
  }

  try {
    this.ws = new WebSocketImpl(uri, protocols, opts);
  } catch (err) {
    return this.emit('error', err);
  }
};

全体として、EngineIOのプルリクエストを作成して、 this.isReactNativeを介してReactNativeで使用するときに不要なこれらの余分なoptsを除外すると、SocketIOクライアントを使用しているすべてのユーザーに対してこの警告を抑制することができます。 ReactNativeプロジェクト。

あなたのコードは私がサーバーに接続することを許可せず、EngineIOの意図された振る舞いを変更したので、私はそれらのオプションをifステートメントでラップしましたが、あなたが提案したのと同じパッチメカニズムを使用しました

// patches/EngineIOHeaderWarning.js
const WS = require('engine.io-client/lib/transports/websocket');

var WebSocketImpl = WebSocket; // eslint-disable-line no-undef

WS.prototype.doOpen = function() {
    if (!this.check()) {
        // let probe timeout
        return;
    }

    var uri = this.uri();
    var protocols = this.protocols;
    var opts = {};

    if(!this.isReactNative){
        opts.agent = this.agent;
        opts.perMessageDeflate = this.perMessageDeflate;

        // SSL options for Node.js client
        opts.pfx = this.pfx;
        opts.key = this.key;
        opts.passphrase = this.passphrase;
        opts.cert = this.cert;
        opts.ca = this.ca;
        opts.ciphers = this.ciphers;
        opts.rejectUnauthorized = this.rejectUnauthorized;
    }


    if (this.extraHeaders) {
        opts.headers = this.extraHeaders;
    }
    if (this.localAddress) {
        opts.localAddress = this.localAddress;
    }

    try {
        this.ws =
            this.usingBrowserWebSocket && !this.isReactNative
                ? protocols
                ? new WebSocketImpl(uri, protocols)
                : new WebSocketImpl(uri)
                : new WebSocketImpl(uri, protocols, opts);
    } catch (err) {
        return this.emit('error', err);
    }

    if (this.ws.binaryType === undefined) {
        this.supportsBinary = false;
    }

    if (this.ws.supports && this.ws.supports.binary) {
        this.supportsBinary = true;
        this.ws.binaryType = 'nodebuffer';
    } else {
        this.ws.binaryType = 'arraybuffer';
    }

    this.addEventListeners();
};

const _io = ioClient.connect(socketurl, { forceNode: true });
それは仕事です

それは私と一緒に働きます、ありがとう！

"socket.io-client": "^2.3.0"

const socket = io(host, { forceNode: true });

const _io = ioClient.connect(socketurl, { forceNode: true });
それは仕事です

それは私と一緒に働きます、ありがとう！

"socket.io-client": "^2.3.0"

const socket = io(host, { forceNode: true });

それは私にとってもうまくいきました！ 本当にありがとう

いくつかのヘッダーを追加するだけで機能します！
socket = io.connect('SOCKET_URL_HERE', { jsonp: false, agent: '-', pfx: '-', cert: '-', ca: '-', ciphers: '-', rejectUnauthorized: '-', perMessageDeflate: '-' });

const _io = ioClient.connect（socketurl、{forceNode：true}）;

これは警告を解決しますが、私のソケット接続は本当に遅くなります（実際にはタイムアウト）ので、私には使用できません。

const _io = ioClient.connect（socketurl、{forceNode：true}）;

これは警告を解決しますが、私のソケット接続は本当に遅くなります（実際にはタイムアウト）ので、私には使用できません。

ここでも同じ：接続タイムアウト！

froceNodeを削除し、 2.1.0ダウングレードしたところ、正常に機能しました。 また、エミュレータデバイスへのIPではなくローカルホストを使用しているという問題もありました。

同じ@SaveYourTime 、私は"socket.io-client": "^2.3.0"
ここhttps://socket.io/docs/client-api/を参照して
forceNodeオプションを追加する理由

この問題はengine.io-client v3.4.3で修正する必要があるため、 yarn.lockファイルとnode_modulesディレクトリを削除してからyarn install

参照https://github.com/socketio/engine.io-client/commit/2f5c948abe8fd1c0fdb010e88f96bd933a3792ea

@BassemNおそらく、yarn.lockファイルを削除する代わりに、 yarn upgrade-interactiveを使用してバージョンを安全にバンプできますか？

パッケージをアップグレードするたびにファイルを完全に破棄すると、「ロック」ファイルの概念に少し直感に反するように思われます。 😅

https://github.com/socketio/engine.io-client/commit/e5bc1063cc90a7b6262146c7b5338ffff1ff9e5b（$＃$ [email protected]および[email protected]含まれています）で修正する必要があり

forceNodeオプションに関しては、React Nativeが実際にWebSocket（ ref ）をサポートしているように見えるので、 forceNode: trueは必要ありません。 そうではありませんか？