Amcrest Web View - Browser App Question

[tbwalkeriii]

Hi All,

My questing is simple, at least I think it's simple. I've finally managed to get the Amcrest Web App to work in Google Chrome, and I've even managed to get chrome to place a shortcut on the desktop for the app.

What I would like to know is if there is a way to have the app default launch a specific camera ip address so that when the Amcrest Web App is launch I'm immediately defaulted into an Amcrest Login/Password screen.

The reason I'm asking is because I'm trying to pitch these cameras to our corporate offices as an alternative to the Cisco Meraki cameras they have set as a standard, but I need to be able to present how easy it is to launch and view a camera, and having to plug in an http://x.x.x.x address every time you want to use the app isn't really that user friend for the not technical users I need to present this to.

I know that when launching Google Chrome I can create a shortcut to the actual chrome executable followed by the url that I want chrome to immediately launch, however I tried adding the url to the end of the Amcrest Web View desktop shortcut, Formatting the desktop shortcut target like below, but it only launched the Amcrest Web View as normal, waiting for me to manually put in the url.
"C:\Program Files (x86)\Google\Chrome\Application\chrome_proxy.exe" --profile-directory="Profile 1" --app-id=oddndbjhpcpopbebhonolceinkbnheih http://x.x.x.x

I know I can customize my own AutoIt script to blow in the url when the Amcrest Web View is launched, but I would prefer not to have to engineer another layer to make this camera interface more user friendly to pitch to my companies administration team.

Is there any way to customize the app to default to a URL, or am I out of luck? Any insight would be greatly appreciated.

Thanks,

Ted

[longedge]

For me still using IE it's as simple as setting the home page to http://x.x.x.x in fact I have IE setup with 3 home pages so that when it runs each morning from my startup folder it already has 3 tabs open and I just need to enter the password for each. My default browser is Firefox so the IE settings don't come into play for normal browsing.

I just tried it in Chrome (which I'm not used to) and it worked the same way. After adding a group of 3 pages to Chrome startup I closed Chrome then ran it again and got the login page for each camera on separate tabs which worked except that I don't have the add on installed.

If you have Chrome setup as default browser then doesn't a desktop shortcut to http://x.x.x.x work?

[tbwalkeriii]

Thanks for the reply longedge.

While Internet Explorer does work for me as well, it's a hard sell to my I.T. upper management to try and bring in a new camera technology that only works with a dying browser that is no longer supported my Microsoft.

Also, even though you can browse to an Amcrest camera through Google Chrome, the camera video feed will not be displayed through Google Chrome, even after you install the Amcrest Web View extension, UNLESS you directly launch the Amcrest Web View extension and browse to the camera IP address directly through the Amcrest Web View extension in Google Chrome.

That being said, I was able to modify/customize the Amcrest Web View extension startup page so that it displays a hyperlink message to our Amcrest camera in the Amcrest Web View extension by modifying 2 files located in the extension folder. The two files I modified in the Amcrest Web View extension folder are index.html and index.js

For anyone who might want to do the same, here is the information I have on how to do it (Tested and valid as of September 6, 2019):

DISCLAIMER: I am aware this a bit of work for a small result, but once I figure out a bit of information like this I feel the need to share it, in the event that there is someone else out there who is as crazy as me and wants to try and customize the Amcrest Web View extension for their own needs as well.

Step 1: Install the Amcrest Web View extension into your Google Chrome.
Step 2: Browse to the Amcrest Web View extension folder under your Windows user profile. Depending on how you have your Google Chrome configured, this is currently in one of a few possible locations:

In C:\Users\{user name}\AppData\Local\Google\Chrome\User Data\Profile 1\Extensions\oddndbjhpcpopbebhonolceinkbnheih\1.0.1.4_0 If you have Chrome configured for profiles
OR
in C:\Users\{user name}\AppData\Local\Google\Chrome\User Data\Default\Extensions\oddndbjhpcpopbebhonolceinkbnheih\1.0.1.4_0

I recommend editing these two files in both locations.

Step 3: Once you've browsed to the proper extension folder, open index.html and index.js in your favorite text editor (I prefer NotePad ++)

Step 4: When editing index.js, scroll down to approximately line 300 where you will see a java code snippit example of how this app wants you to create a hyperlink:

Code: Select all

$('#guider').click(function(event) {

        var href = 'https://support.amcrest.com/hc/en-us/articles/214967587-Web-Access-using-Google-Chrome-IP2M-841-';

        $('#l_ip_ipt').val(href);

        $('#l_go_btn').click();

    });

When you find the above code in the index.js file, copy it and paste a copy of it directly below itself, but modify the section with the #guider and change the name. The first section is the ID for the hyperlink you will eventually be creating. Use a short, simple name for this, with no spaces or strange characters. In the example below, I copied the code and changed the $('#guider') to $('#roofcam'). The second section is the URL of the camera you want to be able to easily click/link too. I modified my copy from the Amcrest url and changed it to the IP address of my camera.

Code: Select all

$('#roofcam').click(function(event) {

        var href = 'http://10.1.10.150';

        $('#l_ip_ipt').val(href);

        $('#l_go_btn').click();

    });

Save the changes you've made to index.js and move on to step 5.

Step 5: When editing index.html, scroll down to approximately line 51, just after the first <span> statement. That section should have some default text from Amcrest that looks something like this:

Code: Select all

<span>

To begin, input the IP Address and port of your camera into the URL bar. Your camera's IP address and port can be found on the Amcrest IP Config Tool. Pushing "Enter" or selecting "Go" will load the web interface of the camera and present a login page. You should now have access to view your camera and configure settings.</span>

Once you reach that section, add your own custom hyperlink referencing the ID you created and saved into the index.js file. This will look something like this. Notice that i put the ID file name from the index.js into this hyperlink below:

Code: Select all

<p>Click hear to go to the <a href="" id="[b]roofcam[/b]">Roof Camera</a> login page</p>

Now, whenever you launch the Amcrest Web View extension, the first line on the page should read something like this:


Click here to go to the Roof Camera login page


For any of you out there with a basic understanding of editing HTML files and has had to edit a piece of script in their time, this should work for you as a way to customize the Google Chrome extension for Amcrest to display links to your cameras. Not necessarily a simple method, but it does work.

Ted

[Ben999000]

Thanks Ted, your suggestion worked great for me. I've also been messing around with the NVR viewer chrome extension, aka "Easy Viewer". I found you can also modify the CSS (index.css) file to change up the style of the web page also. I was able to shrink down the toolbar at the top and also make a dark interface since I prefer that.