Web UI cannot get data from Core

[EimanFatima]

Hello,

I have some issues regarding cytomine development setup. I have made the regular installation of cytomine core on local machine. It is working fine. For the front end I have installed cytomine-web-ui as follows:
Hello,

I have some issues regarding cytomine development setup. I have made the regular installation of cytomine core on local machine. It is working fine. For the front end I have installed cytomine-web-ui as follows:

The issue I am having is that in the cytomine-web ui, I can see the projects created in the cytomine core but could not open them, it says ‘the page could not be found’. Moreover I am unable to create a project or upload the images.

In the configuration.sh file, if I make the parameter Core-development to true and run it, both cytomine core and web-ui shows the login screen but when I try to login it says ‘Unexpected Error Occured’.

In the configuration.sh file, if I make the parameter Web-Ui or IMS-development to true and run it, cytomine core gives the error of Bad gateway but cytomine web-ui works fine. I am able to create projects and upload images but in this case, the issue is that when I try to open some image, it says ‘failed to fetch annotation layers’ and the image could not be opened.

Kindly help me with this.

[geektortoise]

For the records :
Some element have been given here : https://forum.image.sc/t/integration-of-core-and-web-ui/50806/5

In short :
If you have installed Cytomine following this link https://documentation.cytomine.org/ , your localhost:8000 (when you run "npm run serve" ) should only get blocked by CORS.

In your Cytomine-bootstrap/configs/nginx/nginx.conf file, replace the part related to the “core part” (by default localhost-core) by this one :
(Keep a copy of your nginx.conf file somewhere ! )

	server {
		client_max_body_size 0;
		listen       80;
		server_name  localhost-core;

		#charset koi8-r;
		#access_log  logs/host.access.log  main;

		set $cors_origin "";
		set $cors_cred   "";
		set $cors_header "";
		set $cors_method "";

		if ($http_origin ~* "localhost") {
			set $cors_origin $http_origin;
			set $cors_cred   true;
			set $cors_method 'GET, PUT, POST, DELETE, OPTIONS';
			set $cors_header 'Content-Type, Content-Range, Content-Length, Content-Disposition, Content-Description, Cache-Control, Date, dateFull, authorization, content-type-full, X-Requested-With, Pragma';
		}

		location / {
			proxy_set_header X-Real-IP $remote_addr;
			proxy_set_header Host $host;
			proxy_pass http://core:8080;

			add_header Access-Control-Allow-Origin      $cors_origin always;
			add_header Access-Control-Allow-Credentials $cors_cred always;
			add_header Access-Control-Allow-Headers     $cors_header always;
			add_header Access-Control-Allow-Methods     $cors_method always;
			add_header Cache-Control 'no-cache';

			if ($request_method = 'OPTIONS') {
				add_header Access-Control-Allow-Origin		$cors_origin always;
				add_header Access-Control-Allow-Credentials 	$cors_cred always;
				add_header Access-Control-Allow-Headers		$cors_header always;
				add_header Access-Control-Allow-Methods 	$cors_method always;
				add_header 'Access-Control-Max-Age' 		1728000;
				add_header 'Content-Type' 			'text/plain charset=UTF-8';
				add_header 'Content-Length' 			0;
				return 204;
			}
		}
	}

Then run the restart.sh script and CORS from localhost origin will be allowed and your local Web-UI displayed on localhost:8000 will be able to contact the Cytomine core.

[EimanFatima]

Thank you @geektortoise. This is really helpful and it resolved the problem.