如何使用HTML5在Nexus上获取NFC标签ID

时间:2014-10-25 06:56:29

标签: android html5 nfc

我正在构建一个读取NFC标签的HTML5应用程序。它正在台式机上运行,​​我使用阅读器来阅读NFC标签。我想在Nexus上运行此应用并从Nexus读取NFC ....有谁知道如何让Nexus读取NFC标签并将标签ID放在文本框上?

1 个答案:

答案 0 :(得分:2)

我们在our Android and iOS SDKs中使用此方法。对于Android,您需要设置一个注册NFC意图ACTION_TAG_DISCOVERED的简单应用,然后将tag ID推送到变量。然后,您可以使用简单的JavaScript注入方法将该数据导入Webview。这是一个示例,从HTML页面(index.html)开始:

<!doctype html>
<html>
<head>
    </head>
    <body>
        <center>
            <input class="input-text" name="UUID" id="UUID" value="empty">
        </center>
    </body>
</html>

Android Layout(activity_main.xml):

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:layout_gravity="center"
    android:orientation="vertical">

    <WebView 
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
        android:layout_weight=".5"
       android:id="@+id/webview" ></WebView>

</LinearLayout>

和java代码(MainAcitivity.java):

package com.authorwjf.javascriptinjection;

import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.EditText;
import android.annotation.SuppressLint;
import android.app.Activity;

public class MainActivity extends Activity implements OnClickListener {

    private static final String URL = "file:///android_asset/index.html";
    private static final String tagUUID = "empty";
    private WebView mWebView;

    @SuppressLint("SetJavaScriptEnabled")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mWebView = (WebView) findViewById(R.id.webview); 
        mWebView.getSettings().setJavaScriptEnabled(true);
        mWebView.setWebChromeClient(new WebChromeClient());
        mWebView.setWebViewClient(new WebViewClient(){
            @Override
            public void onPageFinished(WebView view, String url) {
                String javascript="javascript: document.getElementById('UUID').value="+tagUUID+";";
                view.loadUrl(javascript);
            }
        });

        IntentFilter mFilter = new IntentFilter(ACTION_TAG_DISCOVERED);
        BroadcastReceiver mScanReceiver = new BroadcastReceiver() {
            @Override
            public void onReceive(Context context, Intent intent) {
                String s = intent.getAction();
                if (NfcAdapter.ACTION_TAG_DISCOVERED.equals(s)) {
                    Tag tag = (Tag) intent.getParcelableExtra(NfcAdapter.EXTRA_TAG);
                    byte[] tagIDBytes = tag.getId();
                    String tagId = bytesToHexString(tagIDBytes);
                    MainActivity.this.PostToWebview(tagId);
                }
            }
        };

        registerReceiver(mScanReceiver, mFilter);
        refreshWebView();
    }

    public void PostToWebview(final String tagId) {
        tagUUID = tagId;
        refreshWebView();
    }

    private void refreshWebView() {
        mWebView.loadUrl(URL);
    }
}

我在编辑器中汇总了最后一篇文章而没有对其进行测试,因此可能会出现一些语法错误。总体而言,它应该为您提供所需的一切,让您的工作得到满足。使用a mobile NFC reader也可以在iOS上执行此操作。它涉及的更多,但we can help get you going