Skip to main content

i4designer Knowledge Base

i4scada platform deployments

Abstract

Here is a collection of step-based tutorials guiding you through the i4SCADA platform project deployment methods. Check them out to learn more details about these specific processes.

Tip

For a quick video guide, please check the tutorial available on our YouTube channel.

First time in i4designer: deploying the SCADA visualization

Deploying a project via direct download
Abstract

Check out this tutorial and learn about the easiest method to publish your i4designer SCADA projects. The direct download publish method is accessible to everyone.

Important

Prerequisites for this guide:

  • Performing the project visualization on a machine where i4scada 3.8 is up and running

The direct download publish method does not rely on the network connection, as described in the Download project article, hence, a set of manual steps are involved in this process.

After designing your project, please follow the below-described steps in order to publish it using the Download method:

  1. After making sure that your project is ready for a first publish, click on the Builds menu of the global actions area.

    builds.jpg
  2. Click on the Trigger build button. A toast message will be displayed on the bottom of your screen indicating the Build progress.

    builds_starting.jpg
  3. Refresh the Builds panel to get the latest version of your project build displayed on the page.

    refresh_build.jpg
  4. Click on the Download button. Another toast message will be displayed on the bottom of your screen indicating the Download progress.

    download_build.jpg
  5. Upon successful download operation, the project build will be downloaded directly to the browser page. A toast message will be also displayed at the bottom of your screen marking the successful download. The project build is downloaded as a zip archive containing the actual project.

    download_done.jpg
  6. Remove the downloaded project build from the archive, as we shall reuse it in the upcoming steps.

  7. Visit the wwwroot folder, usually available through path C:\inetpub\wwwroot\.

  8. Under the wwwroot folder create a new folder. The name of the folder is not important, so you can name it as desired.

    Warning

    You might need Administrator rights to manage the data under this folder.

    designer_publish.jpg
  9. Copy the contents of the downloaded build project and paste them to the new wwwroot folder.

    project_folder_in_IIS.jpg
  10. Next, open the Internet Information Services (IIS) Manager application and expand the list of Sites, until reaching the newly created folder.

  11. Select the respective folder and click on the Browse link.

    Open_from_IIS.jpg
  12. The project visualization will be opened directly in your default browser.

    visualization.jpg

Note

In case the project visualization needs to be updated with new changes, the above-listed steps need to be reorganized.

Deploying a project via FTP
Abstract

Check out this article in order to learn how to organize the File Transfer Protocol publish method, provided to you by the i4designer application, in order to deploy an i4scada project.

Important

Prerequisites for these guides:

  • An FTP Site is preconfigured and accessible through the internet

  • An FTP client application is installed on the machine where project visualization needs to take place

This tutorial is split up into two parts:

Setting up the FTP remote folder

As described in the Publish project over FTP article, the FTP project publish method will place the build output inside the remote folder configured on your FTP Site, allowing you to open the project visualization without further manual work. As the i4designer environment runs in the Cloud, your FTP Site should be also accessible through the internet.

  1. First of all let's check if you can access the FTP Site, on your computer:

    1. Open a Windows Explorer window (or press Win+E on your keyboard).

    2. Click to select the Address bar.

    3. Type the FTP Site's address.

      Tip

      Example:

      ftp://hostname/folder/

      File_explorer.jpg
    4. Fill in your FTP Site credentials and click the Log On button.

      Log_On_As.jpg
    5. The FTP Site folders will be displayed. Identify the folder that you desire to publish your project to.

      remote_folder.jpg
  2. Open another Windows Explorer window and add a new folder under a known and open location. The name of the folder is not important, so you can name it anyhow.

    New_folder_on_my_PC.jpg
  3. Next, we can optionally check the deployed application by hosting it in the IIS, as follows:

    1. Open the Internet Information Services (IIS) Manager application.

    2. Expand local computer > Sites > right-click on Default Web Site (or another website if you're running multiple websites on the same computer) and choose Add Virtual Directory.

      Add_Virtual_Directory.jpg
    3. In the Add Virtual Directory window fill in the folder Alias and select the folder created at step 2 as the physical path.

      Physical_path_for_FTP.jpg
    4. To save the new Virtual Directory click the OK button.

    5. Thew new Virtual Directory is available in the IIS Manager Connections panel.

      Connections_panel.jpg
  4. In order to enable smooth communication between the external FTP Site and your local folder, using an FTP Client application is recommended.

    Tip

    For the present tutorial, we are using the Core FTP LE application, but you can choose whatever suits you.

    Core_FTP.jpg
  5. Further on, let's configure the FTP settings on the i4designer environment:

    1. Open an i4scada platform project and go under the Deployments menu of the global actions area.

    2. On the left side of the screen, the FTP configuration panel is displayed. Start filling in your FTP Site settings.

      Tip

      For more details about the FTP configuration settings, please also check the description provided by the Publish project over FTP article.

      ftp_configuration.jpg
    3. Click the Save button to preserve your changes.

Publishing and visualizing the project

As soon as the FTP remote folder is created and the needed i4designer FTP settings are properly configured, we can proceed with triggering a project, publishing it through FTP, and visualizing the project.

  1. After making sure that your project is ready for a first publish, click on the Builds menu of the global actions area.

    builds.jpg
  2. Click on the Trigger build button. A toast message will be displayed on the bottom of your screen indicating the Build progress.

    builds_starting.jpg
  3. As soon as the build progress is finished a confirmation toast message will be displayed.

  4. Refresh the Builds panel to get the latest version of your project build displayed on the page.

    refresh_build.jpg
  5. Click on the Publish over FTP button.

    publish_over_FTP.jpg
  6. The Publish progress can be followed up in the toast message displayed at the bottom right side of the screen. When publish operation is successfully finished, a confirmation toast message will be displayed.

    FTP_Publish_done.jpg
  7. Open the FTP client application and connect to the defined FTP Site.

  8. Using the FTP client application Copy the project build files from the FTP site to the local remote folder.

    copy_files.jpg
  9. Now you can open your up-to-date project visualization in the browser. You can either use the IIS Manager interface to browse the project or simply type in the browser the project URL.

    Project_visualization.jpg
Automatically deploying a project
Abstract

The easiest method to deploy and visualize i4scada projects is Automatic publish. Check out this article and learn how to do it by yourself!

Important

Prerequisites for this guide:

  • the i4scada machine should run on version 3.8.11 or higher.

In order to easily publish an i4designer project by means of the automatic publish method and visualize it on your i4scada machine,

The Automatic publish method, used for projects created on the i4scada platform, relies on a set of easy steps, as follows:

Setting up the project storage location

In order to create and configure the i4designer project storage location, please proceed as follows

  1. Open your i4scada machine.

  2. Visit the wwwroot folder, usually available through path C:\inetpub\wwwroot\.

  3. Under the wwwroot folder create a new folder. The name of the folder is not important, so you can name it as desired.

    Warning

    You might need Administrator rights to manage the data under this folder.

    wwwroot_folder.jpg
  4. Add another subfolder to the main folder created here. Each folder will be associated afterward, with a new project.

    HistoricalDataProjectfolder.jpg

    Tip

    You can add multiple sub-folders to the main folder, hence each sub-folder will be associated afterward, with a new project.

  5. Next, open the Internet Information Services (IIS) Manager application.

  6. Expand local computer > Sites > Default Web Site > new folder in order to reach the new sub-folder.

  7. Click right on the new sub-folder and select the Convert to Application option.

    Convert_to_App.jpg
  8. In the Add Application window, make sure that the Physical path points to your new sub-folder. Click the OK button to confirm the conversion.

    Add_application.jpg
  9. The new sub-folder is now converted into an application.

    Folder_converted.jpg
Setting up the i4scada Studio settings

In order that the communication between the i4scada and the i4designer endpoints is enabled, please organize the following steps

  1. Open the i4scada Studio application.

  2. Select the Settings menu and expand the i4designer node, until reaching the Project settings node.

    i4designer_Project_settings.jpg
  3. Right-click within the Project settings empty panel and select the option New.

    New_project_settings.jpg
  4. The Project settings panel is updated and allows you to fill in the Project Token and the Project Path. Proceed as follows:

    Project_settings_added.jpg
    1. Fill in the Project Token after copying it from the application.

      Tip

      Each project has an allocated connection-token. This can be easily copied from the Control Center, as visible in the screenshot below.

      connection_token.jpg

      For more details about the connection-token, please also visit our online documentation and the dedicated article here.

    2. Fill in the Project Path by selecting the path pointing towards the files location folder, created as previously described.

      Select_folder.jpg
  5. After filling in the Project settings, you should restart the Server and the Synchronization Service.

    Service_Mgr.jpg

Important

Each new project needs to be made available, as described by this tutorial, under the tool.

multiple_prjjs.jpg
Building and publishing the i4designer project

After finishing the design of your i4designer project, please proceed as follows:

  1. Open the Builds menu of the Designer application and trigger a new build. Confirmation toast messages are displayed at the bottom right side of the screen, confirming the build operation.

    trigger_build.jpg
  2. Next, open the Deployments menu of the Designer application and make sure to fill in the i4scada API base URL, pointing towards your i4scada machine.

    deployment_new.jpg
  3. Click the Automatic Publish button in the Builds panel of the Deployments page. Confirmation toast messages are displayed at the bottom right side of the screen, confirming the publish operation.

    automatic_publish_new.jpg
Opening the i4scada visualization

The final step of the automatic publish method in visualizing the new project, as follows:

  1. Return to your i4scada machine.

  2. Open the Internet Information Services (IIS) Manager application.

  3. Expand local computer > Sites > Default Web Site > i4designer main storage location folder > i4designer storage location sub-folder.

  4. Click the Browse application button.

    Open_IIS_app.jpg
  5. The i4designer published project is opened in a new browser page.

    Project_visualization.jpg