rproot.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274
  1. <div class="standardContainer">
  2. <div class="ui basic segment">
  3. <h2>Default Site</h2>
  4. <p>Default routing options for inbound traffic (previously called Proxy Root)</p>
  5. <div class="ui form">
  6. <div class="grouped fields">
  7. <label>What to show when Zoraxy is hit with an unknown Host?</label>
  8. <div class="field">
  9. <div class="ui radio defaultsite checkbox">
  10. <input type="radio" name="defaultsiteOption" checked="checked" value="webserver">
  11. <label>Internal Static Web Server<br>
  12. <small>Check this if you prefer a more Apache / Nginx like experience</small>
  13. </label>
  14. </div>
  15. </div>
  16. <div class="field">
  17. <div class="ui radio defaultsite checkbox">
  18. <input type="radio" name="defaultsiteOption" value="proxy">
  19. <label>Reverse Proxy Target<br>
  20. <small>Proxy the request to a target IP / domain</small>
  21. </label>
  22. </div>
  23. </div>
  24. <div class="field">
  25. <div class="ui radio defaultsite checkbox">
  26. <input type="radio" name="defaultsiteOption" value="redirect">
  27. <label>Redirect<br>
  28. <small>Redirect the user to a new location</small>
  29. </label>
  30. </div>
  31. </div>
  32. <div class="field">
  33. <div class="ui radio defaultsite checkbox">
  34. <input type="radio" name="defaultsiteOption" value="notfound">
  35. <label>Show 404 NOT FOUND<br>
  36. <small>Respond to request with a 404 page</small>
  37. </label>
  38. </div>
  39. </div>
  40. </div>
  41. </div>
  42. <!-- Reverse Proxy as Default Site Options -->
  43. <div id="defaultSiteProxyOptions" class="ui basic segment advanceoptions defaultSiteOptionDetails" style="display:none; ">
  44. <div class="ui form">
  45. <div class="field">
  46. <label>Reverse Proxy Target</label>
  47. <input type="text" id="proxyRoot" onchange="checkRootRequireTLS(this.value);">
  48. <small>e.g. localhost:8080 / 192.168.0.100:80 / example.com</small>
  49. </div>
  50. <div class="field">
  51. <div class="ui checkbox">
  52. <input type="checkbox" id="rootReqTLS">
  53. <label>Reverse proxy target require TLS connection <br><small>Check this if your proxy target URL require connection with https://</small></label>
  54. </div>
  55. </div>
  56. </div>
  57. </div>
  58. <!-- Redirect as default site Options-->
  59. <div id="defaultSiteRedirectOptions" class="ui basic segment advanceoptions defaultSiteOptionDetails" style="display:none;"">
  60. <div class="ui form">
  61. <div class="field">
  62. <label>Redirect target domain</label>
  63. <div class="ui input">
  64. <input id="unsetRedirectDomain" type="text" placeholder="http://example.com">
  65. </div>
  66. <small>Unset subdomain will be redirected to the link above. Remember to include the protocol (e.g. http:// or https://)<br>
  67. Leave empty for redirecting to upper level domain (e.g. notfound.example.com <i class="right arrow icon"></i> example.com)</small>
  68. </div>
  69. </div>
  70. </div>
  71. <button class="ui basic button" onclick="setProxyRoot()"><i class="green save icon" ></i> Save Options</button>
  72. </div>
  73. </div>
  74. <script>
  75. let currentDefaultSiteOption = "webserver";
  76. $("#advanceRootSettings").accordion();
  77. //Handle toggle events of option radio boxes
  78. function updateAvaibleDefaultSiteOptions(){
  79. let selectedDefaultSite = $('input[name="defaultsiteOption"]:checked').val();
  80. $(".defaultSiteOptionDetails").hide();
  81. if (selectedDefaultSite == "webserver"){
  82. //Use build in web server as target
  83. let staticWebServerURL = "127.0.0.1:" + $("#webserv_listenPort").val();
  84. $("#proxyRoot").val(staticWebServerURL);
  85. $("#proxyRoot").parent().addClass("disabled");
  86. $("#rootReqTLS").parent().checkbox("set unchecked");
  87. $("#rootReqTLS").parent().addClass("disabled");
  88. }else if (selectedDefaultSite == "proxy"){
  89. $("#defaultSiteProxyOptions").show();
  90. $("#rootReqTLS").parent().removeClass("disabled");
  91. $("#proxyRoot").parent().removeClass("disabled");
  92. initRootInfo();
  93. }else if (selectedDefaultSite == "redirect"){
  94. $("#defaultSiteRedirectOptions").show();
  95. }else if (selectedDefaultSite == "notfound"){
  96. }else{
  97. //Unknown option
  98. return;
  99. }
  100. currentDefaultSiteOption = selectedDefaultSite;
  101. }
  102. //Bind events to the radio boxes
  103. function bindDefaultSiteRadioCheckboxEvents(){
  104. $('input[type=radio][name=defaultsiteOption]').change(function() {
  105. updateAvaibleDefaultSiteOptions();
  106. });
  107. }
  108. function initRootInfo(callback=undefined){
  109. $.get("/api/proxy/list?type=root", function(data){
  110. if (data == null){
  111. }else{
  112. $("#proxyRoot").val(data.Domain);
  113. checkRootRequireTLS(data.Domain);
  114. }
  115. if (callback != undefined){
  116. callback();
  117. }
  118. });
  119. }
  120. initRootInfo(function(){
  121. updateWebServerLinkSettings(function(){
  122. bindDefaultSiteRadioCheckboxEvents();
  123. });
  124. });
  125. //Update the current web server port settings
  126. function updateWebServerLinkSettings(callback=undefined){
  127. isUsingStaticWebServerAsRoot(function(isUsingWebServ){
  128. if (isUsingWebServ){
  129. //Select the
  130. }else{
  131. }
  132. if (callback != undefined){
  133. callback(isUsingWebServ);
  134. }
  135. })
  136. }
  137. function isUsingStaticWebServerAsRoot(callback){
  138. let currentProxyRoot = $("#proxyRoot").val().trim();
  139. $.get("/api/webserv/status", function(webservStatus){
  140. if (currentProxyRoot == "127.0.0.1:" + webservStatus.ListeningPort || currentProxyRoot == "localhost:" + webservStatus.ListeningPort){
  141. return callback(true);
  142. }
  143. return callback(false);
  144. });
  145. }
  146. function updateRootSettingStates(){
  147. $.get("/api/cert/tls", function(data){
  148. if (data == true){
  149. $("#disableRootTLS").parent().removeClass('disabled').attr("title", "");
  150. }else{
  151. $("#disableRootTLS").parent().addClass('disabled').attr("title", "TLS listener is not enabled");
  152. }
  153. });
  154. }
  155. //Bind event to tab switch
  156. tabSwitchEventBind["setroot"] = function(){
  157. //On switch over to this page, update root info
  158. updateRootSettingStates();
  159. }
  160. //Check if the given domain will redirect to https
  161. function checkRootRequireTLS(targetDomain){
  162. //Trim off the http or https from the origin
  163. if (targetDomain.startsWith("http://")){
  164. targetDomain = targetDomain.substring(7);
  165. $("#proxyRoot").val(targetDomain);
  166. }else if (targetDomain.startsWith("https://")){
  167. targetDomain = targetDomain.substring(8);
  168. $("#proxyRoot").val(targetDomain);
  169. }
  170. $.ajax({
  171. url: "/api/proxy/tlscheck",
  172. data: {url: targetDomain},
  173. success: function(data){
  174. if (data.error != undefined){
  175. }else if (data == "https"){
  176. $("#rootReqTLS").parent().checkbox("set checked");
  177. }else if (data == "http"){
  178. $("#rootReqTLS").parent().checkbox("set unchecked");
  179. }
  180. }
  181. })
  182. }
  183. //Set the new proxy root option
  184. function setProxyRoot(){
  185. var newpr = $("#proxyRoot").val();
  186. if (newpr.trim() == ""){
  187. $("#proxyRoot").parent().addClass('error');
  188. return
  189. }else{
  190. $("#proxyRoot").parent().removeClass('error');
  191. }
  192. var rootReqTls = $("#rootReqTLS")[0].checked;
  193. //Create the endpoint by calling add
  194. $.ajax({
  195. url: "/api/proxy/add",
  196. data: {"type": "root", tls: rootReqTls, ep: newpr},
  197. success: function(data){
  198. if (data.error != undefined){
  199. msgbox(data.error, false, 5000);
  200. }else{
  201. //OK
  202. initRootInfo(function(){
  203. //Check if WebServ is enabled
  204. isUsingStaticWebServerAsRoot(function(isUsingWebServ){
  205. if (isUsingWebServ){
  206. //Force enable static web server
  207. //See webserv.html for details
  208. setWebServerRunningState(true);
  209. }
  210. setTimeout(function(){
  211. //Update the checkbox
  212. updateWebServerLinkSettings();
  213. msgbox("Proxy Root Updated");
  214. }, 1000);
  215. })
  216. });
  217. }
  218. }
  219. });
  220. }
  221. function updateRootOptions(){
  222. $.ajax({
  223. type: "POST",
  224. url: "/api/proxy/root/updateOptions",
  225. data: {
  226. unsetRedirect: $("#unsetRedirect")[0].checked,
  227. unsetRedirectTarget: $("#unsetRedirectDomain").val().trim(),
  228. },
  229. success: function(data) {
  230. if (data.error != undefined){
  231. msgbox(data.error, false);
  232. }else{
  233. msgbox("Root Routing Options updated");
  234. }
  235. },
  236. error: function(error) {
  237. console.log("Error:", error);
  238. }
  239. });
  240. }
  241. </script>