Hi Im using the below code to successfully get user location, but in the android emulator it is not asking user if they want to share their location (even after I reinstall the app).
The code works which is great....but I really would like the standard alert to appear which says "are you sure you want to share your location with the app"
Any guidance would be appreciated
navigator.geolocation.getCurrentPosition(
(pos) => {
console.log(pos.coords.longitude, pos.coords.latitude);
I think location permission not show again event you reinstall app because phone still remember permissions granted for app. You can check app have permission granted in Android Setting with App (https://www.howtogeek.com/230683/how-to-manage-app-permissions-on-android-6.0/).
Maybe this code can help you
import { PermissionsAndroid } from 'react-native';
async function getLocation() {
try {
const granted = await PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
{
'title': 'App',
'message': 'are you sure you want to share your location with the app ?'
}
)
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
// permission granted
// do code get location here.
navigator.geolocation.getCurrentPosition(
(pos) => {
console.log(pos.coords.longitude, pos.coords.latitude);
})
} else {
// permission denied
console.log("GPS permission denied")
}
} catch (err) {
console.warn(err)
}
}
Related
I am building an app in ReactJS that requires the user's location. In the browser (Chrome) on my PC I get a prompt once. If I decline, the prompt will not show again upon a page refresh. However, I will get the option to manually enable location.
When I open the same web page on my android phone in Chrome I neither get a prompt nor the option to enable location access manually. I have looked for solutions through Google but all of them rely on a prompt being automatically shown upon a navigator.geolocation.getCurrentPosition call, but it doesn't.
This is my code:
function getUserLocation() {
if ("geolocation" in navigator) {
navigator.geolocation.getCurrentPosition(
function (position) {
setLocationDidMount(true);
console.log("got position");
},
function errorCallback(error) {
console.log(error);
navigator.permissions
.query({ name: "geolocation" })
.then(function (result) {
if (result.state === "granted") {
console.log(result.state);
//If granted then you can directly call your function here
} else if (result.state === "prompt") {
console.log(result.state);
} else if (result.state === "denied") {
console.log("location access denied by user");
//If denied then you have to show instructions to enable location
}
result.onchange = function () {
console.log(result.state);
};
});
},
{
timeout: 5000,
}
);
} else {
console.log("Not Available");
}
}
How to handle this problem? Btw, I'm not supposed to use React-Native.
As is pointed out by the article shared by Sergey, mobile browsers will only handle location properly when there is an SSL certificate in place.
While causing a warning, installing a local certificate using OpenSSL did fix the problem.
When I try to read my Firebase Storage data I'm getting the following error:
Uncaught (in promise) FirebaseError: Firebase Storage: An unknown error occurred, please check the error payload for server response. (storage/unknown)
{
"error": {
"code": 400,
"message": "Permission denied. Please enable Firebase Storage for your bucket by visiting the Storage tab in the Firebase Console and ensure that you have sufficient permission to properly provision resources."
}
}
But my rules are set to public:
rules_version = '2';
service firebase.storage {
match /b/{bucket}/o {
match /{allPaths=**} {
allow read, write;
}
}
}
What am I missing? Here's my code:
export const getAll = async () => {
let list: Photo[] = [];
const imagesFolder = ref(storage, "images");
const photoList = await listAll(imagesFolder);
for(let i in photoList.items) {
let photoUrl = await getDownloadURL(photoList.items[i]);
list.push({
name: photoList.items[i].name,
url: photoUrl
});
}
return list;
}
Following the steps in this post fixed my issue:
This is due to a missing permission:
firebase-storage#system.gserviceaccount.com
Go to https://console.cloud.google.com
Select your project in the top blue bar
Scroll down the left menu and select "Cloud Storage"
Select all your buckets then click "ADD PRINCIPAL" on the right
Add "firebase-storage#system.gserviceaccount.com" and "Storage
Admin" as a role
Save it
https://newbedev.com/firebase-storage-security-rules-400-error-issue-permission-denied-could-not-access-bucket-xxxxx-appspot-com
Before you setting for storage admin, make sure you have activate your google cloud platform. Because it's can be the first cause, if you use firebase storage and you never use google cloud platform before
I'm not too familiar with the terms, so please bear with me.
I'm working on a CMS site using react. We've already got logon via AWS Cognito in place, and we used to have a page that displays GameFleet data.
However, the Aliases and Fleets have been moved to a subaccount:
And as such the GameFleet page is empty.
I've initially overcome this problem by creating an IdentityPool (and roles) for the DevRole subaccount, as the CMS retrieves the GameFleet data via the following code:
componentDidMount() {
AWS.config.region = REGION;
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
IdentityPoolId: IDENTITY_POOL_ID // <--- Changed this to new IdentityPoolId
});
AWS.config.credentials.get(function(err) {
if (err) console.log(err);
else console.log(AWS.config.credentials);
});
await this.requestGameLiftData();
};
requestGameLiftData = async () => {
const gamelift = new AWS.GameLift();
try {
const aliasData = await new Promise((resolve, reject) => {
gamelift.listAliases({}, function(err, data) {
if (err) { reject("Aliases failed");}
else { resolve(data); }
});
});
} catch (error) {
console.log(error);
}
};
But the problem now is that there is a new subaccount, one I don't have access to, and I can foresee that new subaccounts might be created which won't have the necessary IdentityPoolId required for my approach.
I've been told accessing the subaccount GameLift data from the root account should be possible, but I'm not sure how. I've been looking at the IAM page under the main account, but there doesn't seem to be anything there that could point to the subaccounts.
Am I missing anything?
You need to use AWS Assume roles functionality here using which your primary account can assume role of secondary account and get temporary credentials of sub-account which can be used to pull the data from sub-account from primary account.
https://docs.aws.amazon.com/STS/latest/APIReference/API_AssumeRole.html
I`ve tried to register my app as Web application, generate the user id and implement it in my code but get an error when I press my button for log in with google:
[Unhandled promise rejection: Error: Please provide the appropriate client ID.
enter image description here
If you're using expo, you have to configure the google sign-in like this. This is my configuration. You have to create androidClientId and iosClientId from your account and use it here.
Disclaimer: This is a standalone function only for signingin/signingup a Google user and fetching details. To configure it with firebase you have to add other functions too.
Also, make sure that you're importing this package. I faced a similar problem when I used another package.
import * as Google from 'expo-google-app-auth'
Additionally, are you using the latest version of expo SDK?
async signInWithGoogleAsync() {
try {
const result = await Google.logInAsync({
androidClientId:
'your-id',
iosClientId:
'your-id',
scopes: ['profile', 'email'],
permissions: ['public_profile', 'email', 'gender', 'location']
})
if (result.type === 'success') {
/*put your logic here, I set some states and navigate to home screen
after successful signin.*/
const googleUser = result.user
this.setState({
email: googleUser.email,
name: googleUser.name,
})
this.navigateToLoadingScreen()
return result.accessToken
} else {
return { cancelled: true }
}
} catch (e) {
return { error: true }
}
}
I'm trying to implement the Generic Sensor API in a React app.
https://www.w3.org/TR/generic-sensor/#the-sensor-interface
I keep getting an error when I try to implement any of the sensors in my code.
For example:
var sensor1 = new AmbientLightSensor();
I get the error: Cannot find name: 'AmbientLightSensor'.
I assume that I need an import statement in my code. All of the examples I've found only include LitElement. I've even tried that but still get the unknown error.
What import statements do I need in my typescript code?
What npm packages do I need?
Below is the typescript code I'm using.
I'm getting a typescript error:
/Users/scoleman/dev/current/bigbrother/src/utility/testAccel.ts(14,24):
Cannot find name 'AmbientLightSensor'. TS2304
export const testAccel = async (
databaseName: string,
) => {
const {state} = await navigator.permissions.query({
name: "ambient-light-sensor"
});
if (state !== "granted") {
console.warn("You haven't granted permission to use the light sensor");
return;
}
const sensor = new AmbientLightSensor();
sensor.addEventListener("reading", () => {
console.log(sensor.illuminance);
});
sensor.addEventListener("error", (err: any) => {
console.error(err);
});
sensor.start();
};
I was able to get these api's running using the polyfill at:
https://github.com/kenchris/sensor-polyfills
This would depend entirely on the browser you are using. I don't think FireFox supports it at the moment so I will focus on Chrome.
Firstly, you might need to be serving your site over HTTPS. It seems like this almost varies from permission to permission and also some are available on a localhost URL no matter what.
Secondly, for Chrome, you have to enable the "Generic Sensor Extra Classes" flag in Chrome at the chrome://flags/#enable-generic-sensor-extra-classes page.
Next, you need to make sure that have permission from the user to use the sensor, then you could actually use it. A snippet that would check that is as follows:
(async function(){
const {state} = await navigator.permissions.query({
name: "ambient-light-sensor"
});
if (state !== "granted") {
console.warn("You haven't granted permission to use the light sensor");
return;
}
const sensor = new AmbientLightSensor();
sensor.addEventListener("reading", () => {
console.log(sensor.illuminance);
});
sensor.addEventListener("error", err => {
console.error(err);
});
sensor.start();
}());