Overview

App Linking allows links to work across platforms even on devices where your app is not installed. You can use these links to direct users to promotional information or native app content that they can share with others. You can create links of App Linking and send them to users, or allow users to share links dynamically generated in your app. Anyone who receives a link can tap it to access the linked content.
When a user taps a link of App Linking:

What You Will Create

In this codelab, you will build a HarmonyOS app that integrates App Linking. Your app will:

What You Will Learn

Hardware Requirements

Software Requirements

Required Knowledge

To integrate App Linking of AppGallery Connect, you must complete the following preparations:

  1. Create an app in AppGallery Connect.
  2. Create a DevEco Studio project.
  3. Add the app package name.
  4. Add the AppGallery Connect plugin and Maven repository address.
  5. Add configurations to the entry module in the HAP file.
  6. Synchronize the project.
For details, please refer to Integration Preparations.

Enabling App Linking

  1. Click My projects in AppGallery Connect, click your project card, and select your app for which you want to enable App Linking from the drop-down list on the top. Go to Grow > App Linking. If it is the first time that you use App Linking, click Use now in the upper right corner.
  2. If the data processing location is not set, set it for your app.

Integrating the App Linking SDK

If you are using DevEco Studio, you can integrate SDKs by using the Maven repository into your DevEco Studio project before development.

  1. Click My projects in AppGallery Connect, click your project card, and select your app for which you want to use App Linking from the drop-down list on the top.
  2. Go to Project settings > General information, and click agconnect-services.json to download it.
  3. Copy the agconnect-services.json file to the directory of the entry module.
  4. Open the build.gradle file under entry and add the following code to integrate the App Linking SDK:
    dependencies { 
    ... 
    implementation 'com.huawei.agconnect:agconnect-applinking-harmony:1.1.0.300' 
    ... 
}
  5. Click Sync Now to synchronize the configuration.

You can create a page in your DevEco Studio project and design the UI according to the following figure, with buttons to create and share links of App Linking.

The sample code for the layout file is as follows:

<?xml version="1.0" encoding="utf-8"?> 
<DirectionalLayout 
        xmlns:ohos="http://schemas.huawei.com/res/ohos" 
        ohos:height="match_parent" 
        ohos:width="match_parent" 
        ohos:alignment="top" 
        ohos:orientation="vertical"> 
 
    <Text 
            ohos:id="$+id:AppLinking" 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:layout_alignment="horizontal_center" 
            ohos:top_margin="100" 
            ohos:text_size="80" 
            ohos:left_margin="60" 
            ohos:right_margin="60" 
            ohos:multiple_lines="true" 
            ohos:text="AppLinking" 
    /> 
 
    <Button 
            ohos:id="$+id:createButton" 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:layout_alignment="horizontal_center" 
            ohos:top_margin="30vp" 
            ohos:text_size="80" 
            ohos:background_element="$graphic:background_ability_main" 
            ohos:text="Create link" 
    /> 
 
    <Text 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:left_margin="60" 
            ohos:right_margin="60" 
            ohos:multiple_lines="true" 
            ohos:text_size="60" 
            ohos:text="Short link" 
    /> 
 
    <Text 
            ohos:id="$+id:shortlink" 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:left_margin="60" 
            ohos:right_margin="60" 
            ohos:multiple_lines="true" 
            ohos:text_size="40" 
    /> 
 
    <Text 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:top_margin="20" 
            ohos:left_margin="60" 
            ohos:right_margin="60" 
            ohos:multiple_lines="true" 
            ohos:text_size="60" 
            ohos:text="Long link" 
    /> 
 
    <Text 
            ohos:id="$+id:longlink" 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:top_margin="20" 
            ohos:left_margin="60" 
            ohos:right_margin="60" 
            ohos:multiple_lines="true" 
            ohos:text_size="40" 
    /> 
 
    <Button 
            ohos:id="$+id:shareLongButton" 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:top_margin="30vp" 
            ohos:layout_alignment="horizontal_center" 
            ohos:text_size="80" 
            ohos:background_element="$graphic:background_ability_main" 
            ohos:text="Share long link" 
    /> 
 
    <Button 
            ohos:id="$+id:shareShortButton" 
            ohos:height="match_content" 
            ohos:width="match_content" 
            ohos:top_margin="30vp" 
            ohos:layout_alignment="horizontal_center" 
            ohos:text_size="80" 
            ohos:background_element="$graphic:background_ability_main" 
            ohos:text="Share short link" 
    /> 
</DirectionalLayout>
  1. Sign in to AppGallery Connect and click My projects.
  2. Click your project card and select an app from the app drop-down list on the top.
  3. Go to Grow > App Linking. Click the URL prefixes tab and click New URL prefix. In the Set domain name area, enter a URL prefix used in this codelab.
  4. Click Next. The system automatically checks whether the URL prefix is available.

When creating links of App Linking in your app, you need to specify the URL prefix and deep link. In this codelab, the URL prefix and deep link have been configured.
  1. Import related classes to MainAbilitySlice.
    import com.huawei.agconnect.applinking.AppLinking; 
import com.huawei.agconnect.applinking.ResourceTable; 
import ohos.aafwk.ability.AbilitySlice; 
import ohos.aafwk.content.Intent; 
import ohos.aafwk.content.Operation; 
import ohos.agp.components.Button; 
import ohos.agp.components.Component; 
import ohos.agp.components.Text; 
import ohos.hiviewdfx.HiLog; 
import ohos.hiviewdfx.HiLogLabel; 
import ohos.utils.net.Uri;
  2. Define UI elements in the onStart method.
    Button createButton = (Button) findComponentById(ResourceTable.Id_createButton); 
Button shareLongButton = (Button) findComponentById(ResourceTable.Id_shareLongButton); 
Button shareShortButton = (Button) findComponentById(ResourceTable.Id_shareShortButton); 
 
createButton.setClickedListener(new Component.ClickedListener() { 
           @Override 
           public void onClick(Component component) { 
               createLinking(); 
           } 
}); 
 
shareLongButton.setClickedListener(new Component.ClickedListener() { 
    @Override 
    public void onClick(Component component) { 
        shareLink(longLink.getText()); 
    } 
}); 
 
shareShortButton.setClickedListener(new Component.ClickedListener() { 
    @Override 
    public void onClick(Component component) { 
        shareLink(shortLink.getText()); 
    } 
});
  3. Initialize an App Linking instance.
    AGConnectAppLinking.getInstance();
  4. Create a link of App Linking.
    public void createLinking(){ 
    AppLinking.Builder builder = 
            AppLinking.newBuilder() 
                    .setIsShowPreview(true) 
                    .setUriPrefix(DOMAIN_URI_PREFIX) 
                    .setDeepLink(Uri.parse(DEEP_LINK)) 
                    .setHarmonyLinkInfo( 
                            AppLinking.HarmonyLinkInfo.newBuilder() 
                                    .setHarmonyDeepLink("agckit://helloWorld") 
                                    .build()) 
                    .setCampaignInfo( 
                            AppLinking.CampaignInfo.newBuilder() 
                                    .setName("HDC") 
                                    .setSource("Huawei") 
                                    .setMedium("App") 
                                    .build()) 
                    // Display the preview page. 
                    .setPreviewType(AppLinking.LinkingPreviewType.SocialInfo) 
                    .setSocialCardInfo( 
                            AppLinking.SocialCardInfo.newBuilder() 
                                    .setDescription("HDC") 
                                    .setTitle("Huawei") 
                                    .setImageUrl("https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3862731350,3483076630&fm=26&gp=0.jpg") 
                                    .build()); 
    LongUri = builder.buildAppLinking().getUri().toString(); 
    longLink.setText(LongUri); 
    HiLog.info(hiLogLabel,"this is LongUri: " + LongUri); 
 
    builder.buildShortAppLinking().addOnSuccessListener(shortAppLinking -> 
    { 
        ShortUri = shortAppLinking.getShortUrl().toString(); 
        shortLink.setText(ShortUri); 
        HiLog.info(hiLogLabel,"this is ShortLink: " + ShortUri); 
    }).addOnFailureListener(e -> { 
 
    }); 
}
  5. Share the created link of App Linking.
    public void shareLink(String appLinking){ 
    if (appLinking != null) { 
        Intent intent = new Intent(); 
        Operation operation = new Intent.OperationBuilder().withUri(Uri.parse(appLinking)).build(); 
        intent.setOperation(operation); 
        startAbility(intent); 
    } 
}
  1. Before your app receives links, add the skills field to the config.json file of your HarmonyOS project to specify the links of App Linking to be processed. Currently, to use deep links to receive data, you need to add the following configuration to the ability for processing links:
    "skills": [ 
  { 
	"entities": [ 
	  "entity.system.home", 
	  "android.intent.action.VIEW" 
	], 
	"actions": [ 
	  "action.system.home", 
	  "entity.system.default", 
	  "entity.system.browsable" 
	], 
	"uris": [ 
	  { 
		"scheme": "agckit", 
		"host": "www.example.com" 
	  } 
	] 
  } 
]
  2. Call AGConnectAppLinking.getInstance() in the ability that needs to receive links to initialize the AGConnectAppLinking instance.
    AGConnectAppLinking.getInstance() 
            .getAppLinking(getAbility()) 
            .addOnSuccessListener( 
                    resolvedLinkData -> { 
                        if(resolvedLinkData != null){ 
                            StringBuilder stringBuffer = new StringBuilder(); 
                            if(resolvedLinkData.getDeepLink() != null){ 
                                stringBuffer.append(resolvedLinkData.getDeepLink().toString()); 
                                // Redirect to the actual page after parsing the deep link. 
                                Intent intents = new Intent(); 
                                intents.setUri(Uri.parse(resolvedLinkData.getDeepLink().toString())); 
                                startAbility(intents); 
                            } 
                        } 
                    }) 
            .addOnFailureListener( 
                    e -> { 
                        AGCLogger.e("ApplinkingAbilitySlice", "getAppLinking:onFailure", e); 
                    });
  1. Start DevEco Studio and click the run button to run your app on a mobile phone or simulator. Tap Create link. You can see short and long links generated by the SDK.
  2. Tap Share long link to open the link in a browser. On the displayed page, tap Open/Download. If you are redirected to an app store for app download, the link generated by the SDK is able to launch the app. The test method for a short link is the same.

Well done. You have successfully built an app that integrates App Linking of AppGallery Connect and learned how to:

 Code copied