cli: [Bug]: Error when tunnel URL is opened in the browser - Error forwarding web request: Error: connect ECONNREFUSED ::1:59388

Please confirm that you have:

  • Searched existing issues to see if your issue is a duplicate. (If you’ve found a duplicate issue, feel free to add additional information in a comment on it.)
  • Reproduced the issue in the latest CLI version.

In which of these areas are you experiencing a problem?

App

Expected behavior

Shopify App homepage should open where we can enter store url to install the app

Actual behavior

Getting this error in terminal while the request times out on the browser

Error forwarding web request: Error: connect ECONNREFUSED ::1:59035

Verbose output

> diyva@1.0.1 dev
> shopify app dev --verbose

2023-04-25T12:03:42.815Z: Running command app dev
2023-04-25T12:03:42.821Z: Ensuring that the user is authenticated with the Partners API with the following scopes:
[]

2023-04-25T12:03:42.822Z: Getting session store...
2023-04-25T12:03:42.824Z: Validating existing session against the scopes:
[
  "openid",
  "https://api.shopify.com/auth/shop.admin.graphql",
  "https://api.shopify.com/auth/shop.admin.themes",
  "https://api.shopify.com/auth/partners.collaborator-relationships.readonly",
  "https://api.shopify.com/auth/shop.storefront-renderer.devtools",
  "https://api.shopify.com/auth/partners.app.cli.access"
]
For applications:
{
  "partnersApi": {
    "scopes": []
  }
}

2023-04-25T12:03:42.824Z: Sending Identity Introspection request to URL: https://accounts.shopify.com/oauth/introspection
2023-04-25T12:03:42.824Z: Sending POST request to URL https://accounts.shopify.com/oauth/introspection
With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:03:43.212Z: Request to https://accounts.shopify.com/oauth/introspection completed in 383 ms
With response headers:
 - cache-control: no-cache, no-store, private, must-revalidate, max-age=0
 - content-type: application/json; charset=utf-8
 - etag: W/"bdf0e415858524f58352b5b4f2bff410"
 - x-request-id: 02f4bc28-7c28-45d9-b5f9-e0469e0c8b93

2023-04-25T12:03:43.216Z: The identity token is valid: true
2023-04-25T12:03:43.216Z:
The validation of the token for application/identity completed with the following results:
- It's expired: false
- It's invalid in identity: false

2023-04-25T12:03:43.216Z: Verifying that the user has a Partner organization
2023-04-25T12:03:43.217Z: Sending "Partners" GraphQL request:
  {
    organizations(first: 1) {
      nodes {
        id
      }
    }
  }

With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:03:43.751Z: Request to https://partners.shopify.com/api/cli/graphql completed in 513 ms
With response headers:
 - cache-control: max-age=0, private, must-revalidate
 - content-type: application/json; charset=utf-8
 - etag: W/"cfe7aee6de003b9c6920944c12893d28"
 - x-request-id: 7aad59af-de88-4126-8495-59a718a9fdfd

2023-04-25T12:03:43.753Z: Reading cached app information for directory /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react...
2023-04-25T12:03:43.754Z: Sending "Partners" GraphQL request:
  query FindOrganization($id: ID!) {
    organizations(id: $id, first: 1) {
      nodes {
        id
        businessName
        website
        betas {
          appUiDeployments
          cliTunnelAlternative
        }
      }
    }
  }

With variables:
{
  "id": "312605"
}

With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:03:44.157Z: Request to https://partners.shopify.com/api/cli/graphql completed in 400 ms
With response headers:
 - cache-control: max-age=0, private, must-revalidate
 - content-type: application/json; charset=utf-8
 - etag: W/"e6de097f580fe12fd1af26a1af751f4f"
 - x-request-id: f4f41032-d277-45e9-b034-0001b38c3ee0

2023-04-25T12:03:44.158Z: Sending "Partners" GraphQL request:
  query FindApp($apiKey: String!) {
    app(apiKey: $apiKey) {
      id
      title
      apiKey
      organizationId
      apiSecretKeys {
        secret
      }
      appType
      grantedScopes
    }
  }

With variables:
{
  "apiKey": "60bf1f2402347f0251ad1e5a7544f885"
}

With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:03:44.158Z: Sending "Partners" GraphQL request:
  query FindOrganization($id: ID!, $shopDomain: String) {
    organizations(id: $id, first: 1) {
      nodes {
        id
        businessName
        website
        betas {
          appUiDeployments
        }
        stores(shopDomain: $shopDomain, first: 1, archived: false) {
          nodes {
            shopId
            link
            shopDomain
            shopName
            transferDisabled
            convertableToPartnerTest
          }
        }
      }
    }
  }

With variables:
{
  "id": "312605",
  "shopDomain": "jashanmal-home-dev.myshopify.com"
}

With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:03:44.775Z: Request to https://partners.shopify.com/api/cli/graphql completed in 614 ms
With response headers:
 - cache-control: max-age=0, private, must-revalidate
 - content-type: application/json; charset=utf-8
 - etag: W/"c3f0ea176ee27e9877ff8a69cbf6ceed"
 - x-request-id: b90cb072-7077-4056-921f-e39816585ae3

2023-04-25T12:03:44.809Z: Request to https://partners.shopify.com/api/cli/graphql completed in 648 ms
With response headers:
 - cache-control: max-age=0, private, must-revalidate
 - content-type: application/json; charset=utf-8
 - etag: W/"f738bc937f400a48b7d19b34ec891b84"
 - x-request-id: fd5de168-4844-4f22-a1e2-016cbf68fc23

2023-04-25T12:03:44.809Z: Storing app information for directory /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react:{
  "appId": "60bf1f2402347f0251ad1e5a7544f885",
  "title": "diyva-dev-shreyas",
  "directory": "/Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react",
  "storeFqdn": "jashanmal-home-dev.myshopify.com",
  "orgId": "312605"
}
2023-04-25T12:03:44.819Z: Obtaining the dependency manager in directory /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react...
╭─ info ────────────────────────────────────────────────────────────────────────────────────────────────╮
│                                                                                                       │
│  Using your previous dev settings:                                                                    │
│                                                                                                       │
│    • Org:          KLoc Technologies Pvt Ltd                                                          │
│    • App:          diyva-dev-shreyas                                                                  │
│    • Dev store:    jashanmal-home-dev.myshopify.com                                                   │
│    • Update URLs:  Always                                                                             │
│                                                                                                       │
│  To reset your default dev config, run `npm run dev -- --reset`                                       │
│                                                                                                       │
╰───────────────────────────────────────────────────────────────────────────────────────────────────────╯

2023-04-25T12:03:44.842Z: Sending "Partners" GraphQL request:
  query fetchSpecifications($api_key: String!) {
    extensionSpecifications(apiKey: $api_key) {
      name
      externalName
      externalIdentifier
      identifier
      gated
      options {
        managementExperience
        registrationLimit
      }
      features {
        argo {
          surface
        }
      }
    }
  }

With variables:
{
  "api_key": "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"
}

With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:03:45.266Z: Request to https://partners.shopify.com/api/cli/graphql completed in 423 ms
With response headers:
 - cache-control: max-age=0, private, must-revalidate
 - content-type: application/json; charset=utf-8
 - etag: W/"6cab3adcdbff629320781d8f3f841c6a"
 - x-request-id: 61f68af2-782f-40f0-8364-3809d0d7c3ab

2023-04-25T12:03:45.299Z: Reading the content of file at shopify.app.toml...
2023-04-25T12:03:45.301Z: Reading the .env file at .env
2023-04-25T12:03:45.301Z: Reading the content of file at .env...
2023-04-25T12:03:45.303Z: Reading the content of file at package.json...
2023-04-25T12:03:45.303Z: Reading the content of file at package.json...
2023-04-25T12:03:45.304Z: Obtaining the dependency manager in directory /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react...
2023-04-25T12:03:45.464Z: Reading the content of file at web/shopify.web.toml...
2023-04-25T12:03:45.464Z: Reading the content of file at web/frontend/shopify.web.toml...
2023-04-25T12:03:45.508Z: Reading the content of file at package.json...
2023-04-25T12:03:45.529Z:
Running system process:
  · Command: npm install
  · Working directory: /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react

2023-04-25T12:03:45.530Z:
Running system process:
  · Command: npm install
  · Working directory: /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend


2023-04-25T12:03:58.771Z: Reading the content of file at package.json...
2023-04-25T12:03:58.771Z: Getting a random port...
2023-04-25T12:03:58.772Z: Getting a random port...
2023-04-25T12:03:58.772Z: Sending "Partners" GraphQL request:
  query getApp($apiKey: String!) {
    app(apiKey: $apiKey) {
      applicationUrl
      redirectUrlWhitelist
    }
  }

With variables:
{
  "apiKey": "60bf1f2402347f0251ad1e5a7544f885"
}

With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:03:58.774Z: Random port obtained: 59378
2023-04-25T12:03:58.774Z: Random port obtained: 59379
2023-04-25T12:03:58.782Z:
Running system process:
  · Command: /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/node_modules/@shopify/plugin-cloudflare/bin/cloudflared tunnel --url http://localhost:59378 --no-autoupdate
  · Working directory: /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react

2023-04-25T12:03:58.957Z: 2023-04-25T12:03:58Z INF Thank you for trying Cloudflare Tunnel. Doing so, without a Cloudflare account, is a quick way to experiment and try it out. However, be aware that these account-less Tunnels have no uptime guarantee. If you intend to use Tunnels in production you should use a pre-created named tunnel by following: https://developers.cloudflare.com/cloudflare-one/connections/connect-apps

2023-04-25T12:03:58.957Z: 2023-04-25T12:03:58Z INF Requesting new quick Tunnel on trycloudflare.com...

2023-04-25T12:03:59.170Z: Request to https://partners.shopify.com/api/cli/graphql completed in 397 ms
With response headers:
 - cache-control: max-age=0, private, must-revalidate
 - content-type: application/json; charset=utf-8
 - etag: W/"14cc694ac3788c87c0f1936c5ccd349e"
 - x-request-id: ebf48ffa-81aa-4ce9-b06b-227eb7c09a18

2023-04-25T12:04:04.121Z: 2023-04-25T12:04:04Z INF +--------------------------------------------------------------------------------------------+

2023-04-25T12:04:04.122Z: 2023-04-25T12:04:04Z INF |  Your quick Tunnel has been created! Visit it at (it may take some time to be reachable):  |
2023-04-25T12:04:04Z INF |  https://beer-camping-floor-spoke.trycloudflare.com                                        |
2023-04-25T12:04:04Z INF +--------------------------------------------------------------------------------------------+

2023-04-25T12:04:04.125Z: 2023-04-25T12:04:04Z INF Cannot determine default configuration path. No file [config.yml config.yaml] in [~/.cloudflared ~/.cloudflare-warp ~/cloudflare-warp /etc/cloudflared /usr/local/etc/cloudflared]

2023-04-25T12:04:04.126Z: 2023-04-25T12:04:04Z INF Version 2023.3.1

2023-04-25T12:04:04.126Z: 2023-04-25T12:04:04Z INF GOOS: darwin, GOVersion: go1.19.5, GoArch: amd64

2023-04-25T12:04:04.128Z: 2023-04-25T12:04:04Z INF Settings: map[no-autoupdate:true protocol:quic url:http://localhost:59378]

2023-04-25T12:04:04.136Z: 2023-04-25T12:04:04Z INF Generated Connector ID: de62d550-5cf4-4818-b18d-ee6ac40bcee7

2023-04-25T12:04:04.188Z: 2023-04-25T12:04:04Z INF Initial protocol quic

2023-04-25T12:04:04.191Z: 2023-04-25T12:04:04Z INF ICMP proxy will use 192.168.0.105 as source for IPv4

2023-04-25T12:04:04.193Z: 2023-04-25T12:04:04Z INF ICMP proxy will use fe80::1c87:2c6e:24ae:59f3 in zone en0 as source for IPv6

2023-04-25T12:04:04.196Z: 2023-04-25T12:04:04Z INF Created ICMP proxy listening on 192.168.0.105:0

2023-04-25T12:04:04.196Z: 2023-04-25T12:04:04Z INF Created ICMP proxy listening on [fe80::1c87:2c6e:24ae:59f3%en0]:0

2023-04-25T12:04:04.216Z: 2023-04-25T12:04:04Z INF Starting metrics server on 127.0.0.1:59383/metrics

2023-04-25T12:04:05.636Z: 2023-04-25T12:04:05Z INF Connection ca64b32d-e89b-419a-b47a-07c0185aaea0 registered with protocol: quic connIndex=0 ip=198.41.192.37 location=NRT

2023-04-25T12:04:05.638Z: Sending "Partners" GraphQL request:
  mutation appUpdate($apiKey: String!, $applicationUrl: Url!, $redirectUrlWhitelist: [Url]!) {
    appUpdate(input: {apiKey: $apiKey, applicationUrl: $applicationUrl, redirectUrlWhitelist: $redirectUrlWhitelist}) {
      userErrors {
        message
        field
      }
    }
  }

With variables:
{
  "apiKey": "60bf1f2402347f0251ad1e5a7544f885",
  "applicationUrl": "https://beer-camping-floor-spoke.trycloudflare.com",
  "redirectUrlWhitelist": [
    "https://beer-camping-floor-spoke.trycloudflare.com/auth/callback",
    "https://beer-camping-floor-spoke.trycloudflare.com/auth/shopify/callback",
    "https://beer-camping-floor-spoke.trycloudflare.com/api/auth/callback"
  ]
}

With request headers:
 - User-Agent: Shopify CLI; v=3.45.1
 - Keep-Alive: timeout=30
 - Sec-CH-UA-PLATFORM: darwin
 - Content-Type: application/json

2023-04-25T12:04:05.777Z: 2023-04-25T12:04:05Z WRN Your version 2023.3.1 is outdated. We recommend upgrading it to 2023.4.2

2023-04-25T12:04:06.693Z: Request to https://partners.shopify.com/api/cli/graphql completed in 1052 ms
With response headers:
 - cache-control: max-age=0, private, must-revalidate
 - content-type: application/json; charset=utf-8
 - etag: W/"76acb4e44b91f928c3744a856cacdd2e"
 - x-request-id: c70b3b92-10ee-487c-98bd-9dfd8b944eb3

2023-04-25T12:04:06.709Z: Obtaining the dependency manager in directory /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react...
2023-04-25T12:04:06.714Z:
Running system process:
  · Command: ruby -v
  · Working directory: /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react

2023-04-25T12:04:07.111Z: Request to https://monorail-edge.shopifysvc.com/v1/produce completed in 313 ms
With response headers:
 - x-request-id: 9ed80307-02e3-487e-8a02-e1dbf8a4d498

2023-04-25T12:04:07.112Z: Analytics event sent: {
  "command": "app dev",
  "time_start": 1682424222816,
  "time_end": 1682424246697,
  "total_time": 23881,
  "success": true,
  "cli_version": "3.45.1",
  "ruby_version": "3.1.2",
  "node_version": "19.6.0",
  "is_employee": false,
  "uname": "darwin arm64",
  "env_ci": false,
  "env_plugin_installed_any_custom": false,
  "env_plugin_installed_shopify": "[\"@shopify/app\",\"@shopify/cli\",\"@shopify/plugin-cloudflare\",\"@shopify/plugin-did-you-mean\",\"@shopify/plugin-ngrok\"]",
  "env_shell": "zsh",
  "env_device_id": "2238b588e2c875d1aef6b443d6a223964cb5463a",
  "env_cloud": "localhost",
  "env_package_manager": "npm",
  "partner_id": 312605,
  "api_key": "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa",
  "project_type": "ruby",
  "app_extensions_any": false,
  "app_extensions_breakdown": "{}",
  "app_extensions_count": 0,
  "app_extensions_custom_layout": false,
  "app_extensions_function_any": false,
  "app_extensions_function_count": 0,
  "app_extensions_function_custom_layout": false,
  "app_extensions_theme_any": false,
  "app_extensions_theme_count": 0,
  "app_extensions_theme_custom_layout": false,
  "app_extensions_ui_any": false,
  "app_extensions_ui_count": 0,
  "app_extensions_ui_custom_layout": false,
  "app_name_hash": "bc9012059e74574c37d0ba8dba9d4d56e5de5569",
  "app_path_hash": "0245b4ce00a977b64f46937fd45c5d7a34b14da9",
  "app_scopes": "[\"write_script_tags\",\"write_themes\"]",
  "app_web_backend_any": true,
  "app_web_backend_count": 1,
  "app_web_custom_layout": false,
  "app_web_framework": "rails",
  "app_web_frontend_any": true,
  "app_web_frontend_count": 1,
  "env_package_manager_workspaces": false,
  "cmd_dev_urls_updated": true,
  "store_fqdn_hash": "c3f6068e97cbe48c388fc467efce0fd14b0a68c0",
  "cmd_app_dependency_installation_skipped": false,
  "cmd_app_reset_used": false,
  "cmd_all_launcher": "npm",
  "cmd_all_topic": "app",
  "cmd_all_plugin": "@shopify/app",
  "cmd_all_verbose": true,
  "cmd_all_path_override": true,
  "cmd_all_path_override_hash": "0245b4ce00a977b64f46937fd45c5d7a34b14da9",
  "args": "--verbose",
  "app_name": "diyva",
  "store_fqdn": "jashanmal-home-dev.myshopify.com",
  "env_plugin_installed_all": "[\"@shopify/app\",\"@shopify/cli\",\"@shopify/plugin-cloudflare\",\"@shopify/plugin-did-you-mean\",\"@shopify/plugin-ngrok\"]",
  "metadata": "{\"extraPublic\":{},\"extraSensitive\":{}}"
}
2023-04-25T12:04:07.126Z: Getting a random port...
2023-04-25T12:04:07.128Z: Random port obtained: 59388
2023-04-25T12:04:07.129Z:
Starting reverse HTTP proxy on port 59378
Routing traffic rules:
{
  "default": "http://localhost:59388"
}

2023-04-25T12:04:07.140Z:
Running system process:
  · Command: bin/rails server
  · Working directory: /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web

2023-04-25T12:04:07.143Z:
Running system process:
  · Command: npm run dev
  · Working directory: /Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend

2023-04-25 12:04:07 │ frontend │
2023-04-25 12:04:07 │ frontend │ > dev
2023-04-25 12:04:07 │ frontend │ > vite
2023-04-25 12:04:07 │ frontend │
2023-04-25 12:04:07 │ frontend │ 2023-04-25T12:04:07.719Z vite:config native esm config loaded in 133.48ms URL {
2023-04-25 12:04:07 │ frontend │   href: 'file:///Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend/vite.config.js',
2023-04-25 12:04:07 │ frontend │   origin: 'null',
2023-04-25 12:04:07 │ frontend │   protocol: 'file:',
2023-04-25 12:04:07 │ frontend │   username: '',
2023-04-25 12:04:07 │ frontend │   password: '',
2023-04-25 12:04:07 │ frontend │   host: '',
2023-04-25 12:04:07 │ frontend │   hostname: '',
2023-04-25 12:04:07 │ frontend │   port: '',
2023-04-25 12:04:07 │ frontend │   pathname: '/Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend/vite.config.js',
2023-04-25 12:04:07 │ frontend │   search: '',
2023-04-25 12:04:07 │ frontend │   searchParams: URLSearchParams {},
2023-04-25 12:04:07 │ frontend │   hash: ''
2023-04-25 12:04:07 │ frontend │ }
2023-04-25 12:04:07 │ frontend │ 2023-04-25T12:04:07.728Z vite:config using resolved config: {
2023-04-25 12:04:07 │ frontend │   root: '/Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend',
2023-04-25 12:04:07 │ frontend │   plugins: [
2023-04-25 12:04:07 │ frontend │     'vite:pre-alias',
2023-04-25 12:04:07 │ frontend │     'alias',
2023-04-25 12:04:07 │ frontend │     'vite:react-babel',
2023-04-25 12:04:07 │ frontend │     'vite:react-refresh',
2023-04-25 12:04:07 │ frontend │     'vite:react-jsx',
2023-04-25 12:04:07 │ frontend │     'vite:modulepreload-polyfill',
2023-04-25 12:04:07 │ frontend │     'vite:resolve',
2023-04-25 12:04:07 │ frontend │     'vite:html-inline-proxy',
2023-04-25 12:04:07 │ frontend │     'vite:css',
2023-04-25 12:04:07 │ frontend │     'vite:esbuild',
2023-04-25 12:04:07 │ frontend │     'vite:json',
2023-04-25 12:04:07 │ frontend │     'vite:wasm',
2023-04-25 12:04:07 │ frontend │     'vite:worker',
2023-04-25 12:04:07 │ frontend │     'vite:worker-import-meta-url',
2023-04-25 12:04:07 │ frontend │     'vite:asset',
2023-04-25 12:04:07 │ frontend │     'vite:define',
2023-04-25 12:04:07 │ frontend │     'vite:css-post',
2023-04-25 12:04:07 │ frontend │     'vite:client-inject',
2023-04-25 12:04:07 │ frontend │     'vite:import-analysis'
2023-04-25 12:04:07 │ frontend │   ],
2023-04-25 12:04:07 │ frontend │   define: {
2023-04-25 12:04:07 │ frontend │     'process.env.SHOPIFY_API_KEY': '"60bf1f2402347f0251ad1e5a7544f885"'
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   resolve: {
2023-04-25 12:04:07 │ frontend │     dedupe: [ 'react', 'react-dom' ],
2023-04-25 12:04:07 │ frontend │     preserveSymlinks: true,
2023-04-25 12:04:07 │ frontend │     alias: [ [Object], [Object] ]
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   server: {
2023-04-25 12:04:07 │ frontend │     preTransformRequests: true,
2023-04-25 12:04:07 │ frontend │     host: 'localhost',
2023-04-25 12:04:07 │ frontend │     port: '59388',
2023-04-25 12:04:07 │ frontend │     hmr: {
2023-04-25 12:04:07 │ frontend │       protocol: 'wss',
2023-04-25 12:04:07 │ frontend │       host: 'beer-camping-floor-spoke.trycloudflare.com',
2023-04-25 12:04:07 │ frontend │       port: '59388',
2023-04-25 12:04:07 │ frontend │       clientPort: 443
2023-04-25 12:04:07 │ frontend │     },
2023-04-25 12:04:07 │ frontend │     proxy: { '^/(\\?.*)?$': [Object], '^/api(/|(\\?.*)?$)': [Object] },
2023-04-25 12:04:07 │ frontend │     fs: { strict: true, allow: [Array], deny: [Array] }
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   optimizeDeps: {
2023-04-25 12:04:07 │ frontend │     include: [ 'react/jsx-dev-runtime' ],
2023-04-25 12:04:07 │ frontend │     esbuildOptions: { keepNames: undefined, preserveSymlinks: true }
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   configFile: '/Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend/vite.config.js',
2023-04-25 12:04:07 │ frontend │   configFileDependencies: [ 'vite.config.js' ],
2023-04-25 12:04:07 │ frontend │   inlineConfig: {
2023-04-25 12:04:07 │ frontend │     root: undefined,
2023-04-25 12:04:07 │ frontend │     base: undefined,
2023-04-25 12:04:07 │ frontend │     mode: undefined,
2023-04-25 12:04:07 │ frontend │     configFile: undefined,
2023-04-25 12:04:07 │ frontend │     logLevel: undefined,
2023-04-25 12:04:07 │ frontend │     clearScreen: undefined,
2023-04-25 12:04:07 │ frontend │     server: {}
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   base: '/',
2023-04-25 12:04:07 │ frontend │   publicDir: '/Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend/public',
2023-04-25 12:04:07 │ frontend │   cacheDir: '/Users/shreyas/Workspace/KLoc/clients/diyva/shopify_diyva_rails_react/web/frontend/node_modules/.vite',
2023-04-25 12:04:07 │ frontend │   command: 'serve',
2023-04-25 12:04:07 │ frontend │   mode: 'development',
2023-04-25 12:04:07 │ frontend │   isProduction: false,
2023-04-25 12:04:07 │ frontend │   build: {
2023-04-25 12:04:07 │ frontend │     target: [ 'es2019', 'edge88', 'firefox78', 'chrome87', 'safari13.1' ],
2023-04-25 12:04:07 │ frontend │     polyfillModulePreload: true,
2023-04-25 12:04:07 │ frontend │     outDir: 'dist',
2023-04-25 12:04:07 │ frontend │     assetsDir: 'assets',
2023-04-25 12:04:07 │ frontend │     assetsInlineLimit: 4096,
2023-04-25 12:04:07 │ frontend │     cssCodeSplit: true,
2023-04-25 12:04:07 │ frontend │     cssTarget: [ 'es2019', 'edge88', 'firefox78', 'chrome87', 'safari13.1' ],
2023-04-25 12:04:07 │ frontend │     sourcemap: false,
2023-04-25 12:04:07 │ frontend │     rollupOptions: {},
2023-04-25 12:04:07 │ frontend │     minify: 'esbuild',
2023-04-25 12:04:07 │ frontend │     terserOptions: {},
2023-04-25 12:04:07 │ frontend │     write: true,
2023-04-25 12:04:07 │ frontend │     emptyOutDir: null,
2023-04-25 12:04:07 │ frontend │     manifest: false,
2023-04-25 12:04:07 │ frontend │     lib: false,
2023-04-25 12:04:07 │ frontend │     ssr: false,
2023-04-25 12:04:07 │ frontend │     ssrManifest: false,
2023-04-25 12:04:07 │ frontend │     reportCompressedSize: true,
2023-04-25 12:04:07 │ frontend │     chunkSizeWarningLimit: 500,
2023-04-25 12:04:07 │ frontend │     watch: null,
2023-04-25 12:04:07 │ frontend │     commonjsOptions: { include: [Array], extensions: [Array] },
2023-04-25 12:04:07 │ frontend │     dynamicImportVarsOptions: { warnOnError: true, exclude: [Array] }
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   preview: {
2023-04-25 12:04:07 │ frontend │     port: undefined,
2023-04-25 12:04:07 │ frontend │     strictPort: undefined,
2023-04-25 12:04:07 │ frontend │     host: 'localhost',
2023-04-25 12:04:07 │ frontend │     https: undefined,
2023-04-25 12:04:07 │ frontend │     open: undefined,
2023-04-25 12:04:07 │ frontend │     proxy: { '^/(\\?.*)?$': [Object], '^/api(/|(\\?.*)?$)': [Object] },
2023-04-25 12:04:07 │ frontend │     cors: undefined,
2023-04-25 12:04:07 │ frontend │     headers: undefined
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   env: { BASE_URL: '/', MODE: 'development', DEV: true, PROD: false },
2023-04-25 12:04:07 │ frontend │   assetsInclude: [Function: assetsInclude],
2023-04-25 12:04:07 │ frontend │   logger: {
2023-04-25 12:04:07 │ frontend │     hasWarned: false,
2023-04-25 12:04:07 │ frontend │     info: [Function: info],
2023-04-25 12:04:07 │ frontend │     warn: [Function: warn],
2023-04-25 12:04:07 │ frontend │     warnOnce: [Function: warnOnce],
2023-04-25 12:04:07 │ frontend │     error: [Function: error],
2023-04-25 12:04:07 │ frontend │     clearScreen: [Function: clearScreen],
2023-04-25 12:04:07 │ frontend │     hasErrorLogged: [Function: hasErrorLogged]
2023-04-25 12:04:07 │ frontend │   },
2023-04-25 12:04:07 │ frontend │   packageCache: Map(0) {},
2023-04-25 12:04:07 │ frontend │   createResolver: [Function: createResolver],
2023-04-25 12:04:07 │ frontend │   worker: {
2023-04-25 12:04:07 │ frontend │     format: 'iife',
2023-04-25 12:04:07 │ frontend │     plugins: [
2023-04-25 12:04:07 │ frontend │       [Object], [Object],
2023-04-25 12:04:07 │ frontend │       [Object], [Object],
2023-04-25 12:04:07 │ frontend │       [Object], [Object],
2023-04-25 12:04:07 │ frontend │       [Object], [Object],
2023-04-25 12:04:07 │ frontend │       [Object], [Object],
2023-04-25 12:04:07 │ frontend │       [Object], [Object],
2023-04-25 12:04:07 │ frontend │       [Object], [Object],
2023-04-25 12:04:07 │ frontend │       [Object], [Object]
2023-04-25 12:04:07 │ frontend │     ],
2023-04-25 12:04:07 │ frontend │     rollupOptions: {}
2023-04-25 12:04:07 │ frontend │   }
2023-04-25 12:04:07 │ frontend │ }
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteTimeMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / corsMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteProxyMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use /__open-in-editor launchEditorMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use /__vite_ping viteHMRPingMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteServePublicMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteTransformMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteServeRawFsMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteServeStaticMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteSpaFallbackMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteIndexHtmlMiddleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / vite404Middleware
2023-04-25 12:04:07 │ frontend │ Tue, 25 Apr 2023 12:04:07 GMT connect:dispatcher use / viteErrorMiddleware
2023-04-25 12:04:07 │ frontend │ 2023-04-25T12:04:07.734Z vite:deps Hash is consistent. Skipping. Use --force to override.
2023-04-25 12:04:07 │ frontend │
2023-04-25 12:04:07 │ frontend │   vite v2.8.6 dev server running at:
2023-04-25 12:04:07 │ frontend │
2023-04-25 12:04:07 │ frontend │   > Local: http://localhost:59388/
2023-04-25 12:04:07 │ frontend │   > Network: use `--host` to expose
2023-04-25 12:04:07 │ frontend │
2023-04-25 12:04:07 │ frontend │   ready in 217ms.
2023-04-25 12:04:07 │ frontend │
2023-04-25 12:04:08 │ backend  │ => Booting Puma
2023-04-25 12:04:08 │ backend  │ => Rails 7.0.4.2 application starting in development
2023-04-25 12:04:08 │ backend  │ => Run `bin/rails server --help` for more startup options
2023-04-25 12:04:08 │ backend  │ Puma starting in single mode...
2023-04-25 12:04:08 │ backend  │ * Puma version: 5.6.5 (ruby 3.1.2-p20) ("Birdie's Version")
2023-04-25 12:04:08 │ backend  │ *  Min threads: 5
2023-04-25 12:04:08 │ backend  │ *  Max threads: 5
2023-04-25 12:04:08 │ backend  │ *  Environment: development
2023-04-25 12:04:08 │ backend  │ *          PID: 50113
2023-04-25 12:04:08 │ backend  │ * Listening on http://127.0.0.1:59379
2023-04-25 12:04:08 │ backend  │ * Listening on http://[::1]:59379
2023-04-25 12:04:08 │ backend  │ Use Ctrl-C to stop
Error forwarding web request: Error: connect ECONNREFUSED ::1:59388
Error forwarding web request: Error: connect ECONNREFUSED ::1:59388

Reproduction steps

  1. Run npm run dev with or without -- --tunnel-url option
  2. Open the URL in the browser
  3. You then see the error in terminal while request times out in the browser

Operating System

Mac OS Ventura 13.3.1

Shopify CLI version (check your project’s package.json if you’re not sure)

3.45.0

Shell

iTerm2

Node version (run node -v if you’re not sure)

v19.6.0

What language and version are you using in your application?

Ruby 3.1.2

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Comments: 19 (6 by maintainers)

Most upvoted comments

Looking at the log it seems to me that the frontend process is only being exposed in localhost, but not on the other network interfaces. Your output looks like this:

2023-04-25 12:04:07 │ frontend │   > Local: http://localhost:59388/
2023-04-25 12:04:07 │ frontend │   > Network: use `--host` to expose

While mine looks like this:

2023-04-25 15:44:14 │ frontend │   > Local:    http://localhost:54388/
2023-04-25 15:44:14 │ frontend │   > Network:  http://127.0.2.2:54388/
2023-04-25 15:44:14 │ frontend │   > Network:  http://127.0.2.3:54388/
2023-04-25 15:44:14 │ frontend │   > Network:  http://192.168.1.243:54388/
2023-04-25 15:44:14 │ frontend │   > Network:  http://172.16.0.2:54388/

What happens if you change web/frontend/shopify.web.toml to be like this?

type="frontend"

[commands]
dev = "npm run dev -- --host"
build = "npm run build"

Hey folks, I’m speaking to the team that mantains the ruby and node templates to understand the best way to fix this. I’m not sure myself why that flag works on my setup and which configuration controls that. Will forward updates when I receive them.

I figured out what the issue was, the error was misleading. Turns out I had a bad checkout state that caused me to have missing files in my directory.

One of the projects was importing a css file that didn’t exist, basically it had a line like this:

import '../../extensions/variants-ui/assets/variant-styles-dist.css';

Removing that line that imported the non-existing file made it start working again!

@Arkham In my case web/frontend/shopify.web.toml already has that. There appears to be an issue with the session though. I can see an error coming from node_modules/@shopify/shopify-api/lib/clients/graphql/graphql_client.js:14

if (!config.isCustomStoreApp && !params.session.accessToken) {
2023-04-25 17:52:22 │ backend    │                                                         ^
2023-04-25 17:52:22 │ backend    │
2023-04-25 17:52:22 │ backend    │ TypeError: Cannot read properties of undefined (reading 'accessToken')

I tried npm run dev -- --reset and also npm run shopify app env pull, and tried using a different store / creating a whole new app but the issue persists. I also tried deleting all rows in the sqlite sessions table and changing the session storage to use sessionStorage: new MemorySessionStorage(),, but nothing seems to fix it.

How can I fix or reset the session so the accessToken is available?

UPDATE: I checked out a previous commit, ran npm run dev and did NOT encounter the error. I then checked out HEAD and tried again (no code changes from when I was getting the error before) and did not encounter the error. I spent quite a long time trying to debug and would love to know what happened and how to avoid it in the future! @Arkham if you have any insight, it would be appreciated!