|
@@ -1,78 +1,160 @@
|
|
|
+
|
|
|
<div class="standardContainer">
|
|
|
<div class="ui basic segment">
|
|
|
- <h2>Redirection Rules</h2>
|
|
|
- <p>Add exception case for redirecting any matching URLs</p>
|
|
|
+ <h2>Path & Redirection</h2>
|
|
|
+ <p>Setup redirection and path specific settings like custom header, contents and status codes</p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="ui top attached tabular menu">
|
|
|
+ <a class="pathAndRedirect item active" data-tab="tab_redirect"><i class="ui blue level up alternate icon"></i> Redirect</a>
|
|
|
+ <a class="pathAndRedirect item" data-tab="tab_pathrules"><i class="ui code icon"></i> Path Rules</a>
|
|
|
+ <a class="pathAndRedirect item" data-tab="tab_pathcache"><i class="ui teal database icon"></i> Caches</a>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="ui bottom attached tab segment active" data-tab="tab_redirect">
|
|
|
+ <div class="ui basic segment">
|
|
|
+ <h2>Redirection Rules</h2>
|
|
|
+ <p>Add exception case for redirecting any matching URLs</p>
|
|
|
+ </div>
|
|
|
+ <div style="width: 100%; overflow-x: auto;">
|
|
|
+ <table class="ui sortable unstackable celled table" >
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th>Redirection URL</th>
|
|
|
+ <th>Destination URL</th>
|
|
|
+ <th class="no-sort">Copy Pathname</th>
|
|
|
+ <th class="no-sort">Status Code</th>
|
|
|
+ <th class="no-sort">Remove</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody id="redirectionRuleList">
|
|
|
+ <tr>
|
|
|
+ <td></td>
|
|
|
+ <td></td>
|
|
|
+ <td></td>
|
|
|
+ <td></td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ <div class="ui green message" id="delRuleSucc" style="display:none;">
|
|
|
+ <i class="ui green checkmark icon"></i> Redirection Rule Deleted
|
|
|
+ </div>
|
|
|
+ <div class="ui divider"></div>
|
|
|
+ <h4>Add Redirection Rule</h4>
|
|
|
+ <div class="ui form">
|
|
|
+ <div class="field">
|
|
|
+ <label>Redirection URL (From)</label>
|
|
|
+ <input type="text" id="rurl" name="redirection-url" placeholder="Redirection URL">
|
|
|
+ <small><i class="ui circle info icon"></i> Any matching prefix of the request URL will be redirected to the destination URL, e.g. redirect.example.com</small>
|
|
|
+ </div>
|
|
|
+ <div class="field">
|
|
|
+ <label>Destination URL (To)</label>
|
|
|
+ <input type="text" name="destination-url" placeholder="Destination URL">
|
|
|
+ <small><i class="ui circle info icon"></i> The target URL request being redirected to, e.g. dest.example.com/mysite</small>
|
|
|
+ </div>
|
|
|
+ <div class="field">
|
|
|
+ <div class="ui checkbox">
|
|
|
+ <input type="checkbox" name="forward-childpath" tabindex="0" class="hidden" checked>
|
|
|
+ <label>Forward Pathname</label>
|
|
|
+ </div>
|
|
|
+ <div class="ui message">
|
|
|
+ <p>Append the current pathname after the redirect destination</p>
|
|
|
+ <i class="check square outline icon"></i> old.example.com<b>/blog?post=13</b> <i class="long arrow alternate right icon" style="margin-left: 1em;"></i> new.example.com<b>/blog?post=13</b> <br>
|
|
|
+ <i class="square outline icon"></i> old.example.com<b>/blog?post=13</b> <i class="long arrow alternate right icon" style="margin-left: 1em;"></i> new.example.com
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="grouped fields">
|
|
|
+ <label>Redirection Status Code</label>
|
|
|
+ <div class="field">
|
|
|
+ <div class="ui radio checkbox">
|
|
|
+ <input type="radio" name="redirect-type" value="307" checked>
|
|
|
+ <label>Temporary Redirect <br><small>Status Code: 307</small></label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="field">
|
|
|
+ <div class="ui radio checkbox">
|
|
|
+ <input type="radio" name="redirect-type" value="301">
|
|
|
+ <label>Moved Permanently <br><small>Status Code: 301</small></label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <button class="ui basic button" onclick="addRules();"><i class="ui teal plus icon"></i> Add Redirection Rule</button>
|
|
|
+ <div class="ui green message" id="ruleAddSucc" style="display:none;">
|
|
|
+ <i class="ui green checkmark icon"></i> Redirection Rules Added
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div style="width: 100%; overflow-x: auto;">
|
|
|
+
|
|
|
+ <!-- Path Rules -->
|
|
|
+ <div class="ui bottom attached tab segment" data-tab="tab_pathrules">
|
|
|
+ <div class="ui basic segment">
|
|
|
+ <h2>Special Path Rules</h2>
|
|
|
+ <p>Advanced customization for response on particular matching path or URL</p>
|
|
|
+ </div>
|
|
|
+ <div style="width: 100%; overflow-x: auto;">
|
|
|
<table class="ui sortable unstackable celled table" >
|
|
|
<thead>
|
|
|
<tr>
|
|
|
- <th>Redirection URL</th>
|
|
|
- <th>Destination URL</th>
|
|
|
- <th class="no-sort">Copy Pathname</th>
|
|
|
- <th class="no-sort">Status Code</th>
|
|
|
- <th class="no-sort">Remove</th>
|
|
|
+ <th>Matching Path</th>
|
|
|
+ <th>Status Code</th>
|
|
|
+ <th class="no-sort">Exact Match</th>
|
|
|
+ <th class="no-sort">Case Sensitive</th>
|
|
|
+ <th class="no-sort">Enabled</th>
|
|
|
+ <th class="no-sort">Actions</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
- <tbody id="redirectionRuleList">
|
|
|
+ <tbody id="specialPathRules">
|
|
|
<tr>
|
|
|
<td></td>
|
|
|
<td></td>
|
|
|
<td></td>
|
|
|
<td></td>
|
|
|
+ <td></td>
|
|
|
+ <td></td>
|
|
|
</tr>
|
|
|
</tbody>
|
|
|
</table>
|
|
|
</div>
|
|
|
- <div class="ui green message" id="delRuleSucc" style="display:none;">
|
|
|
- <i class="ui green checkmark icon"></i> Redirection Rule Deleted
|
|
|
- </div>
|
|
|
<div class="ui divider"></div>
|
|
|
- <h4>Add Redirection Rule</h4>
|
|
|
+ <h4>Add Special Path Rule</h4>
|
|
|
<div class="ui form">
|
|
|
- <div class="field">
|
|
|
- <label>Redirection URL (From)</label>
|
|
|
- <input type="text" id="rurl" name="redirection-url" placeholder="Redirection URL">
|
|
|
- <small><i class="ui circle info icon"></i> Any matching prefix of the request URL will be redirected to the destination URL, e.g. redirect.example.com</small>
|
|
|
+ <div class="field">
|
|
|
+ <label>Matching URI</label>
|
|
|
+ <input type="text" name="matchingPath" placeholder="Matching URL">
|
|
|
+ <small><i class="ui circle info icon"></i> Any matching prefix of the request URL will be handled by this rule, e.g. example.com/secret</small>
|
|
|
+ </div>
|
|
|
+ <div class="field">
|
|
|
+ <div class="ui checkbox">
|
|
|
+ <input type="checkbox" name="exactMatch" tabindex="0" class="hidden">
|
|
|
+ <label>Require Exact Match</label>
|
|
|
</div>
|
|
|
- <div class="field">
|
|
|
- <label>Destination URL (To)</label>
|
|
|
- <input type="text" name="destination-url" placeholder="Destination URL">
|
|
|
- <small><i class="ui circle info icon"></i> The target URL request being redirected to, e.g. dest.example.com/mysite</small>
|
|
|
- </div>
|
|
|
- <div class="field">
|
|
|
- <div class="ui checkbox">
|
|
|
- <input type="checkbox" name="forward-childpath" tabindex="0" class="hidden" checked>
|
|
|
- <label>Forward Pathname</label>
|
|
|
- </div>
|
|
|
- <div class="ui message">
|
|
|
- <p>Append the current pathname after the redirect destination</p>
|
|
|
- <i class="check square outline icon"></i> old.example.com<b>/blog?post=13</b> <i class="long arrow alternate right icon" style="margin-left: 1em;"></i> new.example.com<b>/blog?post=13</b> <br>
|
|
|
- <i class="square outline icon"></i> old.example.com<b>/blog?post=13</b> <i class="long arrow alternate right icon" style="margin-left: 1em;"></i> new.example.com
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="grouped fields">
|
|
|
- <label>Redirection Status Code</label>
|
|
|
- <div class="field">
|
|
|
- <div class="ui radio checkbox">
|
|
|
- <input type="radio" name="redirect-type" value="307" checked>
|
|
|
- <label>Temporary Redirect <br><small>Status Code: 307</small></label>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="field">
|
|
|
- <div class="ui radio checkbox">
|
|
|
- <input type="radio" name="redirect-type" value="301">
|
|
|
- <label>Moved Permanently <br><small>Status Code: 301</small></label>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <button class="ui basic button" onclick="addRules();"><i class="ui teal plus icon"></i> Add Redirection Rule</button>
|
|
|
- <div class="ui green message" id="ruleAddSucc" style="display:none;">
|
|
|
- <i class="ui green checkmark icon"></i> Redirection Rules Added
|
|
|
+ <div class="ui message">
|
|
|
+ <p>Require exactly match but not prefix match (default). Enable this if you only want to block access to a directory but not the resources inside the directory. Assume you have entered a matching URI of <b>example.com/secret/</b> and set it to return 401</p>
|
|
|
+ <i class="check square outline icon"></i> example.com/secret<b>/image.png</b> <i class="long arrow alternate right icon" style="margin-left: 1em;"></i> (content of image.png)<br>
|
|
|
+ <i class="square outline icon"></i> example.com/secret<b>/image.png</b> <i class="long arrow alternate right icon" style="margin-left: 1em;"></i> HTTP 401
|
|
|
</div>
|
|
|
+ </div>
|
|
|
+ <div class="field">
|
|
|
+ <label>Response Status Code</label>
|
|
|
+ <input type="text"name="statusCode" placeholder="500">
|
|
|
+ <small><i class="ui circle info icon"></i> HTTP Status Code to be served by this rule</small>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Path Rules -->
|
|
|
+ <div class="ui bottom attached tab segment" data-tab="tab_pathcache">
|
|
|
+ <p>Work In Progress</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
<script>
|
|
|
+ $('.menu .pathAndRedirect.item').tab();
|
|
|
+ $('.menu .pathAndRedirect.item').addClass("activated");
|
|
|
+
|
|
|
+ /*
|
|
|
+ Redirection functions
|
|
|
+ */
|
|
|
$(".checkbox").checkbox();
|
|
|
|
|
|
function resetForm() {
|