-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathscenario4.html
148 lines (131 loc) · 5.3 KB
/
scenario4.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>What the f..orward?!</title>
<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Fira Code"
/>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<div class="content">
<div id="scenario-buttons">
<a id="nav-1" href="./scenario1.html">
<span class="scenario">1</span>
</a>
<a id="nav-2" href="./scenario2.html">
<span class="scenario">2</span>
</a>
<a id="nav-3" href="./scenario3.html">
<span class="scenario">3</span>
</a>
<a id="nav-4" href="./scenario4.html">
<span class="scenario scenario-current">4</span>
</a>
</div>
<p>
There is another computer on my network and I want to open one of its
ports to the outside world so that others can access it.
</p>
<pre>
another computer my computer gateway
@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@
@ <span class="b">(B)</span> @ @ @ @ <span class="d">(D)</span> @
@ @ @ @ ssh @ @
@ my app <----- <span class="a">1234</span> <----- @ @ <==============> @ <------------ <span class="c">8080</span> <--- curl gateway:8080
@ @ <span class="a">(A)</span> @ @ <span class="e">username</span> @ @ <span class="c">(C)</span>
@ @ @ ssh client @ <span class="e">(E)</span> @ ssh server @
@@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@ @@@@@@@@@@@@@@@@@@
</pre>
<p>Example</p>
<p>
My application runs on another computer in my network and I want people
from outside of my network to access it.
</p>
<p>Important</p>
<p>
I'm sure that 'GatewayPorts' is set to 'yes' on the gateway. <br />
If this is not the case, it can be set by executing this command on the
gateway:
</p>
<p>echo 'GatewayPorts yes' >> sshd_config</p>
<div class="questions">
<div>
<label class="a" for="otherport">Other computer's port (A):</label>
<input class="a" type="text" id="otherport" value="1234" />
</div>
<div>
<label class="b" for="otheraddr">Other computer's address (B):</label>
<input
class="b"
type="text"
id="otheraddr"
value="another-computer"
/>
</div>
<div>
<label class="c" for="gwport">Gateway's port (C):</label>
<input class="c" type="text" id="gwport" value="8080" />
</div>
<div>
<label class="d" for="gwaddr">Gateway's address (D):</label>
<input class="d" type="text" id="gwaddr" value="gateway" />
</div>
<div>
<label class="e" for="username">SSH username (E):</label>
<input class="e" type="text" id="username" value="user" />
</div>
</div>
<div class="misc">
<label id="background-wrapper">
<input id="background-checkbox" type="checkbox" />
<span class="on">[x]</span>
<span class="off">[_]</span>
run as <kbd class="hotkey">b</kbd>ackground process
</label>
</div>
<div>
<label id="result"></label>
</div>
<div>
<button id="copy-button">copy to clipboard</button>
</div>
</div>
<script src="./hotkeys.js"></script>
<script>
const otherport = document.getElementById('otherport')
const otheraddr = document.getElementById('otheraddr')
const gwport = document.getElementById('gwport')
const gwaddr = document.getElementById('gwaddr')
const username = document.getElementById('username')
const backgroundCheckbox = document.getElementById('background-checkbox')
const result = document.getElementById('result')
const ssh = 'ssh '
const lr = '-R '
function concatInputs() {
return `0.0.0.0:${gwport.value}:${otheraddr.value}:${otherport.value} ${username.value}@${gwaddr.value}`
}
result.innerText = `${ssh}${background()}${lr}${concatInputs()}`
const inputHandler = function () {
result.innerText = `${ssh}${background()}${lr}${concatInputs()}`
}
function background() {
if (backgroundCheckbox.checked) return '-f -N '
else return ''
}
otherport.addEventListener('input', inputHandler)
otheraddr.addEventListener('input', inputHandler)
gwport.addEventListener('input', inputHandler)
gwaddr.addEventListener('input', inputHandler)
username.addEventListener('input', inputHandler)
backgroundCheckbox.addEventListener('input', inputHandler)
function copyResultToClipboard() {
navigator.clipboard.writeText(result.innerText)
}
const copyButton = document.getElementById('copy-button')
copyButton.addEventListener('click', copyResultToClipboard)
</script>
</body>
</html>