Presentation on theme: "Developing OPC HMI for a Web Browser"— Presentation transcript:
1 Developing OPC HMI for a Web Browser Hello everyone, thank you for joining us on this webinar. My name is slim-shady and I am excited to show you how you can rapidly build scalable SCADA/HMI systems without writing any lines of code. I would agree that this sounds like an impossible task, but today we’re going to see just how this is indeed possible.Colin Winchester VP OperationsNathan Pocock Chief Architect & Developer
2 Developing OPC HMI for a Web Browser You may private chat with the host hereAsk questions to panelists here
3 Developing OPC HMI for a Web Browser While we are sharing applications, the toolbar shown below appears in the bottom right corner of your screen.You can access Chat with Host and the Q&A with Presenters Panels by clicking on the icons as shown.Private Chat with HostQ&A with Panelists
4 Developing OPC HMI for a Web Browser Agenda – 60 MinutesOverview of Web based HMI’sOverview of the OPC DataHubLive DemonstrationOverview of OPCSystems.NETAdditional InformationQuestions & Answers
5 OPC to Browsers Why? Availability Portable Access Network Access Everyone has a browserEveryone knows how to use oneAvoid special software installs, sometimesPortable AccessCell-phone based web browsersHandheld devicesNetwork AccessStandard transport protocols = firewall friendlyUsually can handle slower connections better than a “thick client” applicationAdministration & DevelopmentSingle application updates all clientsDevelopment is easier than ever!The topic of displaying OPC data in a web browser has been a popular one for many years, and there are a number of technical approaches available in the market for how you accomplish it.We’ve found it’s popular for many reasons. Everyone has a browser and knows how to use it, so your client side training and installation costs are very low. Today, even cell phones have a sophisticated browser and many newer cellphones are even wi-fi enabled so they double as a hand-held computer and phone.The reality of today’s world is that you’ll never know where you’ll be when you’ll need access to data on your operations. At the same time, you can be sure that where ever you are when you need it the most, it probably won’t be at your desk, at your comfortable PC that is inside the company firewall on the company network. And if you are dependent on special software that has to be installed from a CD, you can be sure it won’t be on the PC where you are when you need the data – that’s the way life works, isn’t it?
6 Web-App Capabilities Display data from OPC Servers Get user-input for writing to OPC ItemsTrending/Charting live OPC DataAlarm displays and acknowledgements
7 Example Configurations Single Server Solution OPC Systems Tag Repository OPC Server? Web Server Web ApplicationGREEN ZONEBrowsers inside the networkFirewall First-line of defense from outside world.So there’s a number of ways you could create your web-based HMI. Here’s the simplest scenario… you have a single Server (which could be a regular desktop computer, it doesn’t have to be a server-class computer) which contains everything… your OPC Server, the OPC Systems.NET repository, and your Web Server, such as IIS or Apache etc.Secure access?Browsers outside the network
8 Example Configurations OPC Cluster high availability for your OPC Server(s) and/or OPC Systems .NET Tag RepositoryWeb Server Cluster high availability for your Web HMI application(s)GREEN ZONETolerance Achieved:OPC LayerWeb Servers
9 Web Challenges Security/Networking Speed – data update rates Controlling the number of connections to the serverControlling accessFirewallPasswordEncryption of data (SSL)Speed – data update ratesAren’t the fastest at executing client side codeAren’t good at remembering “state” or “where I’ve been”Cookies, query strings attempt to work around this!Wide variety of versions and service pack levelsOK – so we’re not here to bash on clients, but we know you’re smart and experienced and know that for all the positives, browsers have their challenges.If you do a lot of client side scripting and code, they aren’t always the fastest but that’s the tradeoff for what you are doing when you use a browser instead of a thick client compiled, optimized application.You may not realize this but browsers aren’t good at remembering what software developers call “State”. State is remembering variables, where you were in a processing algorithm – the stuff that helps a program move from one part to another. Sure a browser can remember where you’ve been via your Favorites list, and yes the famous “cookies” are a long running way that web developers attempt to help web applications remember where they were as you go from page to page. They also sometimes pass a lot of what appears to be garbage on the URL which is really encoded data as a means of maintaining state. Reality is though it’s nothing like a compile program – so people building web pages work through that.Of course there’s always the service pack joy, and an ill-crafted web application can become very inefficient if you let it.But is that a reason to just toss out the idea of using a web browser? No – we’ve found that users believe there are plenty of good reasons to use a web browser, and where properly applied, they are a fantastic tool for delivering data. So lets move on to how it’s done and some application scenarios
10 OPC DataHub Functionality Overview OPC to WebSystem Monitoring
11 What can you do? System Data Multiple & Varied PC uptime Data Sources Running processesMemory usageMultiple & VariedData SourcesOPCDataHubWebServerNormally, SMS text messages are sent from one cell phone to another, which is all handled within the cell network itself. Using the SMS text message address, you can send a regular and it will be converted by the SMS gateway (txt.bellmobility.ca in the example) into a text message and be delivered to your phone. There may be a short delay while the conversion from to text message occurs, but the message usually arrives in less than a minute.HMIClient
12 OPC to Web Methods ASP – Active Server Pages Webserver reads some “live” or active data one time, and puts it into the web pageNo client side plug-ins or ActiveX requiredEasy to implementEasy on system resources – client and serverRequires page reload to refresh dataGood for reports or one-shot, one-off data needsOPC DataHubOPC Servers (1 to N) Local or Remote/TunneledStandard Web Browsers on Desktop or Mobile DevicesProcessing of data in DataHub on Server Side and value inserted into HTML web pageI will address how the challenges addressed in slides 6-8
15 OPC to Web Methods Java Applets Java Applets are another alternativeVery, very fast update ratesVery thrifty on server and client side compared to AJAXSpeed of AJAX with thriftiness of ASPBut you will have to allow the Java Applets to installUsed in process control systems for monitoring and HMI displaysOPC DataHubOPC Servers (1 to N) Local or Remote/TunneledStandard Web Browsers w/ Java on Desktop PCs onlyIIS or Apache WebServer serves up web pagesMethod #2OPC DataHubOPC Servers (1 to N) Local or Remote/TunneledStandard Web Browsers w/ Java on Desktop PCs onlyDataHub WebServer serves up web pagesMethod #1Java is enormously faster than Ajax. It is by far the fastest of all of the web connection methods we work with. A Java applet can attain 10x the speed of Ajax with a tiny fraction of the CPU usage. It can achieve nearly the same data rates as the OPC DataHub's built-in tunneling. It is also the easiest for a web developer to work with.Java has three big disadvantages:- it doesn't connect on port 80 so it is not as firewall friendly (we're looking at that)- it is not encrypted- it requires a Java plug-in for the web browserAfter this page we go into the live demos…. Today we have a special guest to do our Live demo, Andrew Thomas the lead developer for Cogent.
16 Developing OPC HMI for a Web Browser Live DemoOPC DataHub with ASPOPC DataHub with AJAXPollingStreamingOPC DataHub with Java Applets
18 Web Development Changed Code-less, no more learning “languages”AJAX delivers dynamic pages, no reloadWinform/Webform development = same!Easy debugging with Visual Studio.NETLive OPC data in the Browser is now Easy!
19 Web-HMI, does it make sense? When it makes senseNot a good fit!Simple screens with few graphicsData response can be slowRestrict access to users/groupsMust be accessibleInside/outside LANDesktop, Laptop, Phone etc.High-speed data (sub 1-second)Large quantities of data on-screen.High concurrent user # with above.Continuous process control / monitoring
20 OPC Systems .NET Benefits OPC Systems .NET provides these benefits:Central “always-on” tag repository = faster performanceTag data can come from OPC DA, UA* and/or DatabasesMulti-Threaded for faster, and more Reliable operationsBuffers data, eliminating data-loss for short outages as well as maximizing the performance of your web-linkModular, components available separately or as a suiteAffordable, not as expensive as you might thinkOPC Self-Certified, for assurance in qualityAlright, so we now know what the point of this system is, so lets quickly gain an understanding of some of the benefits in the system, the very things that you can’t see, hear, smell or touch…Scalability: you know you need it! The system you implement today is likely going to grow tomorrow, and when those needs arise, you’ll need a system/platform that will give you that flexibility. Well, it’s in there and we’ll see what this means in just a moment.Multi-threaded: concurrent processing enables the software to be more responsive and utilize your computing power more efficiently. Likewise, put this system on a multi-processor PC and watch the performance increase.Buffers data: Zero data-loss is possible even with temporary network outages. Obviously this is a big deal, but you’ll see what this means in just a moment.Modular: Means you can buy just what you need, to keep costs down, or maximize on your investment and savings and go with the entire suite.Affordable: You’re about to see that there’s a lot to this system, but you’ll be surprised at how affordable and cost-effective this solution is.OPC Self-Certified: This is a big-deal. If you use OPC software, it should be Self-Tested by a minimum, if not, don’t use it. This is a seal of quality, meaning that the software has been to OPC Interoperability Workshops where it has been tested against other vendors software, but also tested by the OPC Foundation’s error injection server that passes bad and invalid information to the client to ensure that it gracefully handles and recovers from problematic situations.Oh, what’s that bottom bullet? Oh yeah, no more DCOM headaches… why? Because OPCSystems.NET is based on .NET technology and consequently uses .NET Remoting instead – which is the platform that Microsoft wanted us to migrate towards so that DCOM could die a peaceful death.* While OPC UA is not yet released, OPC Systems .NET was one of the first to implement OPC UA back in 2006 and will support OPC UA once the OPC Foundation releases the necessary Tools.
21 OPC Systems .NET Service (Tag Repository) How it works…Tag repository stores Data, and some historyData can come from OPC Servers (DA, UA etc.)OPC Connection is always ON eliminating connectivity overheadBrowsers see OPC Data when page opensAsync polling retrieves data to be shown in page, no refresh!AJAX PollingOPC Systems .NET Service (Tag Repository)Data SourceOPC ServerSo here’s a picture of how all the pieces fit together…In the middle of the picture is the heart of the system, the OPC Systems .NET Service. This is your Tag Repository. This is the center of the universe. All of your tags are defined here, as well as where the values of those tags come from – which could by an OPC Server, a database or your own application.All of the OPC Systems.NET applications and components communicate directly to the OPC Systems .NET Service. Notice how they don’t communicate to the OPC Server? That’s by design. If they went directly to the OPC Server then you would be using DCOM and we don’t want to use that now do we? So we go to the Service instead using .NET Remoting.Well, let’s talk about these Client application connections…PLCDCSOther
22 OPC Systems .NET Service (Tag Repository) How it works…Browser requests an “update” of the items/tags it needs.OPC Systems .NET Server responds with values that have changed:If value remains same, empty data-set returnedIf 1-value changed, that value is returnedIf the value changed multiple times, all updates sentAJAX PollingOPC Systems .NET Service (Tag Repository)Data SourceOPC ServerSo here’s a picture of how all the pieces fit together…In the middle of the picture is the heart of the system, the OPC Systems .NET Service. This is your Tag Repository. This is the center of the universe. All of your tags are defined here, as well as where the values of those tags come from – which could by an OPC Server, a database or your own application.All of the OPC Systems.NET applications and components communicate directly to the OPC Systems .NET Service. Notice how they don’t communicate to the OPC Server? That’s by design. If they went directly to the OPC Server then you would be using DCOM and we don’t want to use that now do we? So we go to the Service instead using .NET Remoting.Well, let’s talk about these Client application connections…PLCDCSOther
23 Live Demo Create a multi-page Web Site Use Visual Studio .NET 2005 Master PagesDisplay some (almost) real-time dataSimple Form ControlsCharting pageAlarm display and acknowledgement pageOk, here we are, live demo time… so we have quite a lot of things to demo here. This will be a good test of all those things I’ve been talking about are true, can I show all of this in the remaining time?We’ll setup our Tag repository to acquire tags from an OPC Server.We’ll data-log those tags to a Text File.We’ll then create a simple Windows HMI application with some data, charting and alarming capabilities. Then we’ll see how to deploy it.We’ll quickly create a web-based HMI screen.So let’s switch over to our Virtual PC and demo all of this stuff.
24 OPC Systems .NET Service (Tag Repository) ToleranceOPC Systems .NET Service (Tag Repository)Client ApplicationQueueLocalNetworkInternetTag Repository individually “caches” data to each clientIf a client goes temporarily offline, it will “catch-up” on the next update.Applies to ALL OPC Systems .NET Clients (data logging, alarms, WinForms, WebForms etc.)
25 Other Features Available Data Logging (text files and databases)Report generationAlarm logging and notificationWindows Forms development toolsRecipe managementLightweight HMI developer studio
26 Summary Convenience: Quickly and easily build & deploy HMIs Scalable Framework: allowing your system to growReliable: OPC Self-Certified, plus BufferingAlerting: Data Logging, Reporting, Alarming & NotificationsOpen: API provides interface for your apps to controlAffordable: modular, buy what you need.So to wrap-up:We’ve seen what convenience means in terms of rapid development and easy deployment meansWe understand some of the ways in which you can scale-up your systemWe can trust the software because of its OPC Self Certified status, and also trust in the communications infrastructure which can eliminate data-loss for short network outages.You’ve got the alerting capabilities for alarms and reports.You’ve got an open API for those developers out there that want and/or need to build custom software to further enhance/extend their overall systems.And it’s affordable folks. Go out there and add-up the cost of equivalent tools giving this functionality – that’s assuming that you don’t have to re-invent parts of the system yourself.
27 More Information … get through to an expert! Questions: Visit for future eventsQuestions:Nathan Pocock:Tel: +1 (704)Colin WinchesterTel: x1327Technical Support:Tel: +1 (704)Web:So at this point, we have finished the Presentation and now I’d like to open-up the phones for Questions and Answers.
28 Affordable License the entire system for just $1,995.00 No OPC Server Connection or Tag CountsNo Client counts at the OPCSystems ServiceNo Text File or Database Connection CountsCode-less development tools are Runtime-freeFully documented, lots of examplesSmartClient Technology readySo what do you think? Not bad eh? There’s a lot in there huh?I’ll bet you’re wondering “yeah, but what’s the damage?” – well, you can get the whole thing for just $Now, we don’t care or count things like OPC Server connections, tag points, how many files or databases you’re going to log to. Likewise, the development tools are Runtime-free. All the documentation and tutorials are part of the package. And the SmartClient technology is a benefit of the .NET Framework and Visual Studio .NET, so guess what? That’s FREE.
29 What Tools are Needed? ASP or AJAX Polling Scenario $995$3750Unlimited # of client connectionsOPC bridging, scripting, aggregation & Excel connections are included!No license limits on # of OPC items you access!No Server Operating system requiredMy thoughts are that I’ll price out some ranges for theseSince every application is special, its impossible to do hard specials, but we know these are nice $$ applications, so my thought is offering 10% off a “OPC to Web” data hub solution isn’t a bad thing!This will likely become multiple slides as I need to do a drawing for the scenarios using the graphics from the website – no problem getting that done.
30 What Tools are Needed? AJAX Streaming and Java Applets w/DataHub WebServer $995$3750$595/eaNo Server class Operating System Needed! i.e. Run on Windows XPTCP/Link Licenses are concurrent connection licensesDataHub other features included!No license limits on # of OPC items you access!My thoughts are that I’ll price out some ranges for theseSince every application is special, its impossible to do hard specials, but we know these are nice $$ applications, so my thought is offering 10% off a “OPC to Web” data hub solution isn’t a bad thing!This will likely become multiple slides as I need to do a drawing for the scenarios using the graphics from the website – no problem getting that done.
31 What Tools are Needed? Java Applets w/IIS or Apache WebServer $995$3750$595/eaIIS or Apache WebServer serves up web pagesIIS or Webserver may be free, but will require IT involvementIIS is not really “free” – requires a Server Grade Operating SystemAnd, IIS & Apache present much bigger attack surfaceTCP/Link Licenses are concurrent connection licensesOPC bridging, scripting, aggregation & Excel connections included!No license limits on # of OPC items you access!My thoughts are that I’ll price out some ranges for theseSince every application is special, its impossible to do hard specials, but we know these are nice $$ applications, so my thought is offering 10% off a “OPC to Web” data hub solution isn’t a bad thing!This will likely become multiple slides as I need to do a drawing for the scenarios using the graphics from the website – no problem getting that done.
Your consent to our cookies if you continue to use this website.