-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsetup.html
201 lines (180 loc) · 17.2 KB
/
setup.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
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jMessage | Setup</title>
<link rel="stylesheet" type="text/css" href="public/css/qrstyle.css">
<link rel="stylesheet" type="text/css" href="public/css/setupstyle.css">
<meta property="og:image" content="public/img/icons/android-chrome-512x512.png" />
<meta property="og:description" content="Your favourite messenger for your favourite device. iMessage anywhere." />
<meta property="og:url" content="https://jmessage.app/setup" />
<link rel="apple-touch-icon" sizes="180x180" href="public/img/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="public/img/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="public/img/icons/favicon-16x16.png">
<link rel="manifest" href="public/img/icons/site.webmanifest">
<link rel="mask-icon" href="public/img/icons/safari-pinned-tab.svg" color="#0076ff">
<link rel="shortcut icon" href="public/img/icons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="jMessage">
<meta name="application-name" content="jMessage">
<meta name="msapplication-TileColor" content="#0076ff">
<meta name="msapplication-config" content="public/img/icons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Raleway:200,100,400" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="public/css/font-awesome-animation.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" id="bootstrap-css">
<script>
function getCookie(cname) {
var name = cname + '=';
var ca = document.cookie.split(';');
for(var i = 0; i < ca.length; i++) {
var c = ca[i];
while(c.charAt(0) === ' ') {
c = c.substring(1);
}
if(c.indexOf(name) === 0) {
return c.substring(name.length, c.length);
}
}
return undefined;
}
var cook = getCookie('color');
if(cook) {
document.documentElement.style.setProperty('--primaryColor', cook);
}
</script>
</head>
<body>
<div class="first">
<div class="info text">
<h1 class="header"><a class="white" href="#server-setup">Server Setup</a></h1>
<h2 class="subheader"><a class="white" href="#server-requirements">Requirements</a></h2>
<h2 class="subheader"><a class="white" href="#server-installing">Installing jMessage</a></h2>
<h2 class="subheader"><a class="white" href="#server-configuring">Configuring</a></h2>
<h2 class="subheader"><a class="white" href="#server-portforwarding">Portforwarding</a></h2>
<h1 class="header"><a class="white" href="#web-setup">jMessage Web Setup</a></h1>
<h2 class="subheader"><a class="white" href="#nodejs">Installing Node.js</a></h2>
<h1 class="header"><a class="white" href="#login">Logging into jMessage</a></h1>
<h2 class="subheader"><a class="white" href="#login-phone">on your Phone</a></h2>
<h2 class="subheader"><a class="white" href="#login-web">on your Computer</a></h2>
<h2 class="subheader"><a class="white" href="#login-watch">on your Watch</a></h2>
<!-- Control + Click to open. Enter your external URL (setup port forwarding instructions) and a password. Generate a key. Save settings. Restart -->
<!-- Option: Install NodeJS https://nodejs.org/en/download/ for hosting your own jMessage web, otherwise use https://web.jmessage.app -->
<!-- On your Android, enter the login information or scan the QR -->
<!-- Keep the server running in perpituity -->
</div>
</div>
<svg class="android-one" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 467.97 553"><defs><style>.cls-1{fill:#fff;}</style></defs><path class="cls-1" d="M205.52,268.87c-.1,1.5-.26,2.8-.26,4.09,0,72.14.13,144.28-.09,216.42-.06,20.85,17.63,38.32,37.46,36.95,7.74-.53,15.54-.08,23.71-.08,0,2.46,0,4.26,0,6.07.09,22.49.28,45,.25,67.48,0,14.65,6,25.71,19,32.66,3,1.62,6.46,2.44,9.7,3.62h11c4.92-2.26,10.26-3.89,14.67-6.9,10.17-6.93,14-17.26,14-29.32-.07-22.29,0-44.59,0-66.89v-6.33h45.74v67.75c0,24.72,5.81,33.17,28.64,41.69h11C443,628,449.2,619.16,449.2,594.58V526.25c7.7,0,14.82,0,21.94,0,24.49-.06,39.13-14.71,39.14-39.21q0-106.21,0-212.42v-5.74ZM448.85,398.23c-.25,1.86-.69,3.69-1.1,5.52-.43,1.58-.78,3.2-1.31,4.76s-1.18,2.92-1.7,4.41c-.92,2-1.6,4.09-2.71,6-1.39,1.93-2.29,4.16-3.72,6.06q-1.65,2.4-3.35,4.76a23.3,23.3,0,0,0-2.24,2.8c-1.49,1.76-3.22,3.29-4.8,5-1.32,1.27-2.6,2.57-3.88,3.87-2.38,1.73-4.34,4.07-7.27,5l-11.48,6.93-12.87,5.44a147.22,147.22,0,0,1-20.13,4.55,112.61,112.61,0,0,1-28.71,0c-5.91-.76-11.77-.87-17.44,1.38a11,11,0,0,0-4.52,2,15.39,15.39,0,0,0-4.14,2.1l-7.11,3.34-8.08,2.15-2.54.16-1.75-.22,4.11-4.64c1.52-.71,1.81-2.5,3-3.49a14.75,14.75,0,0,0,3.79-5.74c1.37-1.86,1.37-4,1.2-6.15s-2.44-2.21-3.88-3.05l-8.46-5.47c-2.64-.72-4.24-2.92-6.36-4.38q-1.91-2-3.87-3.87c-1.57-1.68-3.33-3.18-4.81-5a25.11,25.11,0,0,0-2.23-2.8c-1.13-1.58-2.28-3.14-3.35-4.76a42.23,42.23,0,0,1-3.21-5.52c-.9-2-2-3.87-2.85-5.91-.72-1.84-1.44-3.68-2-5.57-.34-1.62-1-3.15-1.29-4.77s-.71-3.39-1-5.09c-.11-2.45-.82-4.84-.66-7.32,0-1.56,0-3.12,0-4.67a12.23,12.23,0,0,1,.21-2.77c.76-2.27-.11-4.77,1-7,.64-1.55.73-3.24,1.22-4.83a16.91,16.91,0,0,1,1-3.48c.94-1.7,1.48-3.57,2.28-5.34,1-1.79,1.86-3.62,2.73-5.46s1.68-4,3.16-5.62c1.77-1.77,2.93-4,4.51-5.89a29.13,29.13,0,0,0,4-4.48c.24-.41.54-1,1.2-.58,2.39-1.37,4-3.56,5.93-5.45,2.39-.91,3.59-3.39,5.91-4.4a11.69,11.69,0,0,1,7.56-4.82c3.8-1.33,7.11-3.69,10.81-5.24l11.86-3.9,13.49-2.73,4.88-.56c1.25-.46,2.63.18,3.87-.4h13.18c1.09.51,2.29,0,3.39.39,1.65,0,3.2.89,4.89.56l13.48,2.72L399,321.13l10.22,5,7.56,4.82c2,1.47,3.94,2.93,5.9,4.41l5.9,5.42c2.36,1.06,3.42,3.49,5.27,5.09,1.38,2,3,3.92,4.35,6,1.13,1.8,2.22,3.62,3.29,5.44.86,1.84,1.85,3.61,2.7,5.46.49,1.46,1.16,2.86,1.65,4.32.36,1.14.75,2.26,1.12,3.4.56,2.13,1,4.29,1.63,6.42.26,1.43.31,2.89.66,4.31a11.36,11.36,0,0,1,.14,2.33c0,3.22,0,6.43,0,9.65A19,19,0,0,1,448.85,398.23Z" transform="translate(-123.24 -83.08)"/><path class="cls-1" d="M454.14,83.08c3.77,2.34,3.74,5.25,1.73,8.89-7.62,13.8-15.09,27.69-22.62,41.57,47.91,27.12,75.79,66.54,78.21,122.76H204c-.33-26.45,7.25-50.28,21.5-72.09s33.34-38.3,56.68-50.4c-7.69-14.16-15.15-28-22.79-41.84-2-3.67-2-6.54,1.73-8.89h3a45.77,45.77,0,0,1,4.17,5.45c7.5,13.49,14.89,27.05,22.48,40.89,44.6-18.63,89.09-18.29,133.7,0,7.58-13.82,15-27.38,22.48-40.87a45.94,45.94,0,0,1,4.17-5.46ZM440.24,188.29c.07-7-5.69-13.26-12.19-13.17A13.06,13.06,0,0,0,414.94,188,12.85,12.85,0,0,0,427.78,201C434.78,201.09,440.17,195.57,440.24,188.29ZM275,187.75c-.16,7.41,5.31,13.24,12.49,13.3a12.63,12.63,0,0,0,12.81-12.51c.18-6.9-5.46-13.18-12-13.4A12.83,12.83,0,0,0,275,187.75Z" transform="translate(-123.24 -83.08)"/><path class="cls-1" d="M123.3,367.5c0-23.49-.17-47,0-70.47.2-22.38,17.54-37.19,39.61-34.22,16.27,2.19,28.27,16.31,28.46,34,.2,18.66.05,37.32.05,56,0,28.32.08,56.64,0,85-.07,18-10.54,31.27-27,34.74-20.42,4.3-40.24-10.25-40.81-31.06-.67-24.64-.16-49.3-.16-74Z" transform="translate(-123.24 -83.08)"/><path class="cls-1" d="M591.13,367.55c0,23.65.21,47.31-.06,71S570.64,477.69,548,472.06c-15.05-3.75-25-17.53-25-34.92q-.07-69.46,0-138.92a55,55,0,0,1,.57-7.46c2.27-16.41,17.2-28.89,34-28.46,17.94.46,32.81,13.54,33.24,30.8.62,24.8.16,49.63.16,74.45Z" transform="translate(-123.24 -83.08)"/></svg>
<svg class="android-two" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 467.97 553"><defs><style>.cls-1{fill:#fff;}</style></defs><path class="cls-1" d="M205.52,268.87c-.1,1.5-.26,2.8-.26,4.09,0,72.14.13,144.28-.09,216.42-.06,20.85,17.63,38.32,37.46,36.95,7.74-.53,15.54-.08,23.71-.08,0,2.46,0,4.26,0,6.07.09,22.49.28,45,.25,67.48,0,14.65,6,25.71,19,32.66,3,1.62,6.46,2.44,9.7,3.62h11c4.92-2.26,10.26-3.89,14.67-6.9,10.17-6.93,14-17.26,14-29.32-.07-22.29,0-44.59,0-66.89v-6.33h45.74v67.75c0,24.72,5.81,33.17,28.64,41.69h11C443,628,449.2,619.16,449.2,594.58V526.25c7.7,0,14.82,0,21.94,0,24.49-.06,39.13-14.71,39.14-39.21q0-106.21,0-212.42v-5.74ZM448.85,398.23c-.25,1.86-.69,3.69-1.1,5.52-.43,1.58-.78,3.2-1.31,4.76s-1.18,2.92-1.7,4.41c-.92,2-1.6,4.09-2.71,6-1.39,1.93-2.29,4.16-3.72,6.06q-1.65,2.4-3.35,4.76a23.3,23.3,0,0,0-2.24,2.8c-1.49,1.76-3.22,3.29-4.8,5-1.32,1.27-2.6,2.57-3.88,3.87-2.38,1.73-4.34,4.07-7.27,5l-11.48,6.93-12.87,5.44a147.22,147.22,0,0,1-20.13,4.55,112.61,112.61,0,0,1-28.71,0c-5.91-.76-11.77-.87-17.44,1.38a11,11,0,0,0-4.52,2,15.39,15.39,0,0,0-4.14,2.1l-7.11,3.34-8.08,2.15-2.54.16-1.75-.22,4.11-4.64c1.52-.71,1.81-2.5,3-3.49a14.75,14.75,0,0,0,3.79-5.74c1.37-1.86,1.37-4,1.2-6.15s-2.44-2.21-3.88-3.05l-8.46-5.47c-2.64-.72-4.24-2.92-6.36-4.38q-1.91-2-3.87-3.87c-1.57-1.68-3.33-3.18-4.81-5a25.11,25.11,0,0,0-2.23-2.8c-1.13-1.58-2.28-3.14-3.35-4.76a42.23,42.23,0,0,1-3.21-5.52c-.9-2-2-3.87-2.85-5.91-.72-1.84-1.44-3.68-2-5.57-.34-1.62-1-3.15-1.29-4.77s-.71-3.39-1-5.09c-.11-2.45-.82-4.84-.66-7.32,0-1.56,0-3.12,0-4.67a12.23,12.23,0,0,1,.21-2.77c.76-2.27-.11-4.77,1-7,.64-1.55.73-3.24,1.22-4.83a16.91,16.91,0,0,1,1-3.48c.94-1.7,1.48-3.57,2.28-5.34,1-1.79,1.86-3.62,2.73-5.46s1.68-4,3.16-5.62c1.77-1.77,2.93-4,4.51-5.89a29.13,29.13,0,0,0,4-4.48c.24-.41.54-1,1.2-.58,2.39-1.37,4-3.56,5.93-5.45,2.39-.91,3.59-3.39,5.91-4.4a11.69,11.69,0,0,1,7.56-4.82c3.8-1.33,7.11-3.69,10.81-5.24l11.86-3.9,13.49-2.73,4.88-.56c1.25-.46,2.63.18,3.87-.4h13.18c1.09.51,2.29,0,3.39.39,1.65,0,3.2.89,4.89.56l13.48,2.72L399,321.13l10.22,5,7.56,4.82c2,1.47,3.94,2.93,5.9,4.41l5.9,5.42c2.36,1.06,3.42,3.49,5.27,5.09,1.38,2,3,3.92,4.35,6,1.13,1.8,2.22,3.62,3.29,5.44.86,1.84,1.85,3.61,2.7,5.46.49,1.46,1.16,2.86,1.65,4.32.36,1.14.75,2.26,1.12,3.4.56,2.13,1,4.29,1.63,6.42.26,1.43.31,2.89.66,4.31a11.36,11.36,0,0,1,.14,2.33c0,3.22,0,6.43,0,9.65A19,19,0,0,1,448.85,398.23Z" transform="translate(-123.24 -83.08)"/><path class="cls-1" d="M454.14,83.08c3.77,2.34,3.74,5.25,1.73,8.89-7.62,13.8-15.09,27.69-22.62,41.57,47.91,27.12,75.79,66.54,78.21,122.76H204c-.33-26.45,7.25-50.28,21.5-72.09s33.34-38.3,56.68-50.4c-7.69-14.16-15.15-28-22.79-41.84-2-3.67-2-6.54,1.73-8.89h3a45.77,45.77,0,0,1,4.17,5.45c7.5,13.49,14.89,27.05,22.48,40.89,44.6-18.63,89.09-18.29,133.7,0,7.58-13.82,15-27.38,22.48-40.87a45.94,45.94,0,0,1,4.17-5.46ZM440.24,188.29c.07-7-5.69-13.26-12.19-13.17A13.06,13.06,0,0,0,414.94,188,12.85,12.85,0,0,0,427.78,201C434.78,201.09,440.17,195.57,440.24,188.29ZM275,187.75c-.16,7.41,5.31,13.24,12.49,13.3a12.63,12.63,0,0,0,12.81-12.51c.18-6.9-5.46-13.18-12-13.4A12.83,12.83,0,0,0,275,187.75Z" transform="translate(-123.24 -83.08)"/><path class="cls-1" d="M123.3,367.5c0-23.49-.17-47,0-70.47.2-22.38,17.54-37.19,39.61-34.22,16.27,2.19,28.27,16.31,28.46,34,.2,18.66.05,37.32.05,56,0,28.32.08,56.64,0,85-.07,18-10.54,31.27-27,34.74-20.42,4.3-40.24-10.25-40.81-31.06-.67-24.64-.16-49.3-.16-74Z" transform="translate(-123.24 -83.08)"/><path class="cls-1" d="M591.13,367.55c0,23.65.21,47.31-.06,71S570.64,477.69,548,472.06c-15.05-3.75-25-17.53-25-34.92q-.07-69.46,0-138.92a55,55,0,0,1,.57-7.46c2.27-16.41,17.2-28.89,34-28.46,17.94.46,32.81,13.54,33.24,30.8.62,24.8.16,49.63.16,74.45Z" transform="translate(-123.24 -83.08)"/></svg>
<div id="server-setup" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Server Setup</h1>
</div>
</div>
</div>
<div id="server-requirements" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Requirements</h1>
</div>
</div>
<div class="row">
<p>jMessage works by relaying your iMessages from your Mac to your phone (and vice-versa). As such, your server must be setup on a Mac logged into your iMessage account with access to the internet. Ideally, your server computer will be always on so that you can always access your iMessages.</p>
</div>
</div>
<div id="server-installing" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Server Installation</h1>
</div>
</div>
<div class="row">
<p>jMessage does not exploit any flaws in Macs or iMessage, yet it is unlikely that Apple will allow it to be listed on the Mac App Store. As such, your Mac will flag the server application as "untrusted". In order to open it, you must hold down the control key on your keyboard while you click the application. This will allow you to open it, launching the jMessage server.</p>
</div>
</div>
<div id="server-configuring" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Server Configuration</h1>
</div>
</div>
<div class="row">
<p>The jMessage server hosts three configuration options: the external address, the password and the secure key.</p>
<p>The external address is either an IP address or a webpage that will point to this local machine. If you leave it blank, your computer's internal IP address will be used and you will only be able to access jMessage from the same wireless network. In order to access jMessage from elsewhere, see <a href="#server-portforwarding">portforwarding</a>.</p>
<p>The password is the first layer of security in jMessage. All clients trying to connect will have to provide this password.</p>
<p>The secure key is the second layer of security. It is a 32 character cryptographic key which will encrypt all communication between the server and the clients. jMessage uses military-grade cryptography to ensure your information is safe.</p>
</div>
</div>
<div id="server-portforwarding" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Portforwarding</h1>
</div>
</div>
<div class="row">
<p>Portforwarding allows you to access jMessage from anywhere in the world. Unfortunately, this is also the most challenging setup step in jMessage as it depends on your router. You can find instructions on how to portforward on your specific router <a href="https://portforward.com/router.htm">here</a>.</p>
<p>jMessage uses ports 8735 and 8736. If you choose to host <a href="#web-setup">jMessage Web</a>, it also uses port 8737. Please portforward these ports.</p>
</div>
</div>
<div id="web-setup" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Web Setup</h1>
</div>
</div>
<div class="row">
<p>This step is optional. jMessage Web is the online access point to jMessage so that you can access your iMessages from your browser. If you skip this step, you can still login to jMessage Web and use it on <a href="https://jmessage.app">https://www.jmessage.app</a>, but you may also choose to host jMessage Web on your own machine. This way, you do not depend on my server being online and can use your own URL to login to jMessage Web.</p>
<p>jMessage Web comes packaged inside of the jMessage server. However, it requires Node.js to run and port 8737 to be forwarded.</p>
</div>
</div>
<div id="nodejs" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Node.js</h1>
</div>
</div>
<div class="row">
<p>Download Node.js <a href="https://nodejs.org/en/download/">here</a> on the same computer that your jMessage server is running on. As long as port 8737 on your server computer is open and Node.js is installed, jMessage Web will start as soon as your jMessage server is started. You can test this by going to <a href="http://127.0.0.1:8737">127.0.0.1:8737</a> on your server computer. If you see <a href="https://jmessage.app">this page</a>, jMessage Web was successfully started on your machine. Make sure you <a href="#server-portforwarding">portforward</a> port 8737 so that you can access this page from outside of your local network.</p>
</div>
</div>
<div id="login" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Logging In</h1>
</div>
</div>
</div>
<div id="login-phone" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Android Login</h1>
</div>
</div>
<div class="row">
<p>When you first open jMessage on your Android phone, you'll be prompted to login. Enter the fields as you did in the <a href="#server-configuring">server</a> or scan the QR code you see on the server interface and you will be logged in.</p>
</div>
</div>
<div id="login-web" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Web Login</h1>
</div>
</div>
<div class="row">
<p>To login to jMessage Web, start by navigating to <a href="https://jmessage.app">https://www.jmessage.app</a> or to your own address if you chose to setup your own instance of <a href="#web-setup">jMessage Web</a>. Click the Web Connect button to open the login page (or the Start jMessaging button if you're on anything but an Android phone or Mac). Follow the instructions there and you'll be logged on in no time.</p>
<p>If you choose to stay logged in on your device, you can simply navigate to <a href="https://web.jmessage.app">web.jmessage.app</a> or <a href="https://jmessage.app/login">https://www.jmessage.app/login</a> (or the equivalent for your own jMessage Web instance) and you'll be logged in immediately.</p>
</div>
</div>
<div id="login-watch" class="container-fluid">
<div class="row">
<div class="col centered">
<h1>Watch Login</h1>
</div>
</div>
<div class="row">
<p>jMessage has a Samsung Gear companion app. With jMessage downloaded on your phone and watch (and the two paired via Bluetooth), simply open jMessage on your watch to login.</p>
</div>
</div>
</body>
</html>