My dApp can use Metamask accounts with givenProvider but not when setting Web3 object to Rinkeby provider URL?

Question

Today is the first day I deployed to a test network (Rinkeby) and not my local Ganache client network. I think I need clarification on accounts when it comes to Metamask and Rinkeby.

If I initialize the Web3 object on creation on the client side to the givenProvider property, I can access my Metamask accounts when I execute a getAccounts() method call from my web page Javascript code. However, if I instead initialize the Web3 object using the Infura API decorated Rinkeby URL, I get an empty result when I make the call to getAccounts(). I'm guessing that this is because the accounts aren't "on Rinkeby" (not sure how else to say that) but are maintained by the Metamask wallet?

My overall objective is to be able to have the server specify the desired network instead of relying on Metamask to be set to the desired Ethereum network when my dApp's web page is run.

Also, does anybody know how to initialize the Web3 object without having the Infura API key visible to someone tracing the code in the browser debugger?

// This is how I get a valid accounts result.  Metamask is currently set to Rinkeby.
const Web3 = require('web3');   
const localWeb3 = new Web3(Web3.givenProvider); 

localWeb3.eth.getAccounts()
.then(function (result) {}

// This results in an empty accounts result.
const Web3 = require('web3');   
const localWeb3 = new Web3("https://rinkeby.infura.io/<redacted>"); 

localWeb3.eth.getAccounts()
.then(function (result) {}

Answer 1

It happens because when it calls using the Web3.givenProvider it will never reach the Ethereum node to query the accounts, instead, they are just returning your accounts on Metamask, and calls for Rinkeby using Infura return nothing, because there's no account registered there. Perhaps Infura does not provide the backend for getAccounts method.