cancel
Showing results for 
Search instead for 
Did you mean: 

Can't preview application after migration

Fjaoos
Participant
0 Kudos

Hi,

I am in the middle of testing the migration of former WebIDE projects.

So I migrated a project with Fiori tools succesfully but when I want to preview the application, a browser window open without any backend data.

The VSCode Terminal shows the following:

ypeError [ERR_INVALID_PROTOCOL]: Protocol "https:" not supported. Expected "http:"

at new NodeError (node:internal/errors:371:5)

at new ClientRequest (node:_http_client:158:11)

at Object.request (node:https:353:10)

at Array.stream (C:\Git\gkvuipaacdd\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:31318:74)

at ProxyServer.<anonymous> (C:\Git\gkvuipaacdd\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:31081:21)

at HttpProxyMiddleware.<anonymous> (C:\Git\gkvuipaacdd\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:30183:32)

at Generator.next (<anonymous>)

at fulfilled (C:\Git\gkvuipaacdd\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:30157:58)

Accepted Solutions (1)

Accepted Solutions (1)

Hi nils_janssen,

I am happy to announce that we released a new version of the "@sap/ux-ui5-tooling", namely 1.5.1. The new version contains a fix that should resolve the proxy issue that you are facing.

Best regards,

Zdravko

Fjaoos
Participant

Thank you very much for the fix.

I had to add the corporate proxy ip and set ignoreCertError to true but now it is working for us.

Answers (4)

Answers (4)

0 Kudos

Hello nils_janssen,

I believe that I was able to find the root cause of the issue, but I need your help verify it. Please try the following:

1. Add the "--https" flag to the "start" script in the "package.json" of your application. It should look like this e.g.

"start": "fiori run --https --open test/flpSandbox.html"

2. Execute "npm run start" in the terminal and follow the process of creating a certificate.

Once the certificate is created and the local server is started over HTTPS, then the application should load successfully.

Hope this helps!

Best regards,

Zdravko

Fjaoos
Participant
0 Kudos

Hi zdravko.georgiev ,

thank you for taking your time helping me.

Are there any software or module prerequesites for creating a certificate?

Best Regards

Nils

0 Kudos

Hi nils_janssen,

you should have everything that you need bundled with the "@sap/ux-ui5-tooling", which is installed as dependency in your application.

Best regards,

Zdravko

Fjaoos
Participant
0 Kudos

Hi zdravko.georgiev ,

I installed openssl, added --https and did everything the console asked me to do.

I did not change the result though.

Regards

Nils

0 Kudos

Hi nils_janssen,

thank you for testing! Meanwhile I was able to investigate further. I believe that the issue occurs for Node.js versions > 12. Could you please share what Node.js version you have installed? If you are using Node.js version greater than > 12, then could you please downgrade to Node.js version 12 and try again?

You can use nvm (https://github.com/nvm-sh/nvm/blob/master/README.md) to easily switch between Node.js versions.

Best regards,

Zdravko

Fjaoos
Participant
0 Kudos

Hi all,

I am very sorry for the late reply but I had other things to do.

Anyway, the error message is a different now. After I created a Fiori elements app in VS Code and made it running with the simple proxy, I then migrated the project because I wanted to use the fiori tools.

But when I try to start the application, I get the following error:

Error: Cannot find module 'keytar'

0 Kudos

Hi nils_janssen,

could you please try re-installing the "node_modules" in your applications? It is best to first delete the "node_modules" folder, and also the "package-lock.json". And then to execute "npm install" in terminal in the root folder of the project.

Hope this helps!

Best regards,

Zdravko

Fjaoos
Participant
0 Kudos

Hi zdravko.georgiev ,

I had to to figure that out with my IT department because node-gyp does not care about the npmrc proxy settings and thus the requests have been denied.

I am now back to the original error in my first post.

0 Kudos
Hi nils_janssen,

could you please try creating an application by using the Northwind OData Service (https://services.odata.org/v2/northwind/northwind.svc/) and then try to run the application again?

Thanks and Best Regards,

Zdravko

0 Kudos

Providing Proxy Configuration

By the default the fiori-tools-proxy will read the proxy configuration from the Node.js environment variables proxy, https-proxy and noproxy. If those variables are not set, then you can also provide the proxy configuration in the ui5.yaml file. Please note: if you want to exclude any domains from the proxy then you will need to set the noproxy variable, e.g. npm config set noproxy "sap.com".

0 Kudos

Hello Nils,

I am suspecting this might stem from ui5.yaml configuration and its use.
Could you please share the ui5.yaml file and which npm script you use for the preview?

Kind regards,
Oksana.

Fjaoos
Participant
0 Kudos

Hi Oksana,

the ui5.yaml is the one that got altered by the migration. I did not change it in any way:

0 Kudos

Hello Nils,

Thanks for sharing the file. Which preview option did you use?

Kind regards,
Oksana.

Fjaoos
Participant
0 Kudos

It was just "start"

npm run start

0 Kudos

Hello Nils,

Thanks for clarifying.
Could you please set the debug: true in the ui5.yaml . And then we could get some more output.

Kind rgerads,
Oksana.

0 Kudos

Hello Nils,

in addition to setting debug: true in the ui5.yaml, please clarify,
is the URL in the ui5.yaml real one or a virtual one? Also, do you have the COT system defined on your local machine?

Thank you,
Oksana.

Fjaoos
Participant
0 Kudos

Windows PowerShell

Copyright (C) Microsoft Corporation. Alle Rechte vorbehalten.

Lernen Sie das neue plattformübergreifende PowerShell kennen – https://aka.ms/pscore6

PS C:\Git\gkvuipaacau> cd "c:\Git\gkvuipaacau"

PS C:\Git\gkvuipaacau> npm run start

> gkv.uipa01.acau@0.0.1 start

> fiori run --open test/flpSandbox.html?sap-client=099#xGKVxPA01_C_ACAU-display

ApplicationInsights:CorrelationIdManager [

Error: connect EACCES 13.69.106.215:443

at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1161:16) {

errno: -4092,

code: 'EACCES',

syscall: 'connect',

address: '13.69.106.215',

port: 443

}

]

info server:ux-proxy Starting fiori-tools-proxy using following configuration:

info server:ux-proxy proxy: 'https://yyyyyyyyyyyy:3128/'

info server:ux-proxy ignoreCertError: 'true'

info server:ux-proxy backend: [{"path":"/sap","url":"https://xxxxxxxxxxx.de:8433/","client":"099","destination":"COT"}]

info server:ux-proxy ui5: {"url":"https://ui5.sap.com","version":"1.84.21","path":["/resources","/test-resources"],"directLoad":false}

info server:ux-proxy debug: 'true'

info server:ux-proxy Backend proxy started for https://xxxxxxxxxxx.de:8433/ /sap

Error: Cannot find module 'keytar'

Require stack:

- C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\lib\middleware\middlewareRepository.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\lib\middleware\MiddlewareManager.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\lib\server.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\index.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\lib\cli\commands\serve.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\yargs\index.cjs

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\bin\ui5.js

at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)

at Function.Module._load (node:internal/modules/cjs/loader:778:27)

at Module.require (node:internal/modules/cjs/loader:1005:19)

at require (node:internal/modules/cjs/helpers:102:18)

at Object.36183 (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:92130:18)

at __webpack_require__ (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:92258:42)

at getKeytar (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:75325:16)

at Object.exports.getSecureStore (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:75364:24)

at new exports.HybridStore (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:74853:43)

at new exports.SystemDataProvider (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:74958:29) {

code: 'MODULE_NOT_FOUND',

requireStack: [

'C:\\Git\\gkvuipaacau\\node_modules\\@sap\\ux-ui5-tooling\\dist\\middlewares\\fiori-tools-proxy.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\lib\\middleware\\middlewareRepository.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\lib\\middleware\\MiddlewareManager.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\lib\\server.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\index.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\lib\\cli\\commands\\serve.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\yargs\\index.cjs',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\bin\\ui5.js'

]

}

Could not "require('keytar')". Trying VSCode's copy

Error: Cannot find module 'vscode'

Require stack:

- C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\lib\middleware\middlewareRepository.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\lib\middleware\MiddlewareManager.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\lib\server.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\@ui5\server\index.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\lib\cli\commands\serve.js

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\node_modules\yargs\index.cjs

- C:\Git\gkvuipaacau\node_modules\@ui5\cli\bin\ui5.js

at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)

at Function.Module._load (node:internal/modules/cjs/loader:778:27)

at Module.require (node:internal/modules/cjs/loader:1005:19)

at require (node:internal/modules/cjs/helpers:102:18)

at Object.37549 (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:92226:18)

at __webpack_require__ (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:92258:42)

at getKeytar (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:75332:22)

at Object.exports.getSecureStore (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:75364:24)

at new exports.HybridStore (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:74853:43)

at new exports.SystemDataProvider (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:74958:29) {

code: 'MODULE_NOT_FOUND',

requireStack: [

'C:\\Git\\gkvuipaacau\\node_modules\\@sap\\ux-ui5-tooling\\dist\\middlewares\\fiori-tools-proxy.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\lib\\middleware\\middlewareRepository.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\lib\\middleware\\MiddlewareManager.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\lib\\server.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\@ui5\\server\\index.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\lib\\cli\\commands\\serve.js',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\node_modules\\yargs\\index.cjs',

'C:\\Git\\gkvuipaacau\\node_modules\\@ui5\\cli\\bin\\ui5.js'

]

}

Could not get hold of vscode

Dummy store. Trying to retrieve for service: fiori/v2/system, key: https://xxxxxxxxxxx.de:8433/099

[HPM] Proxy created: / -> https://xxxxxxxxxxx.de:8433/

[HPM] Subscribed to http-proxy events: [ 'error', 'proxyReq', 'proxyRes', 'close' ]

info server:ux-proxy UI5 proxy started for https://ui5.sap.com

[HPM] Proxy created: (_pathname, req) => {

// Avoid ERR_CONTENT_DECODING_FAILED on http request for gzip'd html files

// e.g. /test-resources/sap/ui/qunit/testrunner.html?testpage=%2Ftest%2Ftestsuite.qunit.html&autostart=true

const acceptHeader = req.headers['accept'] || '';

if (req.headers['accept-encoding'] &&

(acceptHeader.includes('text/html') || acceptHeader.includes('application/xhtml+xml'))) {

delete req.headers['accept-encoding']; // Don't accept compressed html files from ui5 CDN

}

return true;

} -> https://ui5.sap.com

[HPM] Proxy rewrite rule created: "/resources" ~> "/1.84.21/resources"

[HPM] Proxy rewrite rule created: "/test-resources" ~> "/1.84.21/test-resources"

[HPM] Subscribed to http-proxy events: [ 'error', 'proxyReq', 'proxyRes', 'close' ]

info server:liveload Livereload middleware started for port 35729 and path C:\Git\gkvuipaacau\webapp

Server started

URL: http://localhost:8080

[HPM] Rewriting path from "/test-resources/sap/ushell/bootstrap/sandbox.js" to "/1.84.21/test-resources/sap/ushell/bootstrap/sandbox.js"

[HPM] GET /test-resources/sap/ushell/bootstrap/sandbox.js ~> https://ui5.sap.com

TypeError [ERR_INVALID_PROTOCOL]: Protocol "https:" not supported. Expected "http:"

at new NodeError (node:internal/errors:371:5)

at new ClientRequest (node:_http_client:158:11)

at Object.request (node:https:353:10)

at Array.stream (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:31318:74)

at ProxyServer.<anonymous> (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:31081:21)

at HttpProxyMiddleware.<anonymous> (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:30183:32)

at Generator.next (<anonymous>)

at fulfilled (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:30157:58)

[HPM] Rewriting path from "/resources/sap-ui-core.js" to "/1.84.21/resources/sap-ui-core.js"

[HPM] GET /resources/sap-ui-core.js ~> https://ui5.sap.com

TypeError [ERR_INVALID_PROTOCOL]: Protocol "https:" not supported. Expected "http:"

at new NodeError (node:internal/errors:371:5)

at new ClientRequest (node:_http_client:158:11)

at Object.request (node:https:353:10)

at Array.stream (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:31318:74)

at ProxyServer.<anonymous> (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:31081:21)

at HttpProxyMiddleware.<anonymous> (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:30183:32)

at Generator.next (<anonymous>)

at fulfilled (C:\Git\gkvuipaacau\node_modules\@sap\ux-ui5-tooling\dist\middlewares\fiori-tools-proxy.js:30157:58)

0 Kudos

Hello Nils,

Thank you for sharing the logs.
You may need to update the corporate proxy settings. If you browse the settings in VSCode and search for ‘proxy’, you should see the settings that need to be updated.

Kind regsrds,
Oksana.

Fjaoos
Participant
0 Kudos

Thank you!

Can you be a little bit more specific what I need to update ?

0 Kudos

Hello Nils,

could you please share the current state, hence how is the proxy configuration done currently on your machine? Do you have the environmental variables HTTP_PROXY, HTTPS_PROXY and NO_PROXY set? Or is it done otherways?

Best regards,

Zdravko

Fjaoos
Participant
0 Kudos

Hi, the values are set in the .npmrc file