| |
| |
| <!DOCTYPE html> |
| <!--[if IE 8]><html class="no-js lt-ie9" lang="en" > <![endif]--> |
| <!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]--> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| |
| <title>Traffic Portal — Traffic Control master documentation </title> |
| |
| |
| |
| |
| <link rel="shortcut icon" href="../_static/favicon.ico"/> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <link rel="stylesheet" href="../_static/css/theme.css" type="text/css" /> |
| |
| |
| |
| <link rel="stylesheet" href="../_static/theme_overrides.css" type="text/css" /> |
| |
| |
| |
| <link rel="top" title="Traffic Control master documentation" href="../index.html"/> |
| <link rel="up" title="Developer’s Guide" href="index.html"/> |
| <link rel="next" title="Traffic Router" href="traffic_router.html"/> |
| <link rel="prev" title="Snapshot CRConfig" href="traffic_ops_api/v12/topology.html"/> |
| |
| |
| <script src="_static/js/modernizr.min.js"></script> |
| |
| </head> |
| |
| <body class="wy-body-for-nav" role="document"> |
| |
| <div class="wy-grid-for-nav"> |
| |
| |
| <nav data-toggle="wy-nav-shift" class="wy-nav-side"> |
| <div class="wy-side-nav-search"> |
| |
| |
| |
| <a href="/" class="icon icon-home"> Traffic Control |
| |
| |
| |
| |
| <img src="../_static/tc_logo_c_only.png" class="logo" /> |
| |
| </a> |
| |
| |
| <div role="search"> |
| <form id="rtd-search-form" class="wy-form" action="../search.html" method="get"> |
| <input type="text" name="q" placeholder="Search docs" /> |
| <input type="hidden" name="check_keywords" value="yes" /> |
| <input type="hidden" name="area" value="default" /> |
| </form> |
| </div> |
| |
| |
| </div> |
| |
| <div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation"> |
| |
| |
| |
| <ul> |
| <li class="toctree-l1"><a class="reference internal" href="../basics/index.html">CDN Basics</a><ul> |
| <li class="toctree-l2"><a class="reference internal" href="../basics/content_delivery_networks.html">Content Delivery Networks</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../basics/http_11.html">HTTP 1.1</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../basics/caching_proxies.html">Caching Proxies</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../basics/cache_revalidation.html">Cache Control Headers and Revalidation</a></li> |
| </ul> |
| </li> |
| </ul> |
| <ul> |
| <li class="toctree-l1"><a class="reference internal" href="../overview/index.html">Traffic Control Overview</a><ul> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/introduction.html">Introduction</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/traffic_ops.html">Traffic Ops</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/traffic_portal.html">Traffic Portal</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/traffic_router.html">Traffic Router</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/traffic_monitor.html">Traffic Monitor</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/traffic_stats.html">Traffic Stats</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/traffic_server.html">Traffic Server</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../overview/traffic_vault.html">Traffic Vault</a></li> |
| </ul> |
| </li> |
| </ul> |
| <ul> |
| <li class="toctree-l1"><a class="reference internal" href="../admin/index.html">Administrator’s Guide</a><ul> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_ops_install.html">Installing Traffic Ops</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_ops_config.html">Configuring Traffic Ops</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_ops_using.html">Using Traffic Ops</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_ops_extensions.html">Managing Traffic Ops Extensions</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_portal.html">Traffic Portal Administration</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_monitor.html">Traffic Monitor Administration</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_router.html">Traffic Router Administration</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_stats.html">Traffic Stats Administration</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_server.html">Traffic Server Administration</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/traffic_vault.html">Traffic Vault Administration</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../admin/quick_howto/index.html">Quick How To Guides</a></li> |
| </ul> |
| </li> |
| </ul> |
| <ul class="current"> |
| <li class="toctree-l1 current"><a class="reference internal" href="index.html">Developer’s Guide</a><ul class="current"> |
| <li class="toctree-l2"><a class="reference internal" href="traffic_ops.html">Traffic Ops</a></li> |
| <li class="toctree-l2 current"><a class="current reference internal" href="">Traffic Portal</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="traffic_router.html">Traffic Router</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="traffic_monitor.html">Traffic Monitor</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="traffic_stats.html">Traffic Stats</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="traffic_server.html">Traffic Server</a></li> |
| </ul> |
| </li> |
| </ul> |
| <ul> |
| <li class="toctree-l1"><a class="reference internal" href="../faq/index.html">FAQ</a><ul> |
| <li class="toctree-l2"><a class="reference internal" href="../faq/general.html">General</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../faq/development.html">Development</a></li> |
| <li class="toctree-l2"><a class="reference internal" href="../faq/administration.html">Running a Traffic Control CDN</a></li> |
| </ul> |
| </li> |
| </ul> |
| <ul> |
| <li class="toctree-l1"><a class="reference internal" href="../glossary.html">Glossary</a></li> |
| </ul> |
| |
| |
| |
| </div> |
| |
| </nav> |
| |
| <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"> |
| |
| |
| <nav class="wy-nav-top" role="navigation" aria-label="top navigation"> |
| <i data-toggle="wy-nav-top" class="fa fa-bars"></i> |
| <a href="../index.html">Traffic Control</a> |
| </nav> |
| |
| |
| |
| <div class="wy-nav-content"> |
| <div class="rst-content"> |
| <div role="navigation" aria-label="breadcrumbs navigation"> |
| <ul class="wy-breadcrumbs"> |
| <li><a href="../index.html">Traffic Control master</a> »</li> |
| |
| <li><a href="index.html">Developer’s Guide</a> »</li> |
| |
| <li>Traffic Portal</li> |
| <li class="wy-breadcrumbs-aside"> |
| |
| <a href="../_sources/development/traffic_portal.txt" rel="nofollow"> View page source</a> |
| |
| </li> |
| </ul> |
| <hr/> |
| </div> |
| |
| <div class="rst-footer-buttons" role="navigation" aria-label="footer navigation"> |
| |
| <a href="traffic_router.html" class="btn btn-neutral float-right" title="Traffic Router">Next <span class="fa fa-arrow-circle-right"></span></a> |
| |
| |
| <a href="traffic_ops_api/v12/topology.html" class="btn btn-neutral" title="Snapshot CRConfig"><span class="fa fa-arrow-circle-left"></span> Previous</a> |
| |
| </div> |
| |
| <div role="main" class="document"> |
| |
| <div class="section" id="traffic-portal"> |
| <h1>Traffic Portal<a class="headerlink" href="#traffic-portal" title="Permalink to this headline">¶</a></h1> |
| <div class="section" id="introduction"> |
| <h2>Introduction<a class="headerlink" href="#introduction" title="Permalink to this headline">¶</a></h2> |
| <p>Traffic Portal is an <a class="reference external" href="https://angularjs.org/">AngularJS 1.x</a> client served from a <a class="reference external" href="https://nodejs.org/en/">Node.js</a> web server designed to consume the Traffic Ops 1.x API. Traffic Portal provides a set of functionality restricted to the delivery service(s) of the authenticated user. Functionality primarily includes a set of charts / graphs designed to provide insight into the performance of a user’s delivery service(s).</p> |
| </div> |
| <div class="section" id="software-requirements"> |
| <h2>Software Requirements<a class="headerlink" href="#software-requirements" title="Permalink to this headline">¶</a></h2> |
| <p>To work on Traffic Portal you need a *nix (MacOS and Linux are most commonly used) environment that has the following installed:</p> |
| <blockquote> |
| <div><ul class="simple"> |
| <li><a class="reference external" href="https://www.ruby-lang.org/en/">Ruby 2.0.x or above</a></li> |
| <li><a class="reference external" href="http://compass-style.org/">Compass 1.0.x or above</a></li> |
| <li><a class="reference external" href="https://nodejs.org/en/">Node.js 6.0.x or above</a></li> |
| <li><a class="reference external" href="https://nodejs.org/en/">Bower 1.7.9 or above</a></li> |
| <li><a class="reference external" href="https://github.com/gruntjs/grunt-cli">Grunt CLI 1.2.0 or above</a></li> |
| <li>Access to a working instance of Traffic Ops</li> |
| </ul> |
| </div></blockquote> |
| </div> |
| <div class="section" id="traffic-portal-project-tree-overview"> |
| <h2>Traffic Portal Project Tree Overview<a class="headerlink" href="#traffic-portal-project-tree-overview" title="Permalink to this headline">¶</a></h2> |
| <blockquote> |
| <div><ul class="simple"> |
| <li><strong>traffic_control/traffic_portal/app/src</strong> - contains HTML, JavaScript and Sass source files.</li> |
| </ul> |
| </div></blockquote> |
| </div> |
| <div class="section" id="installing-the-traffic-portal-developer-environment"> |
| <h2>Installing The Traffic Portal Developer Environment<a class="headerlink" href="#installing-the-traffic-portal-developer-environment" title="Permalink to this headline">¶</a></h2> |
| <blockquote> |
| <div><ul class="simple"> |
| <li>Clone the traffic_control repository</li> |
| <li>Navigate to the traffic_control/traffic_portal of your cloned repository.</li> |
| <li>Run <code class="docutils literal"><span class="pre">npm</span> <span class="pre">install</span></code> to install application dependencies. Only needs to be done the first time unless traffic_portal/package.json changes.</li> |
| <li>Run <code class="docutils literal"><span class="pre">bower</span> <span class="pre">install</span></code> to install client-side dependencies. Only needs to be done the first time unless traffic_portal/bower.json changes.</li> |
| <li>Run <code class="docutils literal"><span class="pre">grunt</span></code> to package the application into traffic_portal/app/dist, start a local http server (Express), and start a file watcher.</li> |
| <li>Navigate to <a class="reference external" href="http://localhost:8080">http://localhost:8080</a></li> |
| </ul> |
| </div></blockquote> |
| </div> |
| <div class="section" id="notes"> |
| <h2>Notes<a class="headerlink" href="#notes" title="Permalink to this headline">¶</a></h2> |
| <ul class="simple"> |
| <li>The Traffic Portal consumes the Traffic Ops API. By default, Traffic Portal assumes Traffic Ops is running on <a class="reference external" href="http://localhost:3000">http://localhost:3000</a>. Temporarily modify conf/config.js if you need to change the location of Traffic Ops.</li> |
| </ul> |
| </div> |
| </div> |
| |
| |
| </div> |
| <footer> |
| |
| <div class="rst-footer-buttons" role="navigation" aria-label="footer navigation"> |
| |
| <a href="traffic_router.html" class="btn btn-neutral float-right" title="Traffic Router">Next <span class="fa fa-arrow-circle-right"></span></a> |
| |
| |
| <a href="traffic_ops_api/v12/topology.html" class="btn btn-neutral" title="Snapshot CRConfig"><span class="fa fa-arrow-circle-left"></span> Previous</a> |
| |
| </div> |
| |
| |
| <hr/> |
| |
| <div role="contentinfo"> |
| <p> |
| </p> |
| </div> |
| Built with <a href="http://sphinx-doc.org/">Sphinx</a> using a <a href="https://github.com/snide/sphinx_rtd_theme">theme</a> provided by <a href="https://readthedocs.org">Read the Docs</a>. |
| |
| </footer> |
| |
| </div> |
| </div> |
| |
| </section> |
| |
| </div> |
| |
| |
| |
| |
| |
| <script type="text/javascript"> |
| var DOCUMENTATION_OPTIONS = { |
| URL_ROOT:'../', |
| VERSION:'master', |
| COLLAPSE_INDEX:false, |
| FILE_SUFFIX:'.html', |
| HAS_SOURCE: true |
| }; |
| </script> |
| <script type="text/javascript" src="../_static/jquery.js"></script> |
| <script type="text/javascript" src="../_static/underscore.js"></script> |
| <script type="text/javascript" src="../_static/doctools.js"></script> |
| |
| |
| |
| |
| |
| <script type="text/javascript" src="../_static/js/theme.js"></script> |
| |
| |
| |
| |
| <script type="text/javascript"> |
| jQuery(function () { |
| SphinxRtdTheme.StickyNav.enable(); |
| }); |
| </script> |
| |
| |
| </body> |
| </html> |