Comment utiliser l'appel de géolocalisation dans ReactJS

Parfois, une application peut nécessiter les propriétés de localisation actuelles d'un utilisateur, telles que la latitude et la longitude, afin d'activer les fonctionnalités liées à la localisation.

Les propriétés de localisation vous permettent d'accéder à la géolocalisation d' un utilisateur actuel , ou à sa localisation à un moment donné, et de fournir des services spécifiques en fonction de sa zone particulière.

Avec la géolocalisation, vous pouvez accéder aux détails de l'utilisateur, notamment :

Dans ce guide, vous apprendrez à afficher et à mettre à jour la géolocalisation d'un utilisateur sur une carte.

Accéder à la géolocalisation

Vous pouvez accéder à la géolocalisation d'un utilisateur à l'aide de l'API JavaScript navigator.geolocation, qui vous permet de demander une autorisation de localisation. Si l'utilisateur donne l'autorisation, les propriétés de l'emplacement sont accessibles.

Il existe deux méthodes disponibles pour obtenir l'emplacement de l'utilisateur :

  • geolocation.getCurrentPosition()
  • geolocation.watchPosition()

La première étape consiste à savoir si la géolocalisation d'un utilisateur est disponible ou non.

componentDidMount() {
    if ("geolocation" in navigator) {
      console.log("Available");
    } else {
      console.log("Not Available");
    }
  }

Si le code ci-dessus renvoie true, vous pouvez accéder à diverses propriétés de géolocalisation. Si ce n'est pas le cas, l'utilisateur a désactivé l'accès à l'emplacement.

Obtenir la position actuelle

Obtenez la position actuelle de l'utilisateur à l'aide de la navigator.getCurrentPosition()méthode.

import React, { Component } from "react";
import { render } from "react-dom";

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }

  componentDidMount() {
    navigator.geolocation.getCurrentPosition(function(position) {
      console.log("Latitude is :", position.coords.latitude);
      console.log("Longitude is :", position.coords.longitude);
    });
  }

  render() {
    return (
      <div>
        <h4>Using geolocation JavaScript API in React</h4>
      </div>
    );
  }
}

render(<App />, document.getElementById("root"));

Ouvrez la console et la sortie devrait ressembler à ceci.

Latitude is : xx.xxxxxx
Longitude is : xx.xxxxxx

Le xxx peut être n'importe quel nombre en fonction de l'emplacement.

Essayez le code suivant pour obtenir la position complète de l'utilisateur.

componentDidMount() {
    navigator.geolocation.getCurrentPosition(function(position) {
      console.log(position)
    });
  }

La sortie dans la console ressemblera à ceci.

GeolocationPosition {
    coords: GeolocationCoordinates, 
    timestamp: 1583849180132
    }
    coords: { 
        GeolocationCoordinateslatitude: 19.xxxxxxx
        longitude: 73.xxxxxx
        altitude: 
            nullaccuracy: 1158
            altitudeAccuracy: null
            heading: null
            speed: null
            __proto__: GeolocationCoordinates
        timestamp: 1583849180132
    }
__proto__: GeolocationPosition

getCurrentPositionrenvoie l'objet de réussite en tant que propriété de position, mais avec le rappel de réussite, vous avez également le rappel d'erreur. Il peut être implémenté avec le code suivant.

componentDidMount() {
    navigator.geolocation.getCurrentPosition(
      function(position) {
        console.log(position);
      },
      function(error) {
        console.error("Error Code = " + error.code + " - " + error.message);
      }
    );
  }

Le rappel d'erreur est utilisé pour obtenir l'erreur liée à la position, comme interdire l'emplacement, etc. Lorsque vous ouvrez la console et interdisez l'emplacement, vous obtenez une erreur qui ressemble à ceci.

Error Code = 1 - Geolocation has been disabled in this document by Feature Policy

Regarder les mouvements de l'utilisateur

getCurrentPosition, vous permet d'accéder à la position actuelle, mais que se passe-t-il si l'utilisateur change de position ? watchPositionattache la fonction de gestionnaire et s'exécute dès que l'utilisateur modifie son emplacement actuel, renvoyant les propriétés d'emplacement mises à jour pour la nouvelle position de l'utilisateur.

Le code suivant obtiendra les propriétés d'emplacement de base.

import React, { Component } from "react";
import { render } from "react-dom";

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    if (navigator.geolocation) {
      navigator.geolocation.watchPosition(function(position) {
        console.log("Latitude is :", position.coords.latitude);
        console.log("Longitude is :", position.coords.longitude);
      });
    }
  }

  render() {
    return (
      <div>
        <h4>Using geolocation JavaScript API in React</h4>
      </div>
    );
  }
}

render(<App />, document.getElementById("root"));

Ouvrez la console et vous verrez que les nouvelles propriétés de position sont mises à jour dès que l'utilisateur modifie son emplacement.

Afficher la carte après avoir obtenu l'emplacement

Les cartes sont un moyen principal d'afficher la position actuelle d'un utilisateur. Vous aurez besoin de certains paramètres d'emplacement, tels que la latitude et la longitude, pour afficher l'emplacement actuel.

Remarque : Avant d'utiliser une carte, vous devez disposer d'une clé API Google Map. Sinon, la carte ne fonctionnera pas et affichera une erreur.

Installez cette bibliothèque de cartes, qui vous permettra de démarrer rapidement avec une carte.

npm install google-maps-react

En utilisant cette bibliothèque, vous pouvez transmettre les données de localisation et, sur la base de ces données, la localisation spécifique de l'utilisateur sera mise en évidence sur la carte.

Ouvrez le nouveau composant et écrivez l'extrait de code suivant.

import React, { Component } from "react";
import { Map, GoogleApiWrapper, Marker  } from 'google-maps-react';

const mapStyles = {
  width: '100%',
  height: '100%'
};

class Demo1 extends Component {
  constructor() {
    super();
    this.state = {
      name: "React"
    };
  }

  render() {
    return (
      <div>
        <Map
          google={this.props.google}
          zoom={14}
          style={mapStyles}
          initialCenter={{
            lat: YOUR_LATITUDE,
            lng: YOUR_LONGITUDE
          }}
        >
         <Marker
          onClick={this.onMarkerClick}
          name={'This is test name'}
        />
        </Map>
      </div>
    );
  }
}

export default GoogleApiWrapper({
  apiKey: 'API_KEY'
})(Demo1);

Remarque : vous devrez remplacer votre clé API google maps par API_KEY. Sinon, la carte ne pourra pas rendre les propriétés liées à l'emplacement.

En fonction de la latitude et de la longitude, une carte pourra charger l'emplacement exact. L'emplacement sera identifié comme un marqueur sur la carte.

Autres interfaces

JavaScript fournit un certain nombre d'autres interfaces qui fonctionnent étroitement avec les propriétés d'emplacement basées sur différentes exigences fonctionnelles.

  • Geolocation
  • GeolocationCoordinates
  • GeolocationPosition
  • Navigator.geolocation
  • GeolocationPositionError

Dans ce guide, vous avez appris à utiliser les API de géolocalisation de JavaScript pour travailler avec les emplacements des utilisateurs et les propriétés associées. Vous pouvez essayer toutes les API intégrées qui vous permettent de lire les emplacements des utilisateurs et de les traiter en conséquence.

What is GEEK

Buddha Community

joe biden

1617257581

Software de restauración de Exchange para restaurar sin problemas PST en Exchange Server

¿Quiere restaurar los buzones de correo de PST a Exchange Server? Entonces, estás en la página correcta. Aquí, lo guiaremos sobre cómo puede restaurar fácilmente mensajes y otros elementos de PST a MS Exchange Server.

Muchas veces, los usuarios necesitan restaurar los elementos de datos de PST en Exchange Server, pero debido a la falta de disponibilidad de una solución confiable, los usuarios no pueden obtener la solución. Háganos saber primero sobre el archivo PST y MS Exchange Server.

Conozca PST y Exchange Server

PST es un formato de archivo utilizado por MS Outlook, un cliente de correo electrónico de Windows y muy popular entre los usuarios domésticos y comerciales.

Por otro lado, Exchange Server es un poderoso servidor de correo electrónico donde todos los datos se almacenan en un archivo EDB. Los usuarios generalmente guardan la copia de seguridad de los buzones de correo de Exchange en el archivo PST, pero muchas veces, los usuarios deben restaurar los datos del archivo PST en Exchange. Para resolver este problema, estamos aquí con una solución profesional que discutiremos en la siguiente sección de esta publicación.

Un método profesional para restaurar PST a Exchange Server

No le recomendamos que elija una solución al azar para restaurar los datos de PST en Exchange Server. Por lo tanto, al realizar varias investigaciones, estamos aquí con una solución inteligente y conveniente, es decir, Exchange Restore Software. Es demasiado fácil de manejar por todos los usuarios y restaurar cómodamente todos los datos del archivo PST a Exchange Server.

Funciones principales ofrecidas por Exchange Restore Software

El software es demasiado simple de usar y se puede instalar fácilmente en todas las versiones de Windows. Con unos pocos clics, la herramienta puede restaurar los elementos del buzón de Exchange.

No es necesario que MS Outlook restaure los datos PST en Exchange. Todos los correos electrónicos, contactos, notas, calendarios, etc. se restauran desde el archivo PST a Exchange Server.

Todas las versiones de Outlook son compatibles con la herramienta, como Outlook 2019, 2016, 2013, 2010, 2007, etc. La herramienta proporciona varios filtros mediante los cuales se pueden restaurar los datos deseados desde un archivo PST a Exchange Server. El programa se puede instalar en todas las versiones de Windows como Windows 10, 8.1, 8, 7, XP, Vista, etc.

Descargue la versión de demostración del software de restauración de Exchange y analice el funcionamiento del software restaurando los primeros 50 elementos por carpeta.

Líneas finales

No existe una solución manual para restaurar los buzones de correo de Exchange desde el archivo PST. Por lo tanto, hemos explicado una solución fácil e inteligente para restaurar datos de archivos PST en Exchange Server. Simplemente puede usar este software y restaurar todos los datos de PST a Exchange Server.

Más información:- https://www.datavare.com/software/exchange-restore.html

#intercambio de software de restauración #intercambio de restauración #buzón del servidor de intercambio #herramienta de restauración de intercambio

Byte Cipher

1617110327

ReactJS Development Company USA | ReactJS Web Development Company

ByteCipher is one of the leading React JS app development Companies. We offer innovative, efficient and high performing app solutions. As a ReactJS web development company, ByteCipher is providing services for customized web app development, front end app development services, astonishing react to JS UI/UX development and designing solutions, reactJS app support and maintenance services, etc.

#reactjs development company usa #reactjs web development company #reactjs development company in india #reactjs development company india #reactjs development india

Comment utiliser l'appel de géolocalisation dans ReactJS

Parfois, une application peut nécessiter les propriétés de localisation actuelles d'un utilisateur, telles que la latitude et la longitude, afin d'activer les fonctionnalités liées à la localisation.

Les propriétés de localisation vous permettent d'accéder à la géolocalisation d' un utilisateur actuel , ou à sa localisation à un moment donné, et de fournir des services spécifiques en fonction de sa zone particulière.

Avec la géolocalisation, vous pouvez accéder aux détails de l'utilisateur, notamment :

Dans ce guide, vous apprendrez à afficher et à mettre à jour la géolocalisation d'un utilisateur sur une carte.

Accéder à la géolocalisation

Vous pouvez accéder à la géolocalisation d'un utilisateur à l'aide de l'API JavaScript navigator.geolocation, qui vous permet de demander une autorisation de localisation. Si l'utilisateur donne l'autorisation, les propriétés de l'emplacement sont accessibles.

Il existe deux méthodes disponibles pour obtenir l'emplacement de l'utilisateur :

  • geolocation.getCurrentPosition()
  • geolocation.watchPosition()

La première étape consiste à savoir si la géolocalisation d'un utilisateur est disponible ou non.

componentDidMount() {
    if ("geolocation" in navigator) {
      console.log("Available");
    } else {
      console.log("Not Available");
    }
  }

Si le code ci-dessus renvoie true, vous pouvez accéder à diverses propriétés de géolocalisation. Si ce n'est pas le cas, l'utilisateur a désactivé l'accès à l'emplacement.

Obtenir la position actuelle

Obtenez la position actuelle de l'utilisateur à l'aide de la navigator.getCurrentPosition()méthode.

import React, { Component } from "react";
import { render } from "react-dom";

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }

  componentDidMount() {
    navigator.geolocation.getCurrentPosition(function(position) {
      console.log("Latitude is :", position.coords.latitude);
      console.log("Longitude is :", position.coords.longitude);
    });
  }

  render() {
    return (
      <div>
        <h4>Using geolocation JavaScript API in React</h4>
      </div>
    );
  }
}

render(<App />, document.getElementById("root"));

Ouvrez la console et la sortie devrait ressembler à ceci.

Latitude is : xx.xxxxxx
Longitude is : xx.xxxxxx

Le xxx peut être n'importe quel nombre en fonction de l'emplacement.

Essayez le code suivant pour obtenir la position complète de l'utilisateur.

componentDidMount() {
    navigator.geolocation.getCurrentPosition(function(position) {
      console.log(position)
    });
  }

La sortie dans la console ressemblera à ceci.

GeolocationPosition {
    coords: GeolocationCoordinates, 
    timestamp: 1583849180132
    }
    coords: { 
        GeolocationCoordinateslatitude: 19.xxxxxxx
        longitude: 73.xxxxxx
        altitude: 
            nullaccuracy: 1158
            altitudeAccuracy: null
            heading: null
            speed: null
            __proto__: GeolocationCoordinates
        timestamp: 1583849180132
    }
__proto__: GeolocationPosition

getCurrentPositionrenvoie l'objet de réussite en tant que propriété de position, mais avec le rappel de réussite, vous avez également le rappel d'erreur. Il peut être implémenté avec le code suivant.

componentDidMount() {
    navigator.geolocation.getCurrentPosition(
      function(position) {
        console.log(position);
      },
      function(error) {
        console.error("Error Code = " + error.code + " - " + error.message);
      }
    );
  }

Le rappel d'erreur est utilisé pour obtenir l'erreur liée à la position, comme interdire l'emplacement, etc. Lorsque vous ouvrez la console et interdisez l'emplacement, vous obtenez une erreur qui ressemble à ceci.

Error Code = 1 - Geolocation has been disabled in this document by Feature Policy

Regarder les mouvements de l'utilisateur

getCurrentPosition, vous permet d'accéder à la position actuelle, mais que se passe-t-il si l'utilisateur change de position ? watchPositionattache la fonction de gestionnaire et s'exécute dès que l'utilisateur modifie son emplacement actuel, renvoyant les propriétés d'emplacement mises à jour pour la nouvelle position de l'utilisateur.

Le code suivant obtiendra les propriétés d'emplacement de base.

import React, { Component } from "react";
import { render } from "react-dom";

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    if (navigator.geolocation) {
      navigator.geolocation.watchPosition(function(position) {
        console.log("Latitude is :", position.coords.latitude);
        console.log("Longitude is :", position.coords.longitude);
      });
    }
  }

  render() {
    return (
      <div>
        <h4>Using geolocation JavaScript API in React</h4>
      </div>
    );
  }
}

render(<App />, document.getElementById("root"));

Ouvrez la console et vous verrez que les nouvelles propriétés de position sont mises à jour dès que l'utilisateur modifie son emplacement.

Afficher la carte après avoir obtenu l'emplacement

Les cartes sont un moyen principal d'afficher la position actuelle d'un utilisateur. Vous aurez besoin de certains paramètres d'emplacement, tels que la latitude et la longitude, pour afficher l'emplacement actuel.

Remarque : Avant d'utiliser une carte, vous devez disposer d'une clé API Google Map. Sinon, la carte ne fonctionnera pas et affichera une erreur.

Installez cette bibliothèque de cartes, qui vous permettra de démarrer rapidement avec une carte.

npm install google-maps-react

En utilisant cette bibliothèque, vous pouvez transmettre les données de localisation et, sur la base de ces données, la localisation spécifique de l'utilisateur sera mise en évidence sur la carte.

Ouvrez le nouveau composant et écrivez l'extrait de code suivant.

import React, { Component } from "react";
import { Map, GoogleApiWrapper, Marker  } from 'google-maps-react';

const mapStyles = {
  width: '100%',
  height: '100%'
};

class Demo1 extends Component {
  constructor() {
    super();
    this.state = {
      name: "React"
    };
  }

  render() {
    return (
      <div>
        <Map
          google={this.props.google}
          zoom={14}
          style={mapStyles}
          initialCenter={{
            lat: YOUR_LATITUDE,
            lng: YOUR_LONGITUDE
          }}
        >
         <Marker
          onClick={this.onMarkerClick}
          name={'This is test name'}
        />
        </Map>
      </div>
    );
  }
}

export default GoogleApiWrapper({
  apiKey: 'API_KEY'
})(Demo1);

Remarque : vous devrez remplacer votre clé API google maps par API_KEY. Sinon, la carte ne pourra pas rendre les propriétés liées à l'emplacement.

En fonction de la latitude et de la longitude, une carte pourra charger l'emplacement exact. L'emplacement sera identifié comme un marqueur sur la carte.

Autres interfaces

JavaScript fournit un certain nombre d'autres interfaces qui fonctionnent étroitement avec les propriétés d'emplacement basées sur différentes exigences fonctionnelles.

  • Geolocation
  • GeolocationCoordinates
  • GeolocationPosition
  • Navigator.geolocation
  • GeolocationPositionError

Dans ce guide, vous avez appris à utiliser les API de géolocalisation de JavaScript pour travailler avec les emplacements des utilisateurs et les propriétés associées. Vous pouvez essayer toutes les API intégrées qui vous permettent de lire les emplacements des utilisateurs et de les traiter en conséquence.

joe biden

1617255938

¿Cómo migrar los buzones de correo de Exchange a la nube de Office 365?

Si tiene problemas para migrar los buzones de correo de Exchange a Office 365, debe leer este artículo para saber cómo migrar los buzones de correo de Exchange EDB a Office 365. Al migrar a Office 365, los usuarios pueden acceder a sus buzones de correo desde cualquier lugar y desde cualquier dispositivo.

En esta publicación, explicaremos las razones detrás de esta migración y una solución profesional para migrar de Exchange a Office 365.

Razones para migrar Exchange Server a la nube de Office 365

Office 365 apareció por primera vez en 2011 y, dado que se considera la mejor plataforma para aquellas organizaciones que desean administrar todo su sistema de correo electrónico en la nube. Estas son las características clave de Office 365:

  1. Permite trabajar desde cualquier lugar y desde cualquier lugar.
  2. No se preocupe por el spam y el malware.
  3. La seguridad proporcionada por Office 365 es altamente confiable.
  4. Controla el costo total y brinda flexibilidad financiera.
  5. Todas las actualizaciones y mejoras son administradas por Microsoft.

¿Cómo migrar los buzones de correo de Exchange a Office 365?

Hay varias formas manuales de migrar los buzones de correo de Exchange EDB a Office 365, pero para evitar estos complicados y prolongados procedimientos, presentamos una solución de terceros, es decir, la herramienta de migración de Exchange, que es automatizada y directa para la migración de Exchange a Office 365. La herramienta funciona rápidamente y migra todos los elementos del buzón de Exchange Server a Office 365.

La herramienta de migración de Datavare Exchange es demasiado fácil de usar y ofrece pasos sencillos para migrar EDB a Office 365:

  1. Descargue e instale el software en su sistema.
  2. Agregue el archivo EDB de Exchange con el botón Examinar.
  3. Seleccione exportar a buzones de correo de Office 365.
  4. Proporcione los detalles de inicio de sesión de la cuenta de Office 365.
  5. Seleccione la carpeta y presione el botón Finalizar.

Por lo tanto, todos sus buzones de correo de Exchange EDB ahora se migran a Office 365.
Nota: puede usar filtros para migrar los elementos de datos deseados de la cuenta de Exchange a la de Office 365

Líneas finales

Este blog le indica una solución profesional para la migración de buzones de correo de Exchange a la cuenta de Office 365. Dado que las soluciones manuales son complicadas, sugerimos la herramienta de migración de Exchange, que es demasiado simple de usar. Los usuarios no se enfrentan a problemas al operar el programa. La mejor parte de este software es que no necesita habilidades técnicas para realizar la migración. Se puede comprender el funcionamiento del software descargando la versión de demostración que permite la migración de los primeros 50 elementos por carpeta.

Más información:- https://www.datavare.com/software/edb-migration.html

#herramienta de migración de intercambio #migración de intercambio #migrar buzones de correo de exchange

Top React JS App Development Company in USA | React JS Services

Hire ReactJS app developers for end-to-end services starting from development to customization with AppClues Infotech.

Are you looking for the best company in USA that provides high-quality ReactJS app development services? Having expertise in building robust and real-time mobile apps using React Native Library.

We can fully support your specific business idea with outstanding tech skills and deliver a perfect mobile app on time.

Our ReactJS App Development Services
• Custom ReactJS Development
• ReactJS Consulting
• React UX/UI development and design
• App modernization using React
• React Native mobile development
• Dedicated React development team
• Application migration to React

For more info:
Website: https://www.appcluesinfotech.com/
Email: info@appcluesinfotech.com
Call: +1-978-309-9910

#top reactjs app development company in usa #hire best reactjs app developers #best reactjs app development services #custom reactjs app development agency #how to develop reactjs app #cost to build reactjs application