Installing Arc on your Website……..🌐
June 28, 2020
What is Arc?
Arc is a two-sided marketplace. On one side of the market, websites buy a fast, low-cost peer-to-peer CDN. On the other side, websites make money by contributing bandwidth to the peer-to-peer CDN. Arc’s widget provides access to both sides.They turn bandwidth into dollars by uniting browsers into a distributed content network.
Think of a screaming-fast BitTorrent for every website that’s seamless and native to the web. Websites pay Arc to make their sites faster by serving their static content (images, videos, JS, CSS….) from Arc’s global, distributed network of browsers instead of from slower, more expensive centralized servers. The integration usually takes around 5–10 minutes.
Website Integration
It’s a very useful tool which can speed up your website by loading your website from the closest server to the user. Improving the user experience especially if your website contains lots of images. This article will help you monetize your website without bothering the users with adverts. So, let’s begin this journey….
- Open the root directory of your web application.
We’ll integrating arc with our website for this article. Assuming you’ve configured your website properly, open the directory containing your website [/var/www]. We are using WinSCP to access the directory (Use the application you’re comfortable with).
2. Login to the Arc Dashboard
Create an account on Arc, and you’ll be greeted with a beautiful dashboard. You’ll be presented greeted with a page to add your site to arc’s CDN network.
If you’re already added your website, click on this button:
After adding submitting your website, you’ll be greeted with an installation page, make sure your site is secured with HTTPS otherwise it won’t work on your site. Depending on site, this blog is divided into parts: Manual & WordPress Installation.
Manual Installation
For the websites which use traditional methods for displaying their content, this section is meant for you. This section is further divided into 2 parts, depending on service workers. A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don’t need a web page or user interaction. Follow along and you’ll be done in a jiffy…
A. With Service Worker
- Click on “I already have a Service Worker and will integrate Arc”
2. Integrate it with your existing service worker by adding this piece of code to your service worker’s root JS file. [importScripts(‘https://arc.io/arc-sw-core.js')]
3. After you’re done add the filename of your service worker and once, you’re done save it.
4. And in case you’ve have any subdomains, arc will be automatically integrated with those.
5. Last, but not the least add the widget to every site you want to monetize and accelerate with arc, by adding this snippet of code to your website like so:
6. Once added, Arc’s widget will appear at the bottom right of your screen, also make sure you’ve added your PayPal mail address to the Earnings page.
7. These steps are meant for users who are using Cloudflare:
a. From your dashboard, create a firewall rule and give it a name, like “Allow arc.io”.
b. Select Referer from the “Field” drop down menu, equals from the “Operator” drop down menu, and enter arc.io in the “Value” input.
c. Select Allow from the “Choose an action” menu.
d. Deploy your new firewall rule.
e. The firewall expression preview should look like this: (http.referer eq “arc.io”)
f. Once you’re done following, click the Test on the portal to make sure everything is working properly.
Voila! You are done you have successfully added Arc to your site.
B. Without a Service Worker
- Copy https://arc.io/arc-sw.js to your server and copy it your website's root directory you can do so by running this command on your web server:
curl “https://arc.io/arc-sw.js" -o /path/to/your/root/directory/arc-sw.js
OR
setup a reverse proxy from https://your.domain/arc-sw.js to https://arc.io/arc-sw.js
You can setup reverse proxy using these applications
a. Ngnix
server {
location = /arc-sw.js {
proxy_pass https://arc.io;
proxy_ssl_server_name on;
}
}
b. Apache [Most Commonly Used]
ProxyPass “/arc-sw.js” “https://arc.io/arc-sw.js"
ProxyPassReverse “/arc-sw.js” https://arc.io/arc-sw.js
c. Netlify [Add this to netlify.toml]
[[redirects]]
from = “/arc-sw.js”
to = “https://arc.io/arc-sw.js"
status = 200
d. Vercel
{
“routes”: [
{
“src”: “/arc-sw.js”,
“dest”: “https://arc.io/arc-sw.js"
}
]
}
2. And in case you’ve have any subdomains, arc will be automatically integrated with those.
3. Last, but not the least add the widget to every site you want to monetize and accelerate with arc, by adding this snippet of code to your website like so:
4. Once added, Arc’s widget will appear at the bottom right of your screen, also make sure you’ve added your PayPal mail address to the Earnings page.
5. These steps are meant for users who are using Cloudflare:
g. From your dashboard, create a firewall rule and give it a name, like “Allow arc.io”.
h. Select Referer from the “Field” dropdown menu, equals from the “Operator” drop down menu, and enter arc.io in the “Value” input.
i. Select Allow from the “Choose an action” menu.
j. Deploy your new firewall rule.
k. The firewall expression preview should look like this: (http.referer eq “arc.io”)
l. Once you’re done following, click the Test on the portal to make sure everything is working properly.
Voila! You are done you have successfully added Arc to your site.
WordPress Installation:
1. Go to your WordPress Dashboard, install the plugin for Arc, and it will handle the rest, search for Arc and install ‘Arc-Monetize-Cache-Accelerate’
2. After installing it, enter the code provided to you by Arc, it should look like so:
3. And in case you’ve have any subdomains, arc will be automatically integrated with those.
4. Last, but not the least add the widget to every site you want to monetize and accelerate with arc, by adding this snippet of code to your website like so:
5. Once added, Arc’s widget will appear at the bottom right of your screen, also make sure you’ve added your PayPal mail address to the Earnings page.
6. These steps are meant for users who are using Cloudflare:
a. From your dashboard, create a firewall rule and give it a name, like “Allow arc.io”.
b. Select Referer from the “Field” dropdown menu, equals from the “Operator” drop down menu, and enter arc.io in the “Value” input.
c. Select Allow from the “Choose an action” menu.
d. Deploy your new firewall rule.
e. The firewall expression preview should look like this: (http.referer eq “arc.io”)
f. Once you’re done following, click the Test on the portal to make sure everything is working properly.
Voila! You are done you have successfully added Arc to your site.
