Nw.js: CORS Requests failing from v0.41.0 onwards

[Connum]

NWJS Version : 0.41.0 and later
Operating System : Windows 10 64bit

I tried updating a project I haven't worked on in a while to the latest nwjs version. However, requests to my local dev server using window.fetch fail with the following errors visible in the console:

Access to fetch at 'https://localhost:8080/some/url/' from origin 'http://localhost:9090' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

:8080/some/url/:1 Failed to load resource: net::ERR_FAILED

The maximum version I can use with the requests still working is 0.40.2, with 0.41.0 up to even 0.41.3 it will result in these errors. Did I breaking changes?

[Connum]

It's not only requests to the local dev server that fail, but any other CORS requests, too. I think it may have something to do with these changes in Chromium: https://www.chromium.org/Home/chromium-security/extension-content-script-fetches
But is that really something that should apply to nwjs, too? Or wouldn't it be better to revert these changes for nwjs?

[rogerwang]

Could you please post your package.json?

[Connum]

Thanks for the ultra fast response, please find my package.json beloow. As you can see, I'm using nwjs-builder-phoenix. I know there are some packages out of date, but building and running the app itself works fine, it's only ther CORS requests that fail, but still work with 0.40.2. I also got it to work now setting the Access-Control-Allow-Origin: * header and the Access-Control-Allow-Headers that I need for my API. So this seems to suggest it's really a CORS issue that wouldn't be a problem in older versions but started from 0.41.0 onwards. It might be something that got introduced in Chrome 77 (although the article I linked above is talking about CORS changes in Chrome 73).

{
  "name": "***",
  "label": "***",
  "description": "",
  "version": "1.3.4",
  "author": "***",
  "private": true,
  "license": "UNLICENSED",
  "main": "http://localhost:9090/views/",
  "node-remote": "http://localhost/*",
  "chromium-args": "--disable-raf-throttling --disable-gpu --force-cpu-draw --load-extension='./node_modules/nw-vue-devtools/extension'",
  "window": {
    "title": "***",
    "icon": "src/assets/ico_256.png",
    "show": false,
    "frame": false,
    "transparent": true,
    "width": 540,
    "height": 465,
    "min_width": 540,
    "min_height": 465
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "//dist": "build --tasks win-x86,win-x64,linux-x86,linux-x64,mac-x64 .",
    "dev-server": "webpack-dev-server --config ./src/build/webpack.config.js --disableHostCheck",
    "dist": "node ./src/build/dist_prepare.js && webpack --config src/build/webpack.config.js --env.production --display-error-details --progress && build --tasks win-x64 ./src/build/_temp/",
    "start": "parallelshell \"npm run dev-server\" \"run --x64 .\"",
    "lint": "eslint src",
    "lint-fix": "eslint src --fix"
  },
  "build": {
    "nwVersion": "0.41.3",
    "appId": "***",
    "ffmpegIntegration": false,
    "packed": false,
    "targets": [
      "nsis7z"
    ],
    "output": "../../../dist",
    "outputPattern": "${NAME}_${VERSION}_${PLATFORM}-${ARCH}",
    "excludes": [
      "src/build/**",
      "webpack.config.js",
      "package-lock.json"
    ],
    "strippedProperties": [
      "scripts",
      "devDependencies",
      "build",
      "build.nsis",
      "node-remote"
    ],
    "overriddenProperties": {
      "name": "***",
      "main": "app/views/index.html",
      "chromium-args": "",
      "window": {
        "title": "***",
        "icon": "app/assets/ico_256.png",
        "show": false,
        "frame": false,
        "transparent": true,
        "width": 540,
        "height": 320,
        "min_width": 540,
        "min_height": 320
      }
    },
    "win": {
      "productName": "***",
      "companyName": "***",
      "copyright": "***",
      "icon": "../../assets/ico_multi.ico"
    }
  },
  "build.nsis": {
    "icon": "../../assets/ico_multi.ico",
    "languages": [
      "German",
      "English"
    ]
  },
  "devDependencies": {
    "@types/node": "^10.12.18",
    "@types/webpack-env": "^1.13.6",
    "babel-eslint": "^10.0.1",
    "confetti-js": "0.0.14",
    "css-loader": "^2.1.0",
    "eslint": "^5.15.2",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-plugin-import": "^2.16.0",
    "eslint-plugin-jsx-a11y": "^6.2.1",
    "file-loader": "^3.0.1",
    "hard-source-webpack-plugin": "^0.13.1",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "lodash": "^4.17.11",
    "lowdb": "^1.0.0",
    "mime-types": "^2.1.21",
    "mini-css-extract-plugin": "^0.5.0",
    "moment": "^2.23.0",
    "moment-duration-format": "^2.2.2",
    "ncp": "^2.0.0",
    "ntpclient": "^0.7.2",
    "nw-vue-devtools": "^1.2.0",
    "nwjs-builder-phoenix": "^1.15.0",
    "parallelshell": "^3.0.1",
    "perfect-scrollbar": "^1.4.0",
    "proper-lockfile": "^3.2.0",
    "sanitize.css": "^8.0.0",
    "ts-loader": "^5.3.2",
    "typescript": "^3.2.2",
    "vue": "^2.5.21",
    "vue-loader": "^15.4.2",
    "vue-template-compiler": "^2.5.21",
    "vuex": "^3.0.1",
    "webpack": "^4.28.2",
    "webpack-cli": "^3.1.2",
    "webpack-dev-server": "^3.1.14"
  },
  "dependencies": {
    "auto-launch": "^5.0.5"
  }
}

[rogerwang]

I think you'll need "localhost:9090" in "node-remote" field, otherwise it's just a normal browser frame and subject to browser security model.

[Connum]

Unfortunately, changing node-remote didn't help. But another solution to adding the CORS headers on the server-side of things is to open chrome://flags/#out-of-blink-cors and set the out-of-blink-cors flag to disabled, but I haven't found a way to set this via chromium-args yet.

[sadikyalcin]

Have the same issue. It has been fine previously. Currently using 0.41.2.

"chromium-args": "--disable-web-security --allow-file-access-from-files --allow-file-access --user-data-dir --allow-running-insecure-content --enable-local-file-accesses",

[rogerwang]

Could you please provide a full sample so I can reproduce it here?

[WesSouza]

@rogerwang I just stumbled upon this problem.

Here's a reproduction setup with both 0.40.1 and 0.41.0:
https://github.com/WesSouza/nwjs-7182-cors-sample

Let me know if this is clear enough and helpful.

[rogerwang]

Thanks for the sample. It works in the latest 0.43.0. Looks like it got fixed in that version. Closing for now.

[FPChris]

404 on that link now :/