【问题标题】:Share data between native app and mobile browser在本机应用程序和移动浏览器之间共享数据
【发布时间】:2020-07-19 15:26:17
【问题描述】:

我有一个安装在客户端移动设备上的本机应用程序。 除此之外,我还有一个 Web 应用程序,这个客户端可以通过移动浏览器访问它。

我想在应用程序和网络浏览器之间同步和传递信息(例如标识符或其他用户数据)。 是否有任何 WebAPI 可以帮助我这样做?

我找到了getInstalledRelatedApps,它可以指示我的应用程序是否已安装,但是如何在这两者之间共享信息呢?有没有可能?

【问题讨论】:

  • 您打算以两种方式(www 移动)还是仅一种方式(www -> 移动或移动 -> www)传输数据?
  • 主要在移动应用到浏览器之间
  • 所以你可以从WebView调用JavaScript代码
  • 不错,但如果应用程序不是 webview 应用程序怎么办?
  • 没什么。您可以在WebView 上调用一些 JS 方法,例如javascript:console.log('some super info")` 或Print.postMessage('info')。但没有必要让它可见(或使其可见1px x 1px

标签: javascript android mobile web-applications


【解决方案1】:

您使用什么框架?我可以认为您正在使用 Node JS、React 和 React Native 吗?

您可以在后端使用 express 创建自己的 API,在前端/移动端使用 Axios 调用它,然后您可以通过在路由上设置参数来传递参数。 IE。假设您想将茶 ID 从移动应用程序传递到网络应用程序,以便您可以在导航器上看到它们:

// BACKEND
const express = require('express');
const routes = express.Router();

routes.get('/tea/:teaId', function (req, res) {
  res.send(req.params);
});

module.exports = routes;


// MOBILE
import React from 'react';
import axios from 'axios';
import { Linking } from 'react-native';

const api = axios.create({
  baseURL: 'http://your-url-here.com/',
});

let teaID = 22;

function sendToWeb() {
  Linking.openURL(`https://your-url-here.com/tea/${teaID}`)
}

如果您希望用户登录并跳过登录步骤或与之相关的内容,您还可以传递 Header Authorization。

Express Routing

About Axios

我希望这可以帮助你一点!很抱歉,如果它看起来令人困惑,这是我第一次尝试回答问题!

【讨论】:

  • 感谢您的回答。我不确定您的意思是我将在移动浏览器上获取数据?
  • 数据将通过 URI 传递,即 'your-url-here.com' 之后的部分。通过创建路由,您将让您的应用程序知道您希望它具有什么样的行为(GET、POST、PUT、DELETE)以及该参数需要什么。 IE:路由'your-url-here.com/tea/:teaID'表示为了访问该路由,需要在tea后面有一个数字,在这个例子中就是teaID。因此,通过将用户重定向到“your-url-here.com/tea/5”,您的路线将了解所需的 ID 是 5!
  • 您可以将路由视为一种不同于 SQL 查询的方法来操作数据库中的数据!
  • 但是如何让移动应用和移动浏览器将请求发送到同一个 URL?
  • 通过使用路由,您基本上是在创建自己的 API。例如,您可以将其视为运行 github api。无论您是通过手机还是网络连接,都应该返回相同的值。
猜你喜欢
  • 2021-12-31
  • 1970-01-01
  • 2017-08-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-07-27
  • 2012-03-21
相关资源
最近更新 更多