Menu
Forums
All threads
Latest threads
New posts
Trending threads
New posts
Search forums
Trending
What's new
New posts
New profile posts
Latest activity
Members
Current visitors
New profile posts
Search profile posts
Upgrades
Log in
Register
What's new
Search
Search
Search titles only
By:
All threads
Latest threads
New posts
Trending threads
New posts
Search forums
Menu
Log in
Register
Navigation
Install the app
Install
More options
Contact us
Close Menu
Forums
Server Development
Habbo Retros
Habbo Tutorials
How to setup nitro imager for your CMS (IIS)
JavaScript is disabled. For a better experience, please enable JavaScript in your browser before proceeding.
You are using an out of date browser. It may not display this or other websites correctly.
You should upgrade or use an
alternative browser
.
Reply to thread
Message
<blockquote data-quote="Object" data-source="post: 472024" data-attributes="member: 78351"><p>Hey Devbest <img class="smilie smilie--emoji" loading="lazy" alt="👋" title="Waving hand :wave:" src="https://cdn.jsdelivr.net/joypixels/assets/6.6/png/unicode/64/1f44b.png" data-shortname=":wave:" /></p><p> </p><p>As I promised in part 3 of my how-to setup a retro series, I'll guide you through how to set up the Nitro imager for your CMS, so that you can load custom clothing - Yes no more half-naked avatars<img class="smilie smilie--emoji" loading="lazy" alt="🙈" title="See-no-evil monkey :see_no_evil:" src="https://cdn.jsdelivr.net/joypixels/assets/6.6/png/unicode/64/1f648.png" data-shortname=":see_no_evil:" /></p><p></p><p><strong>Requirements:</strong></p><p>Git - <a href="https://git-scm.com/downloads" target="_blank">https://git-scm.com/downloads</a></p><p>A working site / CMS (IIS must already have been set up and have a CMS must be up and running)</p><p></p><p><strong>Create a subdomain:</strong></p><p>[SPOILER="How to create a subdomain"]</p><p>To create a subdomain, head to the your Cloudflare dashboard and go to the "DNS" tab</p><p></p><p>[SPOILER="DNS tab"]</p><p>[ATTACH=full]13623[/ATTACH]</p><p>[/SPOILER]</p><p></p><p>Once you're within the DNS panel, add a new <strong>"A" </strong>record with the name "imager" and target should be your VPS Ip-address. Once filled in simply click "Save"</p><p></p><p> I've attached a screenshow below, in-case you're unsure to what I mean.</p><p></p><p>[SPOILER="DNS Record"]</p><p>[ATTACH=full]13625[/ATTACH]</p><p>[/SPOILER]</p><p></p><p>Our subdomain is now ready to be used<img class="smilie smilie--emoji" loading="lazy" alt="🎉" title="Party popper :tada:" src="https://cdn.jsdelivr.net/joypixels/assets/6.6/png/unicode/64/1f389.png" data-shortname=":tada:" /></p><p>[/SPOILER]</p><p></p><p><strong>Clone the nitro imager:</strong></p><p>[SPOILER="Clone the imager"]</p><p>The first step on our road, to set up the nitro imager will be to clone the git repository, and to do that simply open your Command Prompt and navigate yourself into the desktop path, which for the most part is something like the code below.</p><p>[CODE]cd C:\Users\YOUR-VPS-USERNAME\Desktop[/CODE]</p><p></p><p>Once you have navigated yourself into the desktop path on your VPS write the following command:</p><p>[CODE]git clone https://github.com/billsonnn/nitro-imager.git[/CODE]</p><p></p><p>When the imager have been cloned, your terminal should look something like the screenshot below:</p><p>[SPOILER="cmd image"]</p><p>[ATTACH=full]12986[/ATTACH]</p><p>[/SPOILER]</p><p>[/SPOILER]</p><p></p><p><strong>Set up & build the Nitro imager</strong></p><p>[SPOILER="Setup & build the imager"]</p><p>Once the repository has been cloned and is on your desktop, open the folder as your normally would by double-clicking it, once the nitro-imager folder has been opened, open the "config.json" in your preferred editor.</p><p></p><p>If you have been following my how-to set up a retro series and your folder structure is the same as from the series, you may just copy and paste the config below - If not, you can still use the config below, you'll just have to adapt the paths to match the paths that you're using.</p><p>[SPOILER="Nitro imager config"]</p><p>[CODE=json]</p><p>{</p><p> "api.host": "localhost",</p><p> "api.port": 3030,</p><p> "asset.url": "C:/inetpub/wwwroot/atomcms/public/client/nitro",</p><p> "gamedata.url": "${asset.url}/gamedata",</p><p> "avatar.save.path": "C:/inetpub/wwwroot/atomcms/public/client/saved-figures",</p><p> "avatar.actions.url": "${gamedata.url}/HabboAvatarActions.json",</p><p> "avatar.figuredata.url": "${gamedata.url}/FigureData.json",</p><p> "avatar.figuremap.url": "${gamedata.url}/FigureMap.json",</p><p> "avatar.effectmap.url": "${gamedata.url}/EffectMap.json",</p><p> "avatar.asset.url": "${asset.url}/bundled/figure/%libname%.nitro",</p><p> "avatar.asset.effect.url": "${asset.url}/bundled/effect/%libname%.nitro",</p><p> "avatar.mandatory.libraries": [</p><p> "bd:1",</p><p> "li:0"</p><p> ],</p><p> "avatar.mandatory.effect.libraries": [</p><p> "dance.1",</p><p> "dance.2",</p><p> "dance.3",</p><p> "dance.4"</p><p> ],</p><p> "avatar.default.figuredata": {"palettes":[{"id":1,"colors":[{"id":99999,"index":1001,"club":0,"selectable":false,"hexCode":"DDDDDD"},{"id":99998,"index":1001,"club":0,"selectable":false,"hexCode":"FAFAFA"}]},{"id":3,"colors":[{"id":10001,"index":1001,"club":0,"selectable":false,"hexCode":"EEEEEE"},{"id":10002,"index":1002,"club":0,"selectable":false,"hexCode":"FA3831"},{"id":10003,"index":1003,"club":0,"selectable":false,"hexCode":"FD92A0"},{"id":10004,"index":1004,"club":0,"selectable":false,"hexCode":"2AC7D2"},{"id":10005,"index":1005,"club":0,"selectable":false,"hexCode":"35332C"},{"id":10006,"index":1006,"club":0,"selectable":false,"hexCode":"EFFF92"},{"id":10007,"index":1007,"club":0,"selectable":false,"hexCode":"C6FF98"},{"id":10008,"index":1008,"club":0,"selectable":false,"hexCode":"FF925A"},{"id":10009,"index":1009,"club":0,"selectable":false,"hexCode":"9D597E"},{"id":10010,"index":1010,"club":0,"selectable":false,"hexCode":"B6F3FF"},{"id":10011,"index":1011,"club":0,"selectable":false,"hexCode":"6DFF33"},{"id":10012,"index":1012,"club":0,"selectable":false,"hexCode":"3378C9"},{"id":10013,"index":1013,"club":0,"selectable":false,"hexCode":"FFB631"},{"id":10014,"index":1014,"club":0,"selectable":false,"hexCode":"DFA1E9"},{"id":10015,"index":1015,"club":0,"selectable":false,"hexCode":"F9FB32"},{"id":10016,"index":1016,"club":0,"selectable":false,"hexCode":"CAAF8F"},{"id":10017,"index":1017,"club":0,"selectable":false,"hexCode":"C5C6C5"},{"id":10018,"index":1018,"club":0,"selectable":false,"hexCode":"47623D"},{"id":10019,"index":1019,"club":0,"selectable":false,"hexCode":"8A8361"},{"id":10020,"index":1020,"club":0,"selectable":false,"hexCode":"FF8C33"},{"id":10021,"index":1021,"club":0,"selectable":false,"hexCode":"54C627"},{"id":10022,"index":1022,"club":0,"selectable":false,"hexCode":"1E6C99"},{"id":10023,"index":1023,"club":0,"selectable":false,"hexCode":"984F88"},{"id":10024,"index":1024,"club":0,"selectable":false,"hexCode":"77C8FF"},{"id":10025,"index":1025,"club":0,"selectable":false,"hexCode":"FFC08E"},{"id":10026,"index":1026,"club":0,"selectable":false,"hexCode":"3C4B87"},{"id":10027,"index":1027,"club":0,"selectable":false,"hexCode":"7C2C47"},{"id":10028,"index":1028,"club":0,"selectable":false,"hexCode":"D7FFE3"},{"id":10029,"index":1029,"club":0,"selectable":false,"hexCode":"8F3F1C"},{"id":10030,"index":1030,"club":0,"selectable":false,"hexCode":"FF6393"},{"id":10031,"index":1031,"club":0,"selectable":false,"hexCode":"1F9B79"},{"id":10032,"index":1032,"club":0,"selectable":false,"hexCode":"FDFF33"}]}],"setTypes":[{"type":"hd","paletteId":1,"mandatory_f_0":true,"mandatory_f_1":true,"mandatory_m_0":true,"mandatory_m_1":true,"sets":[{"id":99999,"gender":"U","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":1,"type":"bd","colorable":true,"index":0,"colorindex":1},{"id":1,"type":"hd","colorable":true,"index":0,"colorindex":1},{"id":1,"type":"lh","colorable":true,"index":0,"colorindex":1},{"id":1,"type":"rh","colorable":true,"index":0,"colorindex":1}]}]},{"type":"bds","paletteId":1,"mandatory_f_0":false,"mandatory_f_1":false,"mandatory_m_0":false,"mandatory_m_1":false,"sets":[{"id":10001,"gender":"U","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":10001,"type":"bds","colorable":true,"index":0,"colorindex":1},{"id":10001,"type":"lhs","colorable":true,"index":0,"colorindex":1},{"id":10001,"type":"rhs","colorable":true,"index":0,"colorindex":1}],"hiddenLayers":[{"partType":"bd"},{"partType":"rh"},{"partType":"lh"}]}]},{"type":"ss","paletteId":3,"mandatory_f_0":false,"mandatory_f_1":false,"mandatory_m_0":false,"mandatory_m_1":false,"sets":[{"id":10010,"gender":"F","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":10001,"type":"ss","colorable":true,"index":0,"colorindex":1}],"hiddenLayers":[{"partType":"ch"},{"partType":"lg"},{"partType":"ca"},{"partType":"wa"},{"partType":"sh"},{"partType":"ls"},{"partType":"rs"},{"partType":"lc"},{"partType":"rc"},{"partType":"cc"},{"partType":"cp"}]},{"id":10011,"gender":"M","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":10002,"type":"ss","colorable":true,"index":0,"colorindex":1}],"hiddenLayers":[{"partType":"ch"},{"partType":"lg"},{"partType":"ca"},{"partType":"wa"},{"partType":"sh"},{"partType":"ls"},{"partType":"rs"},{"partType":"lc"},{"partType":"rc"},{"partType":"cc"},{"partType":"cp"}]}]}]},</p><p> "avatar.default.actions": {</p><p> "actions": [</p><p> {</p><p> "id": "Default",</p><p> "state": "std",</p><p> "precedence": 1000,</p><p> "main": true,</p><p> "isDefault": true,</p><p> "geometryType": "vertical",</p><p> "activePartSet": "figure",</p><p> "assetPartDefinition": "std"</p><p> }</p><p> ]</p><p> }</p><p>}</p><p>[/CODE]</p><p>[/SPOILER]</p><p></p><p>Now when you have edited your config to match your paths, open your cmd and enter the following command:</p><p>[CODE]cd C:\Users\YOUR-VPS-USERNAME\Desktop\nitro-imager[/CODE]</p><p></p><p>Once you're within the nitro-imager folder, we'll have to pin the correct node version to the imager and to do that simply enter:</p><p>[CODE]</p><p>volta install node@16.16.0</p><p>volta pin node@16.16.0</p><p>[/CODE]</p><p></p><p><strong>Volta not installed?</strong></p><p>[SPOILER="Install Volta"]</p><p>In-case volta isn't installed on your server, head to the <a href="https://docs.volta.sh/guide/getting-started" target="_blank">Volta getting started page</a> and click on the <a href="https://github.com/volta-cli/volta/releases/download/v1.0.8/volta-1.0.8-windows-x86_64.msi" target="_blank">Download and run the windows installer</a> - go through the setup steps and restart your command prompt. Once your command prompt has been restarted, repeat the steps above.</p><p>[/SPOILER]</p><p></p><p>Next up, write the following:</p><p>[CODE]</p><p>npm i</p><p>[/CODE]</p><p>then</p><p>[CODE]</p><p>npm run build</p><p>[/CODE]</p><p>And the very last command to run</p><p>[CODE]</p><p>npm start</p><p>[/CODE]</p><p></p><p>Once your imager has been started, it should look something like the image below:</p><p>[SPOILER="imager started image"]</p><p>[ATTACH=full]13626[/ATTACH]</p><p>[/SPOILER]</p><p>[/SPOILER]</p><p></p><p><strong>Setup the reverse proxy:</strong></p><p>[SPOILER="Setup the reverse proxy"]</p><p>It's time to set up the reverse proxy, to allow the imager to be rendered through our domain.</p><p></p><p>The first thing we will have to do, to achieve this is downloading the "Application Request Routing" extension for IIS - <a href="https://www.iis.net/downloads/microsoft/application-request-routing" target="_blank">You can download the extension, by clicking here.</a></p><p></p><p>Once the extension has been downloaded, go through the setup process and re-open your "Internet Information Services" application - you should then be able to see the "Application Request Routing Cache" module if you double click on the "VMIxxxx" - it should look like the image below:</p><p>[SPOILER="App request routing image"]</p><p>[ATTACH=full]12988[/ATTACH]</p><p>[/SPOILER]</p><p></p><p>Once you're able to see your "Application Request Routing Cache" module, double click it and at the right side, you should see "Server Proxy Settings..." Click on that and then tick the "Enable proxy"</p><p></p><p>[SPOILER="Proxy enabled image"]</p><p>[ATTACH=full]12989[/ATTACH]</p><p>[/SPOILER]</p><p></p><p>Once ticked, click "Apply" on the right side.</p><p>[/SPOILER]</p><p></p><p><strong>Create the imager IIS site</strong></p><p>[SPOILER="Create the IIS site"]</p><p>We must add a new site to IIS, that will be hosting our imager, luckily for that it only takes a few simply steps to get going!</p><p></p><p>First up expand the "sites" folder within your IIS application, right click it and press "Add website..." - A new popup should now appear.</p><p></p><p>For the site name & host name fill in imager.your-domain</p><p></p><p>Once filled in, click the 3 dots to select a folder the site will be connected to - Once clicked another popup will appear, browse yourself to your desktop and select the "nitro-imager" folder.</p><p></p><p>I've added a gif & screenshot below, incase you're unsure if you've done it all correctly</p><p>[SPOILER="GIF & Screenshot"]</p><p>A GIF of me doing it: <a href="https://gyazo.com/f9eae28c7a3cba4736dc8e8b29e4a361" target="_blank">https://gyazo.com/f9eae28c7a3cba4736dc8e8b29e4a361</a></p><p></p><p>[ATTACH=full]13627[/ATTACH]</p><p>[/SPOILER]</p><p>[/SPOILER]</p><p></p><p><strong>Create the URL Rewrite rule:</strong></p><p>[SPOILER="Create the URL Rewrite URL"]</p><p>The second last step on our journey is to create the URL Rewrite url, which will create the reverse proxy!</p><p></p><p>The first thing you have to do is to expand the "sites" folder inside the "Internet Information Services" application, then double click on your the site we just created "imager.your-domain".</p><p></p><p>Once you've doubled clicked your site, you should be able to see the "URL Rewrite" module - Double click it and then click "Add Rule(s)..." on the right and then select "Blank rule".</p><p></p><p>Once the "Blank rule" has been selected you'll have to fill out a few fields.</p><p></p><ol> <li data-xf-list-type="ol">The first field to fill is the "Name:" the name will be totally up to you, but I will be writing "imager" inside of the field</li> <li data-xf-list-type="ol">The second field to fill is the "Pattern:" field and inside of that write "(.*)"</li> <li data-xf-list-type="ol">The last thing you'll have to do for the reverse proxy to be done is, scroll down until you see the "Rewrite URL:" field, inside of this field write the following: "<a href="http://localhost:8080/" target="_blank">http://localhost:3030/</a>{R:1}" - Once everything is set click "Apply" in the top right corner</li> </ol><p></p><p><strong>How the reverse proxy rule should look:</strong></p><p>Once you have filled all the mentioned fields, your rule should look like the images below.</p><p>[SPOILER="Reverse proxy images"]</p><p>A GIF of me doing it: <a href="https://gyazo.com/fecf9b5b97562e979ff80b44d158fe42" target="_blank">https://gyazo.com/fecf9b5b97562e979ff80b44d158fe42</a></p><p></p><p>[ATTACH=full]13628[/ATTACH]</p><p>[/SPOILER]</p><p>[/SPOILER]</p><p></p><p><strong>Give full permissions to the nitro-imager folder:</strong></p><p>For the imager to function properly on our subdomain, we must give full permissions to it.</p><p></p><p>[SPOILER="Give full permission"]</p><p>The first step will be going to the desktop of your VPS, right-click on the "nitro-imager" folder, and select "Properties".</p><p></p><p>A new popup will now appear, click the "Security" tab then "Edit..." and then "Add..."</p><p></p><p>We must add 2 new user groups, the first one being "IIS_IUSRS" and the second being "IUSR".</p><p></p><p>Once the 2 groups have been added click check the "Full control" for both groups and then click "Apply".</p><p></p><p>Here's a GIF of me doing it: <a href="https://gyazo.com/7d5f38525a762c1b26bbd7552ca93478" target="_blank">https://gyazo.com/7d5f38525a762c1b26bbd7552ca93478</a></p><p>[/SPOILER]</p><p></p><p><strong>The last step:</strong></p><p>[SPOILER="Update your CMS imager URL"]</p><p>The very last step will be to tell your CMS what URL it should now be using for your avatar images.</p><p></p><p>If you're using Atom CMS this is very easy, all you have to do is open up your database, find the "website_settings" table, open it and find the "avatar_imager" and change its value to "<a href="https://imager.your-domain/?figure=" target="_blank">https://imager.your-domain/?figure=</a>"</p><p></p><p>Here's how mine looks:</p><p>[ATTACH=full]13629[/ATTACH]</p><p>[/SPOILER]</p><p></p><p>That's it! your nitro imager should now be set up and running<img class="smilie smilie--emoji" loading="lazy" alt="🥳" title="Partying face :partying_face:" src="https://cdn.jsdelivr.net/joypixels/assets/6.6/png/unicode/64/1f973.png" data-shortname=":partying_face:" /></p><p></p><p><strong>It's important to leave your imager running <em>always</em> if not your avatars won't render properly if at all.</strong></p></blockquote><p></p>
[QUOTE="Object, post: 472024, member: 78351"] Hey Devbest 👋 As I promised in part 3 of my how-to setup a retro series, I'll guide you through how to set up the Nitro imager for your CMS, so that you can load custom clothing - Yes no more half-naked avatars🙈 [B]Requirements:[/B] Git - [URL]https://git-scm.com/downloads[/URL] A working site / CMS (IIS must already have been set up and have a CMS must be up and running) [B]Create a subdomain:[/B] [SPOILER="How to create a subdomain"] To create a subdomain, head to the your Cloudflare dashboard and go to the "DNS" tab [SPOILER="DNS tab"] [ATTACH type="full" alt="1661096496716.png"]13623[/ATTACH] [/SPOILER] Once you're within the DNS panel, add a new [B]"A" [/B]record with the name "imager" and target should be your VPS Ip-address. Once filled in simply click "Save" I've attached a screenshow below, in-case you're unsure to what I mean. [SPOILER="DNS Record"] [ATTACH type="full" width="680px" alt="1661096665754.png"]13625[/ATTACH] [/SPOILER] Our subdomain is now ready to be used🎉 [/SPOILER] [B]Clone the nitro imager:[/B] [SPOILER="Clone the imager"] The first step on our road, to set up the nitro imager will be to clone the git repository, and to do that simply open your Command Prompt and navigate yourself into the desktop path, which for the most part is something like the code below. [CODE]cd C:\Users\YOUR-VPS-USERNAME\Desktop[/CODE] Once you have navigated yourself into the desktop path on your VPS write the following command: [CODE]git clone https://github.com/billsonnn/nitro-imager.git[/CODE] When the imager have been cloned, your terminal should look something like the screenshot below: [SPOILER="cmd image"] [ATTACH type="full" width="608px" alt="1639601576145.png"]12986[/ATTACH] [/SPOILER] [/SPOILER] [B]Set up & build the Nitro imager[/B] [SPOILER="Setup & build the imager"] Once the repository has been cloned and is on your desktop, open the folder as your normally would by double-clicking it, once the nitro-imager folder has been opened, open the "config.json" in your preferred editor. If you have been following my how-to set up a retro series and your folder structure is the same as from the series, you may just copy and paste the config below - If not, you can still use the config below, you'll just have to adapt the paths to match the paths that you're using. [SPOILER="Nitro imager config"] [CODE=json] { "api.host": "localhost", "api.port": 3030, "asset.url": "C:/inetpub/wwwroot/atomcms/public/client/nitro", "gamedata.url": "${asset.url}/gamedata", "avatar.save.path": "C:/inetpub/wwwroot/atomcms/public/client/saved-figures", "avatar.actions.url": "${gamedata.url}/HabboAvatarActions.json", "avatar.figuredata.url": "${gamedata.url}/FigureData.json", "avatar.figuremap.url": "${gamedata.url}/FigureMap.json", "avatar.effectmap.url": "${gamedata.url}/EffectMap.json", "avatar.asset.url": "${asset.url}/bundled/figure/%libname%.nitro", "avatar.asset.effect.url": "${asset.url}/bundled/effect/%libname%.nitro", "avatar.mandatory.libraries": [ "bd:1", "li:0" ], "avatar.mandatory.effect.libraries": [ "dance.1", "dance.2", "dance.3", "dance.4" ], "avatar.default.figuredata": {"palettes":[{"id":1,"colors":[{"id":99999,"index":1001,"club":0,"selectable":false,"hexCode":"DDDDDD"},{"id":99998,"index":1001,"club":0,"selectable":false,"hexCode":"FAFAFA"}]},{"id":3,"colors":[{"id":10001,"index":1001,"club":0,"selectable":false,"hexCode":"EEEEEE"},{"id":10002,"index":1002,"club":0,"selectable":false,"hexCode":"FA3831"},{"id":10003,"index":1003,"club":0,"selectable":false,"hexCode":"FD92A0"},{"id":10004,"index":1004,"club":0,"selectable":false,"hexCode":"2AC7D2"},{"id":10005,"index":1005,"club":0,"selectable":false,"hexCode":"35332C"},{"id":10006,"index":1006,"club":0,"selectable":false,"hexCode":"EFFF92"},{"id":10007,"index":1007,"club":0,"selectable":false,"hexCode":"C6FF98"},{"id":10008,"index":1008,"club":0,"selectable":false,"hexCode":"FF925A"},{"id":10009,"index":1009,"club":0,"selectable":false,"hexCode":"9D597E"},{"id":10010,"index":1010,"club":0,"selectable":false,"hexCode":"B6F3FF"},{"id":10011,"index":1011,"club":0,"selectable":false,"hexCode":"6DFF33"},{"id":10012,"index":1012,"club":0,"selectable":false,"hexCode":"3378C9"},{"id":10013,"index":1013,"club":0,"selectable":false,"hexCode":"FFB631"},{"id":10014,"index":1014,"club":0,"selectable":false,"hexCode":"DFA1E9"},{"id":10015,"index":1015,"club":0,"selectable":false,"hexCode":"F9FB32"},{"id":10016,"index":1016,"club":0,"selectable":false,"hexCode":"CAAF8F"},{"id":10017,"index":1017,"club":0,"selectable":false,"hexCode":"C5C6C5"},{"id":10018,"index":1018,"club":0,"selectable":false,"hexCode":"47623D"},{"id":10019,"index":1019,"club":0,"selectable":false,"hexCode":"8A8361"},{"id":10020,"index":1020,"club":0,"selectable":false,"hexCode":"FF8C33"},{"id":10021,"index":1021,"club":0,"selectable":false,"hexCode":"54C627"},{"id":10022,"index":1022,"club":0,"selectable":false,"hexCode":"1E6C99"},{"id":10023,"index":1023,"club":0,"selectable":false,"hexCode":"984F88"},{"id":10024,"index":1024,"club":0,"selectable":false,"hexCode":"77C8FF"},{"id":10025,"index":1025,"club":0,"selectable":false,"hexCode":"FFC08E"},{"id":10026,"index":1026,"club":0,"selectable":false,"hexCode":"3C4B87"},{"id":10027,"index":1027,"club":0,"selectable":false,"hexCode":"7C2C47"},{"id":10028,"index":1028,"club":0,"selectable":false,"hexCode":"D7FFE3"},{"id":10029,"index":1029,"club":0,"selectable":false,"hexCode":"8F3F1C"},{"id":10030,"index":1030,"club":0,"selectable":false,"hexCode":"FF6393"},{"id":10031,"index":1031,"club":0,"selectable":false,"hexCode":"1F9B79"},{"id":10032,"index":1032,"club":0,"selectable":false,"hexCode":"FDFF33"}]}],"setTypes":[{"type":"hd","paletteId":1,"mandatory_f_0":true,"mandatory_f_1":true,"mandatory_m_0":true,"mandatory_m_1":true,"sets":[{"id":99999,"gender":"U","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":1,"type":"bd","colorable":true,"index":0,"colorindex":1},{"id":1,"type":"hd","colorable":true,"index":0,"colorindex":1},{"id":1,"type":"lh","colorable":true,"index":0,"colorindex":1},{"id":1,"type":"rh","colorable":true,"index":0,"colorindex":1}]}]},{"type":"bds","paletteId":1,"mandatory_f_0":false,"mandatory_f_1":false,"mandatory_m_0":false,"mandatory_m_1":false,"sets":[{"id":10001,"gender":"U","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":10001,"type":"bds","colorable":true,"index":0,"colorindex":1},{"id":10001,"type":"lhs","colorable":true,"index":0,"colorindex":1},{"id":10001,"type":"rhs","colorable":true,"index":0,"colorindex":1}],"hiddenLayers":[{"partType":"bd"},{"partType":"rh"},{"partType":"lh"}]}]},{"type":"ss","paletteId":3,"mandatory_f_0":false,"mandatory_f_1":false,"mandatory_m_0":false,"mandatory_m_1":false,"sets":[{"id":10010,"gender":"F","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":10001,"type":"ss","colorable":true,"index":0,"colorindex":1}],"hiddenLayers":[{"partType":"ch"},{"partType":"lg"},{"partType":"ca"},{"partType":"wa"},{"partType":"sh"},{"partType":"ls"},{"partType":"rs"},{"partType":"lc"},{"partType":"rc"},{"partType":"cc"},{"partType":"cp"}]},{"id":10011,"gender":"M","club":0,"colorable":true,"selectable":false,"preselectable":false,"sellable":false,"parts":[{"id":10002,"type":"ss","colorable":true,"index":0,"colorindex":1}],"hiddenLayers":[{"partType":"ch"},{"partType":"lg"},{"partType":"ca"},{"partType":"wa"},{"partType":"sh"},{"partType":"ls"},{"partType":"rs"},{"partType":"lc"},{"partType":"rc"},{"partType":"cc"},{"partType":"cp"}]}]}]}, "avatar.default.actions": { "actions": [ { "id": "Default", "state": "std", "precedence": 1000, "main": true, "isDefault": true, "geometryType": "vertical", "activePartSet": "figure", "assetPartDefinition": "std" } ] } } [/CODE] [/SPOILER] Now when you have edited your config to match your paths, open your cmd and enter the following command: [CODE]cd C:\Users\YOUR-VPS-USERNAME\Desktop\nitro-imager[/CODE] Once you're within the nitro-imager folder, we'll have to pin the correct node version to the imager and to do that simply enter: [CODE] volta install node@16.16.0 volta pin node@16.16.0 [/CODE] [B]Volta not installed?[/B] [SPOILER="Install Volta"] In-case volta isn't installed on your server, head to the [URL='https://docs.volta.sh/guide/getting-started']Volta getting started page[/URL] and click on the [URL='https://github.com/volta-cli/volta/releases/download/v1.0.8/volta-1.0.8-windows-x86_64.msi']Download and run the windows installer[/URL] - go through the setup steps and restart your command prompt. Once your command prompt has been restarted, repeat the steps above. [/SPOILER] Next up, write the following: [CODE] npm i [/CODE] then [CODE] npm run build [/CODE] And the very last command to run [CODE] npm start [/CODE] Once your imager has been started, it should look something like the image below: [SPOILER="imager started image"] [ATTACH type="full" width="674px" alt="1661097503032.png"]13626[/ATTACH] [/SPOILER] [/SPOILER] [B]Setup the reverse proxy:[/B] [SPOILER="Setup the reverse proxy"] It's time to set up the reverse proxy, to allow the imager to be rendered through our domain. The first thing we will have to do, to achieve this is downloading the "Application Request Routing" extension for IIS - [URL='https://www.iis.net/downloads/microsoft/application-request-routing']You can download the extension, by clicking here.[/URL] Once the extension has been downloaded, go through the setup process and re-open your "Internet Information Services" application - you should then be able to see the "Application Request Routing Cache" module if you double click on the "VMIxxxx" - it should look like the image below: [SPOILER="App request routing image"] [ATTACH type="full" alt="1639603404598.png"]12988[/ATTACH] [/SPOILER] Once you're able to see your "Application Request Routing Cache" module, double click it and at the right side, you should see "Server Proxy Settings..." Click on that and then tick the "Enable proxy" [SPOILER="Proxy enabled image"] [ATTACH type="full" alt="1639603553198.png"]12989[/ATTACH] [/SPOILER] Once ticked, click "Apply" on the right side. [/SPOILER] [B]Create the imager IIS site[/B] [SPOILER="Create the IIS site"] We must add a new site to IIS, that will be hosting our imager, luckily for that it only takes a few simply steps to get going! First up expand the "sites" folder within your IIS application, right click it and press "Add website..." - A new popup should now appear. For the site name & host name fill in imager.your-domain Once filled in, click the 3 dots to select a folder the site will be connected to - Once clicked another popup will appear, browse yourself to your desktop and select the "nitro-imager" folder. I've added a gif & screenshot below, incase you're unsure if you've done it all correctly [SPOILER="GIF & Screenshot"] A GIF of me doing it: [URL]https://gyazo.com/f9eae28c7a3cba4736dc8e8b29e4a361[/URL] [ATTACH type="full" width="412px" alt="1661097861224.png"]13627[/ATTACH] [/SPOILER] [/SPOILER] [B]Create the URL Rewrite rule:[/B] [SPOILER="Create the URL Rewrite URL"] The second last step on our journey is to create the URL Rewrite url, which will create the reverse proxy! The first thing you have to do is to expand the "sites" folder inside the "Internet Information Services" application, then double click on your the site we just created "imager.your-domain". Once you've doubled clicked your site, you should be able to see the "URL Rewrite" module - Double click it and then click "Add Rule(s)..." on the right and then select "Blank rule". Once the "Blank rule" has been selected you'll have to fill out a few fields. [LIST=1] [*]The first field to fill is the "Name:" the name will be totally up to you, but I will be writing "imager" inside of the field [*]The second field to fill is the "Pattern:" field and inside of that write "(.*)" [*]The last thing you'll have to do for the reverse proxy to be done is, scroll down until you see the "Rewrite URL:" field, inside of this field write the following: "[URL='http://localhost:8080/']http://localhost:3030/[/URL]{R:1}" - Once everything is set click "Apply" in the top right corner [/LIST] [B]How the reverse proxy rule should look:[/B] Once you have filled all the mentioned fields, your rule should look like the images below. [SPOILER="Reverse proxy images"] A GIF of me doing it: [URL]https://gyazo.com/fecf9b5b97562e979ff80b44d158fe42[/URL] [ATTACH type="full" width="540px" alt="1661098315467.png"]13628[/ATTACH] [/SPOILER] [/SPOILER] [B]Give full permissions to the nitro-imager folder:[/B] For the imager to function properly on our subdomain, we must give full permissions to it. [SPOILER="Give full permission"] The first step will be going to the desktop of your VPS, right-click on the "nitro-imager" folder, and select "Properties". A new popup will now appear, click the "Security" tab then "Edit..." and then "Add..." We must add 2 new user groups, the first one being "IIS_IUSRS" and the second being "IUSR". Once the 2 groups have been added click check the "Full control" for both groups and then click "Apply". Here's a GIF of me doing it: [URL]https://gyazo.com/7d5f38525a762c1b26bbd7552ca93478[/URL] [/SPOILER] [B]The last step:[/B] [SPOILER="Update your CMS imager URL"] The very last step will be to tell your CMS what URL it should now be using for your avatar images. If you're using Atom CMS this is very easy, all you have to do is open up your database, find the "website_settings" table, open it and find the "avatar_imager" and change its value to "[URL]https://imager.your-domain/?figure=[/URL]" Here's how mine looks: [ATTACH type="full" alt="1661098826604.png"]13629[/ATTACH] [/SPOILER] That's it! your nitro imager should now be set up and running🥳 [B]It's important to leave your imager running [I]always[/I] if not your avatars won't render properly if at all.[/B] [/QUOTE]
Insert quotes…
Verification
Post reply
Forums
Server Development
Habbo Retros
Habbo Tutorials
How to setup nitro imager for your CMS (IIS)
Top